Edge浏览器IE模式下无法创建JavaScript Blob对象问题求助

一、Blob 的支持核心逻辑 #

Blob 是HTML5规范引入的API，和所谓的"JavaScript版本"无直接绑定，核心取决于浏览器对HTML5特性的支持程度：

• 现代浏览器（Chrome、Firefox、Edge正式版等）均原生支持Blob
• IE9及更早版本完全不支持Blob
• IE10及IE11原生支持Blob，但IE10存在语法限制（比如不支持传入数组作为构造函数第一个参数）

二、Edge IE模式的Blob支持情况 #

Edge的IE模式本质调用IE渲染引擎，支持情况完全对应IE版本：

• 若IE模式使用IE9及以下内核：直接出现'Blob'未定义错误，完全不支持Blob
• 若IE模式使用IE10/IE11内核：支持Blob构造函数，其中IE10需注意参数写法兼容性，可通过BlobBuilder做兼容处理

三、旧环境兼容方案 #

如果必须兼容不支持Blob的环境，可采用以下两种方案：

1. 兼容IE10的Blob降级写法 #

var blob;
try {
    blob = new Blob(["Hello, world!"], {type: "text/plain;charset=utf-8"});
} catch (e) {
    // 适配IE10的BlobBuilder API
    var BlobBuilder = window.BlobBuilder || window.WebKitBlobBuilder || window.MSBlobBuilder;
    var builder = new BlobBuilder();
    builder.append("Hello, world!");
    blob = builder.getBlob("text/plain;charset=utf-8");
}

2. 完全绕过Blob的data URI方案（适配IE9及以下） #

var content = "Hello, world!";
var dataUri = "data:text/plain;charset=utf-8," + encodeURIComponent(content);
var link = document.createElement("a");
link.href = dataUri;
link.download = "demo.txt";

// 分环境处理下载逻辑
if (navigator.msSaveBlob) {
    // IE10+优先使用msSaveBlob
    var blob = new Blob([content], {type: "text/plain;charset=utf-8"});
    navigator.msSaveBlob(blob, "demo.txt");
} else if (document.execCommand) {
    // IE9及以下用execCommand触发保存
    link.style.display = "none";
    document.body.appendChild(link);
    document.execCommand("SaveAs", false, "demo.txt");
    document.body.removeChild(link);
} else {
    // 其他环境直接触发链接点击
    link.click();
}

内容的提问来源于stack exchange，提问作者pmcs