Express JS 如何发送 Blob 到客户端

Question

我正在尝试从网络应用程序下载文件。下载按钮在我的后端执行 POST 请求，该请求反过来编辑 Google 云端硬盘上的文件并将其导出。 我希望将它们发送回前端，但到目前为止还没有成功。

从 Google Drive API 导出的文件以 Blob 形式出现，下面是一个示例：

{
id: '10i7fTyLEmhovfArrbI_1Kvk-pwWRpwU-QgCWnINSQqQ',
file: Blob {
  [Symbol(type)]: 'application/pdf',
  [Symbol(buffer)]: <Buffer 5 25 50 44 46 2d 31 2e 34 0a 25 20 e2 e3 cf d3 ... 3663411 more bytes>
}

如果我尝试仅发送一个文件 Blob，如下所示：

router.post("/getFiles", async (req, res) => {
 const blob = await file from Google drive
 res.header("Content-Type", "application/pdf");
 res.header("Content-Length", blob.size);
 blob.stream().pipe(res);
}

在前端，我像这样处理斑点：

axios.post(address, payload)
  .then(response => {
    const blob = new Blob([response?.data], { type: "application/pdf" })
    resolve(window.URL.createObjectURL(blob));
  })
  .catch(err => reject(err));

该 URL 打开了 pdf 查看器，但它是空白的，而且标题完全是乱码

如何将 Blob 从 Express 后端发送到网络？

解决方案：

修复方法是将配置 { responseType: "blob" } 添加到 post 请求

axios.post(address, payload, { responseType: "blob" })
  .then(response => {
    const blob = new Blob([response?.data], { type: "application/pdf" })
    resolve(window.URL.createObjectURL(blob));
  })
  .catch(err => reject(err));

Answer 1

修复方法是将配置 { responseType: "blob" } 添加到 post 请求

axios.post(address, payload, { responseType: "blob" })
  .then(response => {
    const blob = new Blob([response?.data], { type: "application/pdf" })
    resolve(window.URL.createObjectURL(blob));
  })
  .catch(err => reject(err));