如何在不使用 HttpIntercepter 的情况下在 Angular 中获取自定义响应标头

Gen*_*sGo 3 spring-boot angular angular-httpclient

我没有在 Angular 项目中使用 HttpIntercepter,并且我想在出现错误时检索一些自定义响应标头。我{ observe: 'response' }在 POST API 调用中尝试过:

post(url, data = ''): Observable<any> {
  url = this.baseApiUrl + url;
  const headers = this.createHttpHeaders();
  const body = JSON.stringify(data);
  return this.http.post(url, body, {headers: headers, observe: 'response'}).pipe(catchError(HttpClientHelper.handleError));
}
Run Code Online (Sandbox Code Playgroud)

但我只收到 4 个标头:

error.headers.keys().map( (key) => console.log(key + ':' + error.headers.get(key)));

回报

cache-control: no-cache, no-store, max-age=0, must-revalidate content-length: 0 expires: 0 pragma: no-cache

但是,x-不会返回带有前缀的自定义响应标头。是否有任何配置可以检索自定义响应标头?

在此输入图像描述

Plo*_*hie 6

您在发送响应时可能没有公开此标头。您的服务器需要发送Access-Control-Expose-Headers标头,以便您的自定义标头暴露给客户端。

文档: https ://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Access-Control-Expose-Headers

在 Spring Boot 响应中,

@GetMapping("/endpoint")
public ResponseEntity<Object> someEndpoint() {

    HttpHeaders headers = new HttpHeaders();
    headers.add("x-some-header", "some_header_value");
    headers.add("Access-Control-Expose-Headers", "x-some-header"); // set this to expose custom header
    return ResponseEntity.ok()
               .headers(headers)
               .body(responseBody);

}
Run Code Online (Sandbox Code Playgroud)