在Chrome和IE 11中将嵌入式图像作为新标签打开

Question

我正在尝试获取嵌入的PNG图像，以在Chrome和IE 11中的新标签页中打开。

在IE 11中，该标签页会打开，但不会呈现图像。

在Chrome中，该标签页不会打开，但是右键单击并可以使用“在新标签页中打开”。

<a href="data:image/png;base64,iVBORw0KGgoAA ..... kJggg==" width="40%" target="_blank"> image </a>

我希望有人知道这里发生了什么。

Answer 1

之所以发生这种情况，是因为浏览器阻止了对数据URL的顶级框架导航。有关更多信息，请检查Intent to Deprecate and Remove: Top-frame navigations to data URLs。

通常，要绕过此操作，您可以有几种选择：

• 将图像保存到服务器并通过常规方案（http，https，ftp）提供它们。

• 使用window.open()打开新标签并写入标记<img src="data:...">。

• 通过在链接中添加download属性来强制浏览器下载图像。