web-dev-qa-db-ja.com

Blob createObjectURLダウンロードがFirefoxで機能しない（ただし、デバッグ時に機能する）

私には奇妙な問題があります、以下の関数は、いくつかのバイナリデータ（配列として渡される）でクライアントでBlobをオンザフライで作成し、それをダウンロードできることについて、ネット上で見つけたものに基づいて作成したものです。これはChromeでは見事に動作しますが、Firefoxでは何もしません-コードをデバッグしてステップスルーしない限り。はい、奇妙なことに、関数内にブレークポイントを作成してステップスルーすると、a.click（）がダウンロードウィンドウを表示します！

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

誰も私を助けることができますか？これは、Firefox 38.0.5を使用してテストされました。

javascriptfirefoxdownloadblob
52
Johncl

リソースを削除するのが早すぎるので、遅らせてみてください

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

上記は私にとって問題を解決しませんでした。しかし、これは代わりに：
Firefoxで<a> -tagがプログラムでクリックされない
クリックイベントのトリガーに関する問題であり、リソースの早期削除ではありません。

10
Tomek

このソリューションは、ボットchromeおよび既存のアンカー要素のfirefoxでバイナリファイルをダウンロードするのに役立ちます

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