web-dev-qa-db-fra.com

Télécharger le fichier de Bytes en JavaScript

Je veux télécharger le fichier qui vient sous forme d'octets à partir de AJAX response.

J'ai essayé de le faire de cette façon à l'aide de Bolb:

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();

En fait, il télécharge le fichier pdf, mais le fichier lui-même est corrompu.

Comment puis-je accomplir cela?

javascriptpostrequestresponse
40
Jahongir Rahmonov

J'ai posé la question il y a longtemps, alors je me trompe peut-être dans certains détails.

Il s'avère que Blob a besoin de tampons de tableaux. C'est pourquoi les octets en base64 doivent d'abord être convertis en tampons de tableau.

Voici la fonction pour faire ça:

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;
 }

Voici ma fonction pour enregistrer un fichier pdf:

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();
};

Voici comment utiliser ces deux fonctions ensemble:

var sampleArr = base64ToArrayBuffer(data);
saveByteArray("Sample Report", sampleArr);
92
Jahongir Rahmonov

Vous devez juste ajouter une ligne supplémentaire et cela devrait fonctionner. Votre réponse est tableau d'octets de votre application serveur.

var bytes = new Uint8Array(resultByte); // pass your byte response to this constructor

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

var link=document.createElement('a');
link.href=window.URL.createObjectURL(blob);
link.download="myFileName.pdf";
link.click();
8
KrishnaSingh

Définissez Blobtype à Blob constructeur au lieu de à createObjectURL

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();
0
guest271314