fix(@angular/ssr): handle nested redirects not explicitly defined in router config

This commit ensures proper handling of nested redirects that are implicitly structured but not explicitly defined in the router configuration.

Closes #28903

Author: alan-agius4

packages/angular/ssr/src/app.ts

@@ -24,7 +24,12 @@ import { sha256 } from './utils/crypto';
 import { InlineCriticalCssProcessor } from './utils/inline-critical-css';
 import { LRUCache } from './utils/lru-cache';
 import { AngularBootstrap, renderAngular } from './utils/ng';
-import { joinUrlParts, stripIndexHtmlFromURL, stripLeadingSlash } from './utils/url';
+import {
+  addLeadingSlash,
+  joinUrlParts,
+  stripIndexHtmlFromURL,
+  stripLeadingSlash,
+} from './utils/url';
 
 /**
  * Maximum number of critical CSS entries the cache can store.
@@ -160,11 +165,17 @@ export class AngularServerApp {
 
     const { redirectTo, status, renderMode } = matchedRoute;
     if (redirectTo !== undefined) {
+      let redirectBaseUrl = url;
+      if (redirectTo[0] !== '/') {
+        redirectBaseUrl = new URL(stripIndexHtmlFromURL(url));
+        redirectBaseUrl.pathname = addLeadingSlash(redirectBaseUrl.pathname);
+      }
+
       // Note: The status code is validated during route extraction.
       // 302 Found is used by default for redirections
       // See: https://developer.mozilla.org/en-US/docs/Web/API/Response/redirect_static#status
       // eslint-disable-next-line @typescript-eslint/no-explicit-any
-      return Response.redirect(new URL(redirectTo, url), (status as any) ?? 302);
+      return Response.redirect(new URL(redirectTo, redirectBaseUrl), (status as any) ?? 302);
     }
 
     if (renderMode === RenderMode.Prerender) {

packages/angular/ssr/src/routes/ng-routes.ts

@@ -151,26 +151,28 @@ async function* traverseRoutesConfig(options: {
 
       delete metadata.presentInClientRouter;
 
-      // Handle redirects
-      if (typeof redirectTo === 'string') {
-        const redirectToResolved = resolveRedirectTo(currentRoutePath, redirectTo);
+      if (metadata.renderMode === RenderMode.Prerender) {
+        // Handle SSG routes
+        yield* handleSSGRoute(
+          metadata,
+          typeof redirectTo === 'string' ? redirectTo : undefined,
+          parentInjector,
+          invokeGetPrerenderParams,
+          includePrerenderFallbackRoutes,
+        );
+      } else if (typeof redirectTo === 'string') {
+        // Handle redirects
         if (metadata.status && !VALID_REDIRECT_RESPONSE_CODES.has(metadata.status)) {
           yield {
             error:
               `The '${metadata.status}' status code is not a valid redirect response code. ` +
               `Please use one of the following redirect response codes: ${[...VALID_REDIRECT_RESPONSE_CODES.values()].join(', ')}.`,
           };
+
           continue;
         }
-        yield { ...metadata, redirectTo: redirectToResolved };
-      } else if (metadata.renderMode === RenderMode.Prerender) {
-        // Handle SSG routes
-        yield* handleSSGRoute(
-          metadata,
-          parentInjector,
-          invokeGetPrerenderParams,
-          includePrerenderFallbackRoutes,
-        );
+
+        yield { ...metadata, redirectTo };
       } else {
         yield metadata;
       }
@@ -215,13 +217,15 @@ async function* traverseRoutesConfig(options: {
  * all parameterized paths, returning any errors encountered.
  *
  * @param metadata - The metadata associated with the route tree node.
+ * @param redirectTo - Optional path to redirect to, if specified.
  * @param parentInjector - The dependency injection container for the parent route.
  * @param invokeGetPrerenderParams - A flag indicating whether to invoke the `getPrerenderParams` function.
  * @param includePrerenderFallbackRoutes - A flag indicating whether to include fallback routes in the result.
  * @returns An async iterable iterator that yields route tree node metadata for each SSG path or errors.
  */
 async function* handleSSGRoute(
   metadata: ServerConfigRouteTreeNodeMetadata,
+  redirectTo: string | undefined,
   parentInjector: Injector,
   invokeGetPrerenderParams: boolean,
   includePrerenderFallbackRoutes: boolean,
@@ -239,6 +243,10 @@ async function* handleSSGRoute(
     delete meta['getPrerenderParams'];
   }
 
+  if (redirectTo !== undefined) {
+    meta.redirectTo = redirectTo;
+  }
+
   if (!URL_PARAMETER_REGEXP.test(currentRoutePath)) {
     // Route has no parameters
     yield {
@@ -301,30 +309,6 @@ async function* handleSSGRoute(
   }
 }
 
-/**
- * Resolves the `redirectTo` property for a given route.
- *
- * This function processes the `redirectTo` property to ensure that it correctly
- * resolves relative to the current route path. If `redirectTo` is an absolute path,
- * it is returned as is. If it is a relative path, it is resolved based on the current route path.
- *
- * @param routePath - The current route path.
- * @param redirectTo - The target path for redirection.
- * @returns The resolved redirect path as a string.
- */
-function resolveRedirectTo(routePath: string, redirectTo: string): string {
-  if (redirectTo[0] === '/') {
-    // If the redirectTo path is absolute, return it as is.
-    return redirectTo;
-  }
-
-  // Resolve relative redirectTo based on the current route path.
-  const segments = routePath.split('/');
-  segments.pop(); // Remove the last segment to make it relative.
-
-  return joinUrlParts(...segments, redirectTo);
-}
-
 /**
  * Builds a server configuration route tree from the given server routes configuration.
  *
@@ -456,7 +440,6 @@ export async function getRoutesFromAngularRouterConfig(
         includePrerenderFallbackRoutes,
       });
 
-      let seenAppShellRoute: string | undefined;
       for await (const result of traverseRoutes) {
         if ('error' in result) {
           errors.push(result.error);
@@ -542,7 +525,7 @@ export async function extractRoutesAndCreateRouteTree(
   );
 
   for (const { route, ...metadata } of routes) {
-    if (metadata.redirectTo !== undefined) {
+    if (metadata.redirectTo?.[0] === '/') {
       metadata.redirectTo = joinUrlParts(baseHref, metadata.redirectTo);
     }
 

packages/angular/ssr/test/routes/ng-routes_spec.ts

@@ -46,7 +46,7 @@ describe('extractRoutesAndCreateRouteTree', () => {
     expect(routeTree.toObject()).toEqual([
       { route: '/', renderMode: RenderMode.Server },
       { route: '/home', renderMode: RenderMode.Client },
-      { route: '/redirect', renderMode: RenderMode.Server, status: 301, redirectTo: '/home' },
+      { route: '/redirect', renderMode: RenderMode.Server, status: 301, redirectTo: 'home' },
       { route: '/user/:id', renderMode: RenderMode.Server },
     ]);
   });
@@ -165,6 +165,91 @@ describe('extractRoutesAndCreateRouteTree', () => {
         },
       ]);
     });
+
+    it('should extract nested redirects that are not explicitly defined.', async () => {
+      setAngularAppTestingManifest(
+        [
+          {
+            path: '',
+            pathMatch: 'full',
+            redirectTo: 'some',
+          },
+          {
+            path: ':param',
+            children: [
+              {
+                path: '',
+                pathMatch: 'full',
+                redirectTo: 'thing',
+              },
+              {
+                path: 'thing',
+                component: DummyComponent,
+              },
+            ],
+          },
+        ],
+        [
+          {
+            path: ':param',
+            renderMode: RenderMode.Prerender,
+            async getPrerenderParams() {
+              return [{ param: 'some' }];
+            },
+          },
+          { path: '**', renderMode: RenderMode.Prerender },
+        ],
+      );
+
+      const { routeTree, errors } = await extractRoutesAndCreateRouteTree(
+        url,
+        undefined,
+        true,
+        false,
+      );
+      expect(errors).toHaveSize(0);
+      console.log(routeTree.toObject());
+      expect(routeTree.toObject()).toEqual([
+        { route: '/', renderMode: RenderMode.Prerender, redirectTo: 'some' },
+        { route: '/some', renderMode: RenderMode.Prerender, redirectTo: 'thing' },
+        { route: '/some/thing', renderMode: RenderMode.Prerender },
+      ]);
+    });
+  });
+
+  it('should extract nested redirects that are not explicitly defined.', async () => {
+    setAngularAppTestingManifest(
+      [
+        {
+          path: '',
+          pathMatch: 'full',
+          redirectTo: 'some',
+        },
+        {
+          path: ':param',
+          children: [
+            {
+              path: '',
+              pathMatch: 'full',
+              redirectTo: 'thing',
+            },
+            {
+              path: 'thing',
+              component: DummyComponent,
+            },
+          ],
+        },
+      ],
+      [{ path: '**', renderMode: RenderMode.Server }],
+    );
+
+    const { routeTree, errors } = await extractRoutesAndCreateRouteTree(url);
+    expect(errors).toHaveSize(0);
+    expect(routeTree.toObject()).toEqual([
+      { route: '/', renderMode: RenderMode.Server, redirectTo: 'some' },
+      { route: '/:param', renderMode: RenderMode.Server, redirectTo: 'thing' },
+      { route: '/:param/thing', renderMode: RenderMode.Server },
+    ]);
   });
 
   it('should not resolve parameterized routes for SSG when `invokeGetPrerenderParams` is false', async () => {

packages/angular/ssr/test/routes/router_spec.ts

@@ -55,7 +55,7 @@ describe('ServerRouter', () => {
         renderMode: RenderMode.Server,
       });
       expect(router.match(new URL('http://localhost/redirect'))).toEqual({
-        redirectTo: '/home',
+        redirectTo: 'home',
         route: '/redirect',
         renderMode: RenderMode.Server,
         status: 301,
@@ -89,7 +89,7 @@ describe('ServerRouter', () => {
         renderMode: RenderMode.Server,
       });
       expect(redirectMetadata).toEqual({
-        redirectTo: '/home',
+        redirectTo: 'home',
         route: '/redirect',
         status: 301,
         renderMode: RenderMode.Server,
@@ -110,7 +110,7 @@ describe('ServerRouter', () => {
         renderMode: RenderMode.Server,
       });
       expect(redirectMetadata).toEqual({
-        redirectTo: '/home',
+        redirectTo: 'home',
         route: '/redirect',
         status: 301,
         renderMode: RenderMode.Server,

tests/legacy-cli/e2e/tests/build/server-rendering/server-routes-output-mode-static.ts

@@ -107,7 +107,7 @@ export default async function () {
     'ssg/one/index.html': 'ssg-with-params works!',
     'ssg/two/index.html': 'ssg-with-params works!',
     // When static redirects as generated as meta tags.
-    'ssg-redirect/index.html': '<meta http-equiv="refresh" content="0; url=/ssg">',
+    'ssg-redirect/index.html': '<meta http-equiv="refresh" content="0; url=ssg">',
   };
 
   for (const [filePath, fileMatch] of Object.entries(expects)) {