Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

AngularNodeAppEngine : dynamic route paths added with Router.resetConfig during AppInitializer can't be reached on SSR #29238

Open
jimjim2a opened this issue Dec 31, 2024 · 2 comments
Labels
area: @angular/ssr feature: votes required Feature request which is currently still in the voting phase feature Issue that requests a new feature

Comments

@jimjim2a
Copy link

jimjim2a commented Dec 31, 2024

Command

build

Description

Hello everyone,

I'm currently trying to migrate an Angular 18 app with SSR enabled using CommonEngine. After switching to V19 I wanted to move to AngularNodeAppEngine to be able to have hybrid rendering but I'm facing an issue with dynamic route paths.

The app we are working on, by default, has no pre-defined route paths. They all come from an API. The end user can edit all the slugs of its app on a dedicated interface.

So, during APP_INITIALIZER we fetch the routes from the API and Router.resetConfig.
This is working using CommonEngine.

But it doesn't when using AngularNodeAppEngine because of the route extraction phase during build time to feed the Manifest in this scenario.

When the app is built, let's say the end user has only activated one route routeA. The server manifest has only a route.

But after some time, the end user chose to add another route to the app (routeB). During APP_INITIALIZER the route is correctly added to the router config, but since it's not part of the manifest, routeB leads to a 404 on SSR.

Minimal Reproduction

I added a repo to highlight the issue : https://github.com/jimjim2a/ssr-dynamic-routing.

Here are the steps to reproduce the issue :

  1. Build the app -> at this time route extraction knows only "article" route
  2. open the "/article" page -> During app initializer we now add a second route ("video")
  3. Click on the "Go to Video page !" button -> This works since the second route is added on CSR
  4. Refresh the "/video" page -> This path can not be found and leads to a 404

We are in case there both SSR and CSR Router has correct configuration, but since the manifest extracted during build time is not complete, the SSR of the newly added route leads to 404.

Your Environment

Angular CLI: 19.0.6
Node: 20.14.0
Package Manager: npm 10.7.0
OS: darwin x64

Angular: 19.0.5
... animations, common, compiler, compiler-cli, core, forms
... platform-browser, platform-browser-dynamic, platform-server
... router

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1900.6
@angular-devkit/build-angular   19.0.6
@angular-devkit/core            19.0.6
@angular-devkit/schematics      19.0.6
@angular/cli                    19.0.6
@angular/ssr                    19.0.6
@schematics/angular             19.0.6
rxjs                            7.8.1
typescript                      5.6.3
zone.js                         0.15.0

Thanks everyone for all the great Job you're doing !

@alan-agius4
Copy link
Collaborator

Since routes are required at build time, this is not something that can be handled dynamically. However, we could potentially provide a helper method to repopulate the routing table.

@alan-agius4 alan-agius4 added feature Issue that requests a new feature area: @angular/ssr labels Jan 6, 2025
@angular-robot angular-robot bot added the feature: votes required Feature request which is currently still in the voting phase label Jan 6, 2025
Copy link
Contributor

angular-robot bot commented Jan 6, 2025

This feature request is now candidate for our backlog! In the next phase, the community has 60 days to upvote. If the request receives more than 20 upvotes, we'll move it to our consideration list.

You can find more details about the feature request process in our documentation.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
area: @angular/ssr feature: votes required Feature request which is currently still in the voting phase feature Issue that requests a new feature
Projects
None yet
Development

No branches or pull requests

2 participants