angular - 在 Angular 8 的 http 响应中看不到任何响应标头

问题描述

当我意识到我的 http 响应根本不包含任何标题时，我试图下载一个从服务器作为字节数组发送的 csv 文件。我期待我的回复中有一个“内容处置”标题。

以前，我只使用 JSON 响应，因此从不费心寻找标头。

我已经阅读了许多解决类似问题的 SO 答案。但是，与大多数 OP 不同，我从服务器传递了“内容处置”标头，并且也公开了相同的标头。

这就是标题映射在浏览器上的显示方式，它清楚地显示了标题集并正确显示

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

我还确保在我的代码中没有放置响应拦截器，这可能会提取标题。

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

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

接收到数据后，从订阅中调用以下方法。这是我期待标题的地方

 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();
  }
}

}

我很确定我错过了一些东西。有任何想法吗？

标签： angularbrowserdownloadhttp-headerscors

TL;博士;

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

解释

从文档

重要的选项包括观察和响应类型属性。

观察选项指定要返回多少响应。

responseType 选项指定返回数据的格式。

默认情况下，angular 将{observe: 'body', responseType: 'json'}用于 http 选项，这意味着 angular 只会让您访问响应的主体，自动转换为 json 对象，而不是标头。

如果需要访问服务器返回的 headers，需要observe: 'response'在 http 选项（文档）中指定

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

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

angular - 在 Angular 8 的 http 响应中看不到任何响应标头

问题描述

解决方案

推荐阅读