Angular 2:无法访问 http 请求中的响应标头

Posted

技术标签:

【中文标题】Angular 2:无法访问 http 请求中的响应标头【英文标题】:Angular 2: Can't access response headers in a http request 【发布时间】:2016-02-13 14:57:00 【问题描述】:

我正在使用 angular2-http(alpha.44) 模块从 REST Api 检索数据。我不知道如何访问响应的标头映射中的信息,我需要一个特定的字段。示例:

var req = new Request(
  url: `localhost/api/products`,
  method: RequestMethods.Get
);

this.http.request(req).subscribe(
  res => 
    // Can't access the headers of the response here.... res.headers is empty
    ,
  error =>  ... ,
  _ => 
);

奇怪的是,如果我在浏览器的开发工具中检查网络流量,就会出现响应头...

【问题讨论】:

【参考方案1】:

解决方案在已经链接的问题中,但在稍后的评论中:https://github.com/angular/angular/issues/5237#issuecomment-239174349

除了一些通用标头之外,只有标为 Access-Control-Expose-Headers 标头值的标头才会在 Angular2 中映射(可能也与其他标头一起映射)。这必须在后端添加。

对我来说,我花了一个多小时才找到 Authorization 标头。我认为这不是自定义标题,但确实如此。

php 中调用如下: header("Access-Control-Expose-Headers: Authorization, X-Custom-header");

如果您使用 Laravel 作为后端并带有 barryvdh/laravel-cors,请在 config/cors.php 文件中进行此设置。

【讨论】:

【参考方案2】:

已经在github上打开了关于该问题的问题:-

https://github.com/angular/angular/issues/5237#issuecomment-156059284

请检查一下,因为有人发布了解决方法。

更新

Angular 团队已经解决了这个问题。

【讨论】:

如果问题解决了。请您分享一下解决方案吗?我也在寻找解决方案。【参考方案3】:

我发现此链接很有帮助: https://developer.mozilla.org/es/docs/Web/HTTP/Headers/Access-Control-Expose-Headers

我必须通过添加真正的标头来指定必须从我的服务器本身向最终用户公开的必要标头!

// Request headers you wish to expose
res.setHeader('Access-Control-Expose-Headers', 'your_desired_header, content-type');

干杯!

【讨论】:

以上是关于Angular 2:无法访问 http 请求中的响应标头的主要内容,如果未能解决你的问题,请参考以下文章

无法使用 Angular 2 rc5 发出 http 请求

我无法在 Angular 4 上向 laravel api 发送带有标头的 http 请求

Ionic 2 / Angular 问题与 http post 到 laravel api

如何在Angular js中的http请求中发送标头数据

从 80 端口到另一个端口的角度 $http 请求

如何在 Angular 2 中发出启用 CORS 的 HTTP 请求?