从 Angular Universal 应用程序中的 Express JS 获取值

Posted

技术标签:

【中文标题】从 Angular Universal 应用程序中的 Express JS 获取值【英文标题】:Get vaues from ExpressJS in Angular Universal app 【发布时间】:2017-05-14 17:37:42 【问题描述】:

我正在构建一个 Angular2 Universal 应用程序,我正在集成 ng2-translate。

服务器端我需要知道用户的语言,我可以从ExpressJS 通过request.acceptsLanguages() (see docs) 获得。

我确实像这样在server.ts 中正确获取了这些值:

function ngApp(req: any, res: any) 
  let supportedLangs = req.acceptsLanguages();
  console.log('supportedLangs', supportedLangs);
  res.render('index', 
    req,
    res,
    ngModule: AppModule,
    preboot: false,
    baseUrl: '/',
    requestUrl: req.originalUrl,
    originUrl: req.hostname
  );

然后我不知道如何在我为服务器设置ng2-translateapp.node.module.ts 中传递或访问它们。

有没有办法从 Angular Universal 应用程序(服务器端)访问这些值?怎么样?

【问题讨论】:

【参考方案1】:

对于那些感兴趣的人,解决方案是使用Zone,这样做时需要注意一些事项。

首先,为了确保 TypeScript 解析器不会中断,您还需要在您正在使用的文件的顶部声明 Zone

declare var Zone: any;

或者我猜你可能会安装所有的类型,但我没有测试过。

然后,在仅节点模块中的任何位置,您都可以通过执行以下操作在server.ts 文件中获取传递给res.render 的参数:

let req = Zone.current.get('req');

最后,您可以访问server.ts 中传递给req 的任何属性,例如:

req.headers['user-agent'];

ANGULAR 5 的更新

正如 cmets 中所指出的,之前的代码不再有效。好消息是使用 Angular 5 更加简单直接:

import  Injector  from '@angular/core';
import  REQUEST  from '@nguniversal/express-engine/tokens';

constructor(
    private _injector: Injector
) 
    const req = this._injector.get(REQUEST);
    // use as: req.headers['whatever-is-in-the-headers']

【讨论】:

@kris_IV 感谢您指出这一点。我已经用应该适用于 Angular 5 的代码更新了答案 :-) 我在 s-s-r Angular 5 上遇到了区域问题。它仅在浏览器模式下对我有效。我为我的问题雇佣描述了复杂的解决方案:***.com/a/48509431/2972087 我在使用这个解决方案时遇到了这个错误:ERROR Error: StaticInjectorError(o)[InjectionToken REQUEST]:

以上是关于从 Angular Universal 应用程序中的 Express JS 获取值的主要内容,如果未能解决你的问题,请参考以下文章

Angular Universal Render 等待 Http 结果 Observable 订阅者

Angular-universal - 生产问题

Angular Universal:未定义导航器

我可以只在使用 Angular2 Universal 的客户端中运行组件方法吗?

Angular 2 Universal 中的身份验证,nodejs

使用 JWT 对 Angular Universal 进行身份验证