Question

我正在尝试发送pdf文件内容作为快速和前端的响应，希望接收它并再次保存为pdf。

这是我的快递代码。

app.post('*', (req, res) => {

    ...

    fs.readFile(filePath , function (err,data){
      res.type('application/pdf')
      res.send(data)
    });
})

filePath是pdf文件的完整路径，并且该文件存在。

在前端

import fileDownload from 'js-file-download'

axios.post(process.env.API_ENDPOINT)
  .then(response => {
     fileDownload(response.data, 'reports.pdf', 'application/pdf;charset=utf-8')
  })

下载正常，但是下载的pdf文件损坏。

这是怎么了？

Answer 1

我找到了一个可能对您有用的代码示例。

它不包括我在评论中提到的base64转换，但可能没有必要，它将为您节省一些后端工作。我发现在尝试不使用它时遇到了一些问题，但是我不记得那是什么。

showFile(blob){
  // It is necessary to create a new blob object with mime-type explicitly set
  // otherwise only Chrome works like it should
  var newBlob = new Blob([blob], {type: "application/pdf"})

  // IE doesn't allow using a blob object directly as link href
  // instead it is necessary to use msSaveOrOpenBlob
  if (window.navigator && window.navigator.msSaveOrOpenBlob) {
    window.navigator.msSaveOrOpenBlob(newBlob);
    return;
  } 

  // For other browsers: 
  // Create a link pointing to the ObjectURL containing the blob.
  const data = window.URL.createObjectURL(newBlob);
  var link = document.createElement('a');
  link.href = data;
  link.download="file.pdf";
  link.click();
  setTimeout(function(){
    // For Firefox it is necessary to delay revoking the ObjectURL
    window.URL.revokeObjectURL(data);
  , 100}
}

fetch([url to fetch], {[options setting custom http-headers]})
  .then(r => r.blob())
  .then(showFile)

来源：https://blog.jayway.com/2017/07/13/open-pdf-downloaded-api-javascript/

下载的PDF文件已损坏

1 个答案: