如果我得到应用程序流的 Axios 响应内容类型，如何保存 PDF 格式文件？

Question

I would like to save a octet-stream type data to a pdf file, the data is correct as I have tried to use Postman "Send and Save" function to get and open the pdf file successfully.

However, once I call axios request and receive the response from the server, I cannot get the correct pdf file. After I got the pdf file, it seems that the file is broken, can I cannot open it correctly.

Here's the header of the response: enter image description here

        axios.create({
        baseURL: link,
        timeout: 60000,
        headers: {
            Authorization: token
        }
    }).post(apiUrl, {
        .
        .
        .
    }).then(res=>{
        var file_data = res["data"];
        var file_type = res["headers"]["content-type"];
        var blob = new Blob([file_data], {type: file_type});
        saveAs(blob, "Test.pdf")
    });

Answer 1

I found the solution for this problem, it seems that the size of the file is different with the original one, and I make the following changes to receive the data in form of Blob object to solve it.

axios.create({
    baseURL: link,
    timeout: 60000,
    responseType: 'blob'
    headers: {
        Authorization: token
    }
}).post(apiUrl, {
    .
    .
    .
}).then(res=>{
    var file_data = res["data"];
    var file_type = res["headers"]["content-type"];
    saveAs(file_data, "Test.pdf");
});

Answer 2

When downloading binaries with Axios, the format of the data returned by the server needs to be specified with the request. In the case of a PDF file, generally "arraybuffer" needs to be used.

axios.get(
      "https://example.com/example.pdf",
      {
        responseType: "arraybuffer"
      }
    );

As per the documentation, the valid options are:

// `responseType` indicates the type of data that the server will respond with
// options are: 'arraybuffer', 'document', 'json', 'text', 'stream'
//   browser only: 'blob'
//   default: 'json'

Axios documentation