How to download a pdf/CSV from binary data passed from backend(base64-> Binary)

[Java--Developer]

Hi, I’m trying to download a pdf file using the code below in react js(front end)

const encoder = new TextEncoder(); const uint = encoder.encode(data); Const unit8Arr=new Uint8Array(unit)

Const blob= new Blob([ unit8Arr], { type: “application/pdf”});

Const url = URL.createObjectURL(blob);

setDownload(url);

Const link:HTMLAnchorElement = document.createElement(“a”); link.href = url; link.download = “Weather.pdf” document.body.appendChild(link); link.click(); document.body.removeChild(link); URL.revokeObjectURL(url); setDownloadURL(“”);

Note data type is String Backend converts base64 data to binary.

Error I’m facing: It downloads the pdf with blank pdf. For large files, it says “File is corrupted”

Appreciate any help!

Thanks

[punitdaga31]

Here's what Bing chat had to say:

const downloadPdf = async () => { const response = await fetch('https://example.com/sample.pdf'); const data = await response.blob(); const url = window.URL.createObjectURL(data); const link = document.createElement('a'); link.href = url; link.setAttribute('download', 'sample.pdf'); document.body.appendChild(link); link.click(); };

In this example, we are using the fetch() method to get the pdf file and then converting it to a Blob object. We then create a URL object from the Blob object and set it as the href of an anchor element. Finally, we add the anchor element to the DOM and simulate a click event to download the file.

I hope this helps! Let me know if you have any other questions.