如何从 HttpClient 响应访问标头？ （角/离子）

Question

我使用的登录端点返回不记名令牌作为响应标头，正如我在“网络”Chrome 检查窗口中看到的那样：

Response Headers
Access-Control-Allow-Credentials:true
Access-Control-Allow-Origin:http://localhost:8100
Authorization:Bearer eyJhbGciOiJIUzUxMiJ9.eyJzdWIiOiJuZWxpby5jdXJzb3NAZ21haWwuY29tIiwiZXhwIjoxNTEyNzA3OTQ3fQ.pOR4WrqkaFXdwbeod1tNlDniFZXTeMXzKz9uU68rLXEWDAVRgWIphvx5F_VCsXDwimD8Q04JrxelkNgZMzBgXA
Cache-Control:no-cache, no-store, max-age=0, must-revalidate
Content-Length:188
(etc...)

但是，当我尝试使用 HttpClient 实例从响应中打印“标头”时：

  authenticate(credentials) {
    let creds = JSON.stringify(credentials);
    let contentHeader = new HttpHeaders({"Content-Type": "application/json"});
    this.http.post(this.LOGIN_URL, creds, { headers: contentHeader, observe: 'response'})
      .subscribe(
        (resp) => {
          console.log("resp-ok");
          console.log(resp.headers);
        },
        (resp) => {
          console.log("resp-error");
          console.log(resp);
        }
      );
  }

我得到了完全不同的结构：

HttpHeaders {normalizedNames: Map(0), lazyUpdate: null, lazyInit: ƒ}
lazyInit : ƒ ()
lazyUpdate : null
normalizedNames : Map(0) {}

我还尝试了 get(headerName) 方法并得到 null。我缺少什么？如何从我的响应中获取“授权”标头？

Answer 1

尝试这样：

authenticate(credentials) {
    let creds = JSON.stringify(credentials);
    let contentHeader = new HttpHeaders({ "Content-Type": "application/json" });
    this.http.post(this.LOGIN_URL, creds, { headers: contentHeader, observe: 'response' })
        .subscribe(
        (resp) => {
            let header: HttpHeaders = resp.headers;
            console.log(header.get('Authorization'))
        },
        (resp) => {
            console.log("resp-error");
            console.log(resp);
        }
        );
}

Answer 2

你就快到了。

它不起作用的原因是因为您没有使用

.get

的

headers

功能。

改变这个

 console.log(resp.headers);

对此

 console.log(resp.headers.get('Authorization'))

更多信息：

官方文档这里

Answer 3

您确定将其添加为响应的一部分吗？您需要在响应中添加标头：

public void methodJava(HttpServletResponse response){
  ...
 response.addHeader("access-control-expose-headers", "Authorization");
}

然后你就可以做你一直在尝试的事情了。我认为 headers.get('Authorization') 应该给你想要的值

Answer 4

我最近也遇到了这个问题。经过一番调查，我发现这似乎是一个后端问题，需要在响应标头中添加“Access-Control-Expose-Headers”。

https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Headers/Access-Control-Expose-Headers