数据 URI link <a href="data: 在 Microsoft Edge 中不起作用

Question

这个简单的代码在除 Microsoft Edge 之外的任何地方都能完美运行：

<a href="data:text/plain;charset=utf-8,Test">link</a>

[JSFiddle]

在 Microsoft Edge 中，我收到 "That's odd...Microsoft can't find this page" 错误：

来自 Mozilla documentation 的示例也无法使用相同的结果。

这是 Edge 控制台的输出：

打开新边缘 window 时会出现此错误，在新选项卡上它会将 data:text/plain;charset=utf-8,Test 作为搜索查询输入默认搜索引擎。

Microsoft Edge 似乎没有 data:

的定义

有人知道解决这个问题的方法吗？

更新： 不幸的是，IE/Edge 中的链接似乎无法使用数据 URI。我创建了有关检测链接中数据 URI 支持的相关问题：

Answer 1

截至 2020 年，基于 Chromium 构建的新 Microsoft Edge 支持导航到地址栏中的数据 URI，就像其他基于 Chromium 的浏览器一样。 IE 和 Microsoft Edge Legacy 都不支持此功能； MSDN 声称这是 for security reasons.

旧版 Microsoft 浏览器的唯一解决方案是 link，使用支持的方案，例如 file:// 或 http://，对某些包含内容的资源。

有趣的是，IE 的最旧版本（我说的是早于 6 的版本）在 about: URI 方案中支持数据 URI 的前身，尽管仅 HTML 以这种方式受支持。这些 URI 今天不再有效，只是重定向到“取消导航”（以前是“取消操作”），或者在新的 Microsoft Edge 中，被视为无效的 edge:// URI。

Answer 2

由于 IE 和 Edge 确实支持以数据 URI 作为源的 <img> 标签，您可以使用 javascript 将 link 伪造为图像以写入文档：

<a href="javascript:document.write('<img src=data:image/png;base64,iVBORw0KGgoAA
AANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAABlBMVEUAAAD///+l2Z/dAAAAM0l
EQVR4nGP4/5/h/1+G/58ZDrAz3D/McH8yw83NDDeNGe4Ug9C9zwz3gVLMDA/A6
P9/AFGGFyjOXZtQAAAAAElFTkSuQmCC />')">link</a>

Answer 3

您可以尝试使用 navigator.msSaveBlob 来下载 IE/Edge 中的数据 URI:

var a = document.getElementsByTagName('a')[0];
a.addEventListener('click', function (e) {
    if (navigator.msSaveBlob) {
        var bytes = atob(a.href.split(',')[1]), array = [];
        for(var i = 0; i < bytes.length; i++) array.push(bytes.charCodeAt(i));
        navigator.msSaveBlob(new Blob([new Uint8Array(array)], {mime: "text/plain"}), "file.txt");
        e.preventDefault();
    }
});

数据 URI link <a href="data: 在 Microsoft Edge 中不起作用

Data URI link <a href="data: doesn't work in Microsoft Edge

hyperlink

data-uri

microsoft-edge