Angular v19 SSR中如何配置REQUEST等Providers？

在 Angular 19 的新服务器 API 中，要为 REQUEST、RESPONSE 等令牌绑定请求上下文对象，需要在 handle() 方法的第二个参数中传入配置对象，正确配置 providers 数组。以下是修正后的代码：

import { REQUEST, RESPONSE, APP_BASE_HREF } from '@angular/platform-server';

// ...

app.use('/**', (req, res, next) => {
  angularApp
    .handle(req, {
      providers: [
        { provide: APP_BASE_HREF, useValue: req.baseUrl },
        { provide: REQUEST, useValue: req },
        { provide: RESPONSE, useValue: res },
      ]
    })
    .then((response) =>
      response ? writeResponseToNodeResponse(response, res) : next(),
    )
    .catch(next);
});

关键注意点： #

• 确保导入的令牌来自正确的包：REQUEST 和 RESPONSE 需从 @angular/platform-server 导入，APP_BASE_HREF 从 @angular/common 导入。
• 服务或组件中注入 REQUEST 时，要使用正确的注入令牌并指定类型：

  import { Inject, Injectable } from '@angular/core';
  import { REQUEST } from '@angular/platform-server';
  import type { Request } from 'express';
  
  @Injectable()
  export class ServerSideService {
    constructor(@Inject(REQUEST) private readonly request: Request) {}
  }
  

• 如果之前添加 providers 未生效，检查是否存在导入错误、令牌拼写错误，或者是否在非服务器环境（如浏览器）中尝试注入 REQUEST（浏览器环境下该令牌不存在）。

内容的提问来源于stack exchange，提问作者Sergej