web-dev-qa-db-ja.com

BLOBをiframeの「src」として設定する

次のコードはChromeで完全に動作します

_<script>
function myFunction() {
var blob = new Blob(['<a id="a"><b id="b">hey!</b></a>'], {type : 'text/html'});
var newurl = window.URL.createObjectURL(blob);
    document.getElementById("myFrame").src = newurl;
}
</script>
_

ただし、IEでは動作しません。誰かがここで何が悪いのか教えてください。

以下に示すように、iframeの "src"もblobに設定されています。

_<iframe id="myFrame" src="blob:0827B944-D600-410D-8356-96E71F316FE4"></iframe>
_

注:window.navigator.msSaveOrOpenBlob(newBlob)パスも使用しましたが、今のところ運がありません。

11
Hiran

http://caniuse.com/#feat=datauri IEによると、11はデータURIの部分的なサポートしか取得していません。サポートは画像とリンクに限定されていると述べていますHTMLファイルではなく、CSSやJSなどのリソース。

この仕様に従って、IEおよびFirefoxで動作するように、base64でエンコードされていないSVGデータURIをuriencodeする必要があります。

4
Emma

IEで同じ問題が発生しました。ただし、IE 10+を使用して filesaver.js で動作するように、ダウンロード/保存を部分的に行うことができました。

function onClick(e) {
    var data = { x: 42, s: "hello, world", d: new Date() },
    fileName = "my-download.json";
    var json = JSON.stringify(data),
        blob = new Blob([json], {type: "octet/stream"});

   saveAs(blob, fileName);      

   e.preventDefault();
   return false;
};

$('#download').click(onClick);

http://jsfiddle.net/o0wk71n2/ を参照してください(リンクへの@ JavaScript blobファイル名 に対する@kolの回答に基づく)==)

0
bjnsn

BLOBをiFrameのソースとして使用し、1つの重要なCAUTION/WARNINGでうまく機能する例:

const blobContent = new Blob([getIFrameContent()], {type: "text/html"});
var iFrame = document.createElement("iframe");
iFrame.src = URL.createObjectURL(blobContent);
parent.appendChild(iFrame);

blobを使用したiFrameは自動リダイレクトプロトコルではありません。つまり、<script src="//domain.com/script.js"</script> iframe内headまたはbodyは、Chrome 61(現在のバージョン)であっても、JSスクリプトをまったくロードしません。

プロトコルとしてのソース「blob」をどうするかがわかりません。これは大きな警告です。

ソリューション:このコードは問題を解決し、主にVPAID広告で実行され、自動プロトコルで機能します。

function createIFrame(iframeContent) {
    let iFrame = document.createElement("iframe");
    iFrame.src = "about:blank";
    iFrameContainer.innerHTML = ""; // (optional) Totally Clear it if needed
    iFrameContainer.appendChild(iFrame);

    let iFrameDoc = iFrame.contentWindow && iFrame.contentWindow.document;
    if (!iFrameDoc) {
    console.log("iFrame security.");
    return;
    }
    iFrameDoc.write(iframeContent);
    iFrameDoc.close();
}
0
Nisim Joseph