web-dev-qa-db-fra.com

Le téléchargement de blob createObjectURL ne fonctionne pas dans Firefox (mais fonctionne lors du débogage)

J'ai un problème étrange, la fonction ci-dessous est celle que j'ai créée sur la base de ce que j'ai trouvé sur le net, à propos de la création d'un blob dans le client à la volée avec quelques données binaires (transmises sous forme de tableau) et de pouvoir le télécharger. Cela fonctionne brillamment dans Chrome, mais ne fait rien dans Firefox - MOINS SI je débogue et corrige le code. Oui, curieusement, si je crée un point d'arrêt dans la fonction et que je l'explore, le a.click () ouvrira la fenêtre de téléchargement!

function downloadFile(filename, data) {

    var a = document.createElement('a');
    a.style = "display: none";  
    var blob = new Blob(data, {type: "application/octet-stream"});
    var url = window.URL.createObjectURL(blob);
    a.href = url;
    a.download = filename;
    document.body.appendChild(a);
    a.click();
    document.body.removeChild(a);
    window.URL.revokeObjectURL(url);    
}

Quelqu'un peut-il m'aider? Ceci a été testé avec Firefox 38.0.5.

javascriptfirefoxdownloadblob
52
Johncl

Vous supprimez probablement la ressource trop tôt, essayez de la retarder

    ...
    a.click();
    setTimeout(function(){
        document.body.removeChild(a);
        window.URL.revokeObjectURL(url);  
    }, 100);  
}
80
Musa

Ce qui précède n'a pas résolu le problème pour moi. Mais celui-ci l'a fait à la place:
Cliquez par programme sur <a> -tag ne fonctionne pas dans Firefox
Il s’agissait d’un problème lié à l’événement déclenchant, et non à la suppression prématurée de la ressource.

10
Tomek

cette solution fonctionne pour moi dans bot chrome et firefox pour un élément d'ancrage existant permettant de télécharger un fichier binaire

window.URL = window.URL || window.webkitURL;

var blob = new Blob([new Uint8Array(binStream)], {type: "octet/stream"});

var link = document.getElementById("link");
link.href = window.URL.createObjectURL(blob);
2
azad