在 Angular 8 的 http 响应中看不到任何响应 headers

Question

当我意识到我的 http 响应根本不包含 header 时，我正试图从服务器下载一个作为 byte-array 发送的 csv 文件。我期待我的回复 'content-disposition' header。

以前，我一直只使用 JSON 响应，因此从来没有费心去寻找 headers。

我已经阅读了很多解决类似问题的答案。然而，与大多数 OP 不同的是，我从服务器传递 'content-disposition' header 并且也公开了相同的内容。

这是 header 地图在浏览器上的显示方式，清楚地显示了 header 设置和正确显示

即使有来自服务器的响应，我在订阅块中得到的只是 json 数据（如果是 json 请求）和 Blob object （如果是 blob 请求）。根本看不到 header。

我还确保没有在我的代码中放置可能提取 headers 的响应拦截器。

下面是我正在使用的一些代码：

downloadFile(entity: string) {
      return this.http.get(ApiUrlConstants.API_URL.PRICING_CSV_DOWNLOAD_URL + entity,
          { responseType: 'blob' }); // tried with arraybuffer too
}

并且在接收到数据后从订阅中调用以下方法。这是我期待 headers

 public processBlobResponse(data: any): void {
const blob = new Blob([data._body], { type: data.headers.get('Content-Type') });
const contentDispositionHeader = data.headers.get('Content-Disposition');
if (contentDispositionHeader !== null) {
  const contentDispositionHeaderResult = contentDispositionHeader.split(';')[1].trim().split('=')[1];
  const contentDispositionFileName = contentDispositionHeaderResult.replace(/"/g, '');

  const downloadlink = document.createElement('a');
  downloadlink.href = window.URL.createObjectURL(blob);
  downloadlink.download = contentDispositionFileName;
  if (window.navigator.msSaveOrOpenBlob) {
    window.navigator.msSaveBlob(blob, contentDispositionFileName);
  } else {
    downloadlink.click();
  }
}

}

我很确定我错过了什么。有什么想法吗？

Answer 1

TL;DR;

将 {observe: 'response'} 添加到您的 http 选项

说明

来自documentation

Important options include the observe and responseType properties.

The observe option specifies how much of the response to return.

The responseType option specifies the format in which to return data.

默认情况下，angular 将使用 {observe: 'body', responseType: 'json'} 作为 http 选项，这意味着 angular 将只允许您访问响应的 body，自动变成 json object，而不是 headers.

如果需要访问服务器返回的headers，需要在http选项中指定observe: 'response'(documentation)

注意：当涉及CORS时，访问非标准headers的要求是指定Access-Control-Expose-Headers（见documentation）服务器端，例如

Access-Control-Expose-Headers: Content-Disposition, Authorization, MyCustomHeader

在 Angular 8 的 http 响应中看不到任何响应 headers

Cannot see any response headers in http response of Angular 8

browser

download

http-headers

cors

angular