Télécharger le fichier à partir de octets en JavaScript

je veux télécharger le fichier qui se présente sous forme d'octets à partir de la réponse AJAX.

j'ai essayé de faire de cette façon avec 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();

C'est en fait le téléchargement du fichier pdf mais le fichier est corrompu.

Comment puis-je accomplir?

28
demandé sur Jahongir Rahmonov 2016-01-27 16:37:51

4 réponses

j'ai posé la question sur l'âge, donc je pourrais me tromper dans certains détails.

Blob comme il s'est avéré avoir besoin de tampons. C'est pourquoi base64 octets doivent être convertis en tampons de tableau d'abord.

Voici la fonction pour faire cela:

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:

var sampleArr = base64ToArrayBuffer(data);
saveByteArray("Sample Report", sampleArr);
63
répondu Jahongir Rahmonov 2018-08-23 11:54:46

Vous avez juste besoin d'ajouter une ligne supplémentaire et cela devrait fonctionner. Votre réponse est byte array 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();
5
répondu KrishnaSingh 2018-02-13 14:55:48

Set Blob type à 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
répondu guest271314 2016-01-27 14:00:49

j'ai eu un problème similaire, mais dans mon cas le problème était d'une certaine manière les données sont livrées à partir d'un serveur à un client. Il est essentiel de s'assurer que le serveur envoie les données en encodage Base64 , sinon le client ne peut pas desérialiser la chaîne PDF au format binaire.

Côté Serveur:

// represent PDF as byteArray for further serialization
byte[] byteArray = ((java.io.ByteArrayOutputStream) pdfStream).toByteArray();

// serialize PDF to Base64
byte[] encodedBytes = java.util.Base64.getEncoder().encode(byteArray);

La solution complète avec côté serveur et côté client extraits de code:

0
répondu Mike B. 2018-08-24 08:13:53