IMG 标记中的 SVG 数据 URI 未在 IE11 上显示答案

【问题标题】：SVG data URI in IMG tag isn't showing on IE11IMG 标记中的 SVG 数据 URI 未在 IE11 上显示
【发布时间】：2019-04-08 15:49:27
【问题描述】：

我让用户上传一个 SVG 图像，并尝试向他展示。

图像在 Edge、Firefox 和 Chrome 上显示良好，但在 IE11 上显示不佳。当我进入调试模式时，IE 和 Chrome 上的数据 URI 似乎不同。当我将 Chrome 中的数据 URI 复制到 IE 时，它正在工作。

有什么问题？为什么 IE 会更改数据 URI？

这里是代码

<img class="large-icon img large-icon-img user-img" id="large-icon" src="" style="height: 96px; width: 96px;">

谢谢

【问题讨论】：

【解决方案1】：

解决了，

问题在于，要在 IE11 中使用数据 URI，URI 必须是 base64 格式。所以我获取了 SVG 数据并在其上使用了 'btoa' 函数，并添加了 'svg+xml;base64' 作为他的 MIME 类型。

<img src={`data:image/svg+xml;base64,${window.btoa(data)}`} />

【讨论】：