Question

29

Download File from Bytes in JavaScript

rated 0 times [ 33] [ 4] / answers: 1 / hits: 171034 / 9 Years ago, wed, january 27, 2016, 12:00:00

I want to download the file which is coming in the form of bytes from the AJAX response.

I tried to do it this way with the help of Blob:

var blob=new Blob([resultByte], {type: "application/pdf"});

var link=document.createElement('a');

link.href=window.URL.createObjectURL(blob);

link.download="myFileName.pdf";

link.click();

It is in fact downloading the pdf file but the file itself is corrupted.

How can I accomplish this?

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

myrap

Add To Favorites

Follow

Total Points: 407

Total Questions: 105

Total Answers: 109

Location: Cambodia

Member since Thu, Oct 7, 2021

3 Years ago

myrap questions

1 How To Convert base64 String to PDF in React.js

Tue, Feb 8, 22, 00:00, 2 Years ago

1 Migrating away from Typescript in a React project

Wed, Jan 15, 20, 00:00, 4 Years ago

1 Can I use let in react function component?

Thu, Oct 24, 19, 00:00, 5 Years ago

1 Delay inside/after subscribe in angular

Thu, Oct 3, 19, 00:00, 5 Years ago

1 To pin the caption of the scrollable table

Mon, Aug 12, 19, 00:00, 5 Years ago

View All

answered 9 Years ago oliverkarle · Accepted Answer

I asked the question long time ago, so I might be wrong in some details.

It turns out that Blob needs array buffers. That's why base64 bytes need to be converted to array buffers first.

Here is the function to do that:

function base64ToArrayBuffer(base64) {

    var binaryString = window.atob(base64);

    var binaryLen = binaryString.length;

    var bytes = new Uint8Array(binaryLen);

    for (var i = 0; i < binaryLen; i++) {

       var ascii = binaryString.charCodeAt(i);

       bytes[i] = ascii;

    }

    return bytes;

 }

Here is my function to save a pdf file:

function saveByteArray(reportName, byte) {

    var blob = new Blob([byte], {type: application/pdf});

    var link = document.createElement('a');

    link.href = window.URL.createObjectURL(blob);

    var fileName = reportName;

    link.download = fileName;

    link.click();

};

Here is how to use these two functions together:

var sampleArr = base64ToArrayBuffer(data);

saveByteArray(Sample Report, sampleArr);