set a Blob as the "src" of an iframe

Question

The following code work perfectly in 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>

But it is not working with IE. Can some one please tell me what is wrong here.

The iframe "src" also set to the blob as shown below.

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

Note: I went on the window.navigator.msSaveOrOpenBlob(newBlob) path as well but no luck so far.

Answer 1

An example I did for Blob as a source of iFrame and working great with one important CAUTION / WARNING:

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

iFrame with Blob is not auto redirect protocol, meaning, having <script src="//domain.com/script.js"</script> inside the iframe head or body won't load the JS script at all even on Chrome 61 (current version).

it doesn't know what to do with source "blob" as protocol. this is a BIG warning here.

Solution: This code will solve the issue, it runs mostly for VPAID ads and working for auto-protocol:

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