【问题标题】:Angular2 's Http.post is not returning headers in the response of a POST method invocationAngular2 的 Http.post 未在 POST 方法调用的响应中返回标头
【发布时间】:2017-03-23 08:02:42
【问题描述】:

我正在调用 REST 端点。我想添加一个资源(下)。 但是,当我的服务调用 Http 的 post 方法时,它将调用请求但不返回响应的标头。至少,我遇到了 Response 实例的空标头对象。 (??) 我确实期望响应标头。特别是,我希望 Location 标头作为“REST ADD RESOURCE”模式的一部分。 Location 标头包含新创建资源的 URL。

这很奇怪:当我直接调用我的 API(因此不是通过 Angular2)时,我得到了准确的响应,但这次是(所有)预期的标头,包括 Location 响应标头。

呃,Http.post 有问题还是我做错了什么?

请注意:在此示例中,我的服务返回一个可观察响应。这不是返回给调用者的预期类类型。我使用它是为了方便了解发布响应的情况。实际上,我打算传递存储在 Location 标头中的 url。

addModel(model: any): Observable<Response> {
let token = this.loginService.auth.accessToken;
let headers = new Headers({
  'Content-Type': 'application/json',
  'Accept': 'application/json',
  'Authorization': `Bearer ${token}`
});
let options = new RequestOptions({headers: headers});
let data: string = JSON.stringify(model);
return this.http.post(this.url, data, options)

  // .map(r => {
  //   console.log("Response ", r);
  //   return r.headers.get("Location"); // THERE IS NOTHING IN headers (?). Don't understand.
  // })
  .catch(err => Observable.throw(err));
 }

【问题讨论】:

  • 如果是 CORS 请求,服务器需要添加 Allow-access-expose-headers 否则返回的标头对 JS 不可用。如果响应包含标题,您是否检查了浏览器的开发工具?
  • 嗨,Gunter,我已经登录到控制台,但没有看到任何标题。我还使用 Postman 手动触发请求,我可以在 Postman 中看到标头。 (但不在 Angular2 的 http.post 中)。我将检查您建议的 CORS 标头。很可能我还需要在 WSO2 的 API Manager 中进行一些调整。
  • 登录到控制台无济于事,因为需要先使用 JS 读取它,这不起作用(如前所述)。如果它从邮递员那里工作,那肯定是 CORS 问题。

标签: angular angular2-services


【解决方案1】:

对于 CORS 请求,服务器需要添加 Allow-access-expose-headers: headername 否则返回的标头对 JS 不可用。

如果响应实际上包含标头,您可以在浏览器 devtools(网络选项卡 AFARK)中调查请求响应?

【讨论】:

  • 嗨,Gunter,我刚刚检查了我的 CORS 设置在 API 网关上对于这个特定的 rest api 的情况。首先,CORS 已开启。当前,某些标头已配置为允许 CORS 请求。 (我还添加了 Location ,因为它不存在..(但我认为这不是必需的,因为 Location 标头属于服务器响应而不是请求)。没有任何改变。顺便说一句,我没有 Allow -access-expose-headersAccess-Control-Allow-Headers。这是个问题吗?
  • 是的,这是个问题。 ...expose-headers 是关于暴露的 ;-) 您是否调查了浏览器开发工具中的响应?您会在那里找到响应,但 JS 不会公开它。
  • 您好 Gunter,是的,我在 DevTools 中进行了检查,结果发现远程服务器 (API) 在启用 CORS 的情况下确实发送了所有预期的标头。我可以在 Chrome Devtools 的响应中看到 Location 标头。因此,所有标头(位置)都已到达我的浏览器,但 Angular 的 http 实例没有通过它们,所以我无法在我的代码中访问它们。目前我正在尝试配置 WSO2 API Manager 以包含您建议的 CORS 标头。直到现在我还没有成功地包含它,因为我仍然没有在我的回复中看到它。我会在 stackoverflow 上发一个帖子。
  • Gunter,我已成功配置我的 API 网关 (WSO2) 以在响应中包含建议的标头 (Access-Control-Expose-Headers)。我做了一个测试,Angular2 的 Http 客户端获取了我的 Location 标头(可见)。您的建议很有帮助!谢谢。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2011-02-16
  • 2017-10-03
  • 1970-01-01
  • 2019-03-04
  • 2021-01-15
  • 2020-06-03
相关资源
最近更新 更多