Prerendering fails with undefined stack trace on invalid http calls

[thecp]

Command

build, serve

Is this a regression?

• Yes, this behavior used to work in the previous version

The previous version in which this bug was not present was

No response

Description

When using SSR, you typically wrap http calls in an afterRender or afterNextRender lifecycle hook. If not doing so it might happen that prerendering fails when e.g. the url is either invalid, unreachable or does not return JSON. In this you'll get an error which doesn't really tell you a lot of context what is going on:

✘ [ERROR] An error occurred while prerendering route '/test'.

undefined

My expectation is that there should be some better error message to tell the user what (s)he is doing wrong.

Minimal Reproduction

1. Set up a project with SSR and routing enabled
2. add router-outlet to the app.component
3. set up some routing, e.g.

  {
    path: 'test',
    component: TestComponent,
  },
  {
    path: '',
    redirectTo: '/test',
    pathMatch: 'full',
  }

4. In a component of any route (in this case the TestComponent), set up an http call like:

constructor(private http: HttpClient) {
    this.http
      .get('htp://invalid.url')
      .subscribe();
  }

5. run ng build

Exception or Error

✘ [ERROR] An error occurred while prerendering route '/test'.

undefined

Your Environment

Angular CLI: 18.2.10
Node: 22.9.0
Package Manager: npm 10.8.3
OS: linux x64

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

Package Version

@angular-devkit/architect 0.1802.10
@angular-devkit/build-angular 18.2.10
@angular-devkit/core 18.2.10
@angular-devkit/schematics 18.2.10
@angular/cli 18.2.10
@angular/ssr 18.2.10
@schematics/angular 18.2.10
rxjs 7.8.1
typescript 5.5.4
zone.js 0.14.10

Anything else relevant?

No response

[alan-agius4]

We should improve the error message although I suspect this has been addressed in v19 which is currently in prerelease. I’ll verify and get back to you on this.

When using SSR, you typically wrap http calls in an afterRender or afterNextRender lifecycle hook.

I haven’t seen usage of this approach and truth this approach would be far from ideal. This could lead to hydration mismatches, it’s best to make HTTP requests directly during SSR, ensuring that the view is fully rendered on the server. This way, when the page hydrates on the client side, it can use the data already fetched by the server, keeping everything in sync.

[alan-agius4]

Confirmed that this has been addressed in version 19. I'll back port the fix to version 18.

[alan-agius4]

Closed via #28744

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}