无法在 create-react-app 中看到 Content-Disposition 标头

Question

我有一个 create-react-app，由 Express 提供服务。Express 仅充当该应用程序的代理。应用程序逻辑位于 CRA 中。

我正在尝试调用 API 并下载文件。API 使用包含文件名的“Content-Disposition”标头进行响应。我无法检索通话中的标头。

当我在 Postman/chrome-dev-tools 中调用 API 时，我可以看到可用的标头。

请参阅下面我的代码。文件名代码被注释掉，因为res.headers它是空的。

let filename = 'test-file-name'; // <--- default file name
const output = fetch(transactionReportPath(), {
    headers: {
      accept: 'text/csv',
      Authorization: `Bearer ${getToken()}`
    }
  })
    .then((res) => {
        console.log(res.headers) // <---- empty object
        // filename = res.headers.get('Content-Disposition').split(";")[1]
        return res.blob()})
    .then((blob) => {
      const file = window.URL.createObjectURL(blob);
      const a = document.createElement('a');
      a.href = file;
      a.download = filename;
      document.body.appendChild(a); 
      a.click();
      a.remove();
    });

Answer 1

能够解决这个问题。服务器响应中缺少标头。

response["Access-Control-Expose-Headers"] = "Content-Disposition"

在响应中添加此标头开始暴露丢失的文件名。