How to save file xlsx pptx doc docx ppt xls in react-CodePudding

I have a different list file attached. I want to download a single file. My API is working fine. I checked from the Postman, Diff format - xlsx pptx doc docx ppt xls file getting downloaded and I can open it.

Coming to the React UI - When I integrated the API -

npm I used,

const FileDownload = require("js-file-download");
FileDownload(MyEncrypetedData, key.attachmentName);

File getting downloaded, When I open any format of the file of below extension - .xlsx, .pptx, .doc, .docx, xls file, its corrupted.

Not able to open the file. Any idea? How to fix this?

Any help would be appreciated. Or Any other package, ( Please let me know how to integrate it as well )

CodePudding user response：

You can download any type of file, using axios and responseType Blob.

Approach - 1

axios({
  url: 'http://localhost:5000/static/example.pdf',
  method: 'GET',
  responseType: 'blob', // important
}).then((response) => {
  const url = window.URL.createObjectURL(response.data));
  const link = document.createElement('a');
  link.href = url;
  link.setAttribute('download', 'file.pdf');
  document.body.appendChild(link);
  link.click();
});

Approach - 2 ( Using file Saver npm)

import { saveAs } from 'file-saver'

 axios({
  url: 'http://localhost:5000/static/example.pdf',
  method: 'GET',
  responseType: 'blob', // important
}).then((response) => {
   saveAs(response.data,  "anyfileName.pdf"); // Extension can be anything
});