1

我正在为工作中的 Angular2 应用程序制作原型。该应用程序应该在一些公司中间件下运行，该中间件期望在从 angular2 应用程序获得的响应中获得多个Link标头。不幸的是，我无法弄清楚如何将标头添加到 Angular 开箱即用的响应中。

为了澄清我的意思——当我直接向我的 Angular 应用程序发送 GET 请求时，它会发回浏览器可以呈现到 SPA 中的文本/HTML 响应。我想在这个响应中添加标题，但不知道怎么做。我发现最接近的是这里的讨论：Angular2 - set headers for each request

这听起来像是重复的，但是在查看了类似的问题后，我发现了如何将标头添加到我使用 HttpModule 中的 HTTP 对象显式生成的响应中，而不是如何将标头附加到 Angular 创建的响应中-盒子。我很想使用像 HTTP 拦截器这样的东西，它只是将标头附加到我的应用程序发出的每个响应中，但看起来 Angular2 在 4.1 版之前不会有拦截器。

编辑：我尝试过的事情：

  • 在我的（主）AppModule 中为 Http ResponseOptions 添加提供程序，将标头添加到响应中
    • 这会将标头添加到我从我的应用程序从 HttpModule 接收的 http 请求中收到的所有响应中，但不会将标头添加到我的应用程序本身发送到外部服务的响应中。

编辑 2：我误解了我的 Angular 应用程序的结束位置以及托管它的服务器的开始位置。可以在服务器中添加这样的标头 - 对于我的简单示例，我需要配置 webpack-dev-server。请参阅下面接受的答案。

4

2 回答 2

1

我不知道 angular2-webpack-starter，但我想它只是一个命令行工具，可以轻松开发您的 Angular 应用程序。所以它只为你的 JavaScript、HTML 和资产提供服务。这不是应用程序本身。Angular 应用程序在浏览器中运行并充当后端的客户端。因此，您需要另一台服务器来为您的后端应用程序提供服务，并且您的所有 XHR 调用都将转到该后端。当您部署应用程序时，它可能不会在 angular2-webpack-starter 中运行，而是在一些更高级的 HTTP 服务器中运行，例如 Apache HTTPD 或 nginx。

然后需要创建一个自定义的Http服务（扩展Angular自带的Http服务）或者XHRBackend。它可以访问请求和响应对象，并且可以在那里添加额外的标头。

于 2017-03-29T13:38:00.353 回答
1

Web Starter Pack 使用webpack-dev-server作为开发托管平台/Web 服务器，但最终它并不是最终 Angular 应用程序的一部分。您最终将通过其他一些强化的 Web 服务器软件（例如 Apache、IIS 等）为您的 Angular 应用程序提供服务。

出于开发目的，您应该能够配置 webpack-dev-server 以通过根据文档webpack.config.js修改您的headers选项来添加自定义标头。

devServer.headers

向所有请求添加标头：

headers: {
  "X-Custom-Foo": "bar"
}

例如：

webpack.config.js

...
devServer: {
  ...
  headers: {
    "X-Custom-Foo": "bar"
  }
  ...
}
...

尽管要在 Angular 应用程序初始化后实际读取“初始加载”标头（如果这是您要执行的操作），但您可能需要将您的值添加为 [非 httpOnly ] cookie，然后继续阅读它们ngInit()。

来源：DevServer 文档 - 标头

于 2017-03-29T15:26:34.453 回答