typescript - Angular 17 SSR Express 服务器提供者
我尝试通过在 "server.ts" 文件中定义提供者,将我的请求和响应对象共享到 Angular 应用中。
无论如何,将它们注入到 app.component 中时,它们总是未定义,无论我是在服务器端还是客户端上下文中。
有人知道如何修复这种行为吗?可惜关于它的信息不多。
我没有在开发模式下运行这个应用,因为 Angular 目前在开发模式下会忽略 server.ts!我构建了它并启动了 Express 服务器。
我的代币看起来像这样:
export const REQUEST = new InjectionToken<Request>('REQUEST');
export const RESPONSE = new InjectionToken<Response>('RESPONSE');
我的服务器看起来是这样的:
// 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));
});
我的客户端注入了响应对象
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);
}
不管我怎么尝试,我的响应总是为空。
我在谷歌上搜索并阅读了官方文档。
我期望这个令牌返回一个值!
答案#1
禁用预渲染并完美运行
答案#2
在 Angular 17.3 中,在 angular.json 中将 “prerender” 设置为 “false”,然后这将由 Node Express 服务器完成工作。
"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"
}
},
..........
