IE 11无法显示嵌入的Base64图片

Question

我通过Libre Office将docx文件导出为XHTML，并且它使用Base64编码存储图片：

<img style="height:0.647cm;width:0.743cm;" alt="" src="data:image/*;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAYCAIAAABm/grVAAAAA3NCSVQFBgUzC42AAAAAAXNSR0IArs4c6QAAAkpJREFUSEvllTFoU0EYx7/KG+5BhnvQ4QV0CERohEJfJi042M2MFZcGB6kOEjpIstlJikNtnKKdSgdJB4duqYM0Y1IIJIXKyxDxFVp4DwzcDQ/uAwPnJa/UmJwmSBfxho/jeN/v/b/v/x03I6WEq17XrhrY5/3n0BmtUdWjIBDEDdAkRCBaBvGREcNEFJYBDBEMgogpComElbltjxijh779yMGglglMoGUSJuB3e37afvE0NQLVG+Vz5CF3zwIMUcU/7D2OmvlR5Y+vrX0mvw+OJ8Xcm+Z4uqGdUxaqrgH04DK2jlpE9bGHUaTQNr0KmV3M030434Drd37h6JV+YFLI3Ka/8vLr6qav9m7D/fklq7FqXnZqUgjZOXTfrYxA9EqV18qo0pp9qVSpu9DC69Ct0vkH/EuNgoCYZc0mpjLK6k/PgBIFRGfBgRAgqGO3AsllwDKNMa++533ase+vTwVlKKLeRUoJkNZxy/u8B7xCktl+Ewmq0zgRxY4DMTIVNNJY2ObZ196T7aDvGGtapAlzEdECbvN6G5wC643WrlL1PVX1IuDWY9VTVHqD0wNqtOnCKpwXgZjQpbzRpg93ENW9qo7Pj3746UXtqDSykwPh10wjjcfr/dvZtRWR3N3oEwcTNg7VX9Pi+xYLSRAiIZDBQuZ5JdjN+mc1uJFGDmW2zCChilHE9LyVf+SMcrVzOnxYeubIRkmelN1XS4drKfmNTUzRKx3+c3YpvpSM37oZt+cWE/dyEKMTH4vJ0ImIaY36C9Bwyr/zRv0AJXP6SKxkbXEAAAAASUVORK5CYII="/>

以下是相应的JSFiddle。

我尝试过以下方法：

1. 图像没有损坏。 在Firefox和Chrome中可以正常显示该图像，但在IE 11中无法显示。
2. 图像小于32 KB。 我在类似的问题上看到IE不能显示这些图像，但那里的问题是超过32 KB，而我使用的图像只有1 KB。而且，IE 11的4 GB限制也不是这个原因。
3. 显式设置height和width属性没有任何影响。

- icc97

---

“image/*” 不是一个有效的图像 MIME 类型。不匹配的 MIME 类型是浏览器安全策略将资源阻止为可疑来源的理由。 - Niet the Dark Absol

我在IE11中遇到了类似的问题。令人难以置信的是，Chrome、Opera和Firefox接受这种格式，就像这样输入data:image/png，但在IE11中却不行。我不得不严格避免空格，才能让它在IE11中正常工作。 - Maximus Decimus

Answer 1

Libre Office使用src="data:image/*输出图像，但我解决了这个问题，改用src="data:image/png。

- icc97

---

你为什么要使用Libre Office制作网页？o_O - Niet the Dark Absol

@NiettheDarkAbsol 因为我有一个帮助指南，是别人用Word写的，我需要将它转换成HTML。 - icc97

这实际上是我听过的最好的问题原因XD 我会说“继续”，但至少要考虑首先将其重写为HTML，而不是依赖自动转换系统。文字处理器旨在输出物理页面，而网页则更加灵活。 - Niet the Dark Absol

@NiettheDarkAbsol 我有一个非技术用户正在编写指南，他习惯使用Word。此外，所有其他文档都是用Word编写的。因此，很难建议其他东西。我提到了Markdown，但得到了一些茫然的表情 :) - icc97