typescript - Angular 17 SSR Express Server-leverantörer


Jag försökte dela mitt request- och response-objekt med Angular-applikationen genom att definiera Providers i filen "server.ts".
Hur som helst, genom att injicera dem i app.component är de alltid undefined oavsett om jag är i server- eller klientkontext.

Vet någon hur man fixar detta beteende? Tyvärr finns det inte mycket information om det.

Jag körde inte appen i utvecklingsläge eftersom Angular för närvarande ignorerar server.ts i utvecklingsläge! - jag byggde den och serverade Express-servern.

Mina tokens ser ut så här:

export const REQUEST = new InjectionToken<Request>('REQUEST');
export const RESPONSE = new InjectionToken<Response>('RESPONSE');

Min server ser ut så här:

  // All regular routes use the Angular engine
  server.get('*', (req, res, next) => {
    console.log('HI HI HI hi');
    const { protocol, originalUrl, baseUrl, headers } = req;
    /*const transferState = inject(TransferState);
    transferState.set(makeStateKey<any>('t'), JSON.stringify('hi'));*/
    commonEngine
      .render({
        bootstrap,
        documentFilePath: indexHtml,
        url: `${protocol}://${headers.host}${originalUrl}`,
        publicPath: browserDistFolder,
        providers: [
          { provide: RESPONSE, useValue: res },
          { provide: REQUEST, useValue: req }
          ],
      })
      .then((html) => res.send(html))
      .catch((err) => next(err));
  });

Min klient injicerar response-objektet

  constructor(@Optional() @Inject(RESPONSE) private response: Response) {
    super();
  }
  ngOnClientInit() {
    console.log('RESPONSE', this.response);
    console.log('I am on client', this.communicationService.getValue('data'), this.token);
  }

Oavsett vad jag försöker är mitt svar alltid null.

Jag googlade och läste den officiella dokumentationen.

Jag förväntar mig att tokenen returnerar ett värde!

Svar #1

Inaktivera förrendering och fungerar perfekt

Svar #2

I Angular 17.3, sätt "prerender" till "false" i angular.json, då kommer detta att fungera genom Node Express-servern.

"architect": {
    "build": {
      "builder": "@angular-devkit/build-angular:application",
      "options": {
        "outputPath": "dist/ng-cors",
        "index": "src/index.html",
        "browser": "src/main.ts",
        "tsConfig": "tsconfig.app.json",
        "server": "src/main.server.ts",
        "prerender": false,  <--!!!
        "ssr": {
          "entry": "server.ts"
        }
      },
    ..........