使用Axios下载二进制文件

Ant*_*ykh 4 javascript filesaver.js axios

例如,下载PDF文件:

axios.get('/file.pdf', {
      responseType: 'arraybuffer',
      headers: {
        'Accept': 'application/pdf'
      }
}).then(response => {
    const blob = new Blob([response.data], {
      type: 'application/pdf',
    });
    FileSaver.saveAs(blob, 'file.pdf');
});
Run Code Online (Sandbox Code Playgroud)

下载文件的内容为:

[object Object]
Run Code Online (Sandbox Code Playgroud)

怎么了 为什么二进制数据不保存到文件?

Nay*_*qui 17

我能够创建一个可行的要点(无需使用FileSaver),如下所示:

axios.get("http://my-server:8080/reports/my-sample-report/",
        {
            responseType: 'arraybuffer',
            headers: {
                'Content-Type': 'application/json',
                'Accept': 'application/pdf'
            }
        })
        .then((response) => {
            const url = window.URL.createObjectURL(new Blob([response.data]));
            const link = document.createElement('a');
            link.href = url;
            link.setAttribute('download', 'file.pdf'); //or any other extension
            document.body.appendChild(link);
            link.click();
        })
        .catch((error) => console.log(error));
Run Code Online (Sandbox Code Playgroud)

希望能帮助到你。

干杯!

  • `responseType: 'arraybuffer'` 是解决方案 (3认同)
  • 谢谢,我想念`responseType:'arraybuffer'`。 (2认同)

小智 5

我能够根据 Nayab Siddiqui 答案下载 tgz 文件。

const fsPromises = require('fs').promises;
const axios = require('axios'); 

await axios.get('http://myServer/myFile.tgz',
        {
            responseType: 'arraybuffer', // Important
            headers: {
                'Content-Type': 'application/gzip'
            }
        })
        .then(async response => {
            await fsPromises.writeFile(__dirname + '/myFile.tgz', response.data, { encoding: 'binary' });
        })
        .catch(error => {
            console.log({ error });
        });
Run Code Online (Sandbox Code Playgroud)


小智 -3


看起来response.data只是一个常规对象。Blob 的第一个参数是“ArrayBuffer、ArrayBufferView、Blob 或 DOMString 对象的数组”。

尝试将其包装在 JSON.stringify 中

const blob = new Blob([JSON.stringify(response.data)]
Run Code Online (Sandbox Code Playgroud)

那么它将满足 DOMString 要求。