如何在HTML文件中编码图像数据？

Question

我希望能够输出包含图像的HTML文件（在文件本身内）。谷歌搜索，我遇到了几个方法可以做到这一点：

• ​​
• 数据URI如<IMG SRC="data:image/gif;base64,[...]">
• <object ... >标签（尽管使用数据URI，所以可以继承相同限制）

但我不知道哪个更好的浏览器支持，或者如果有其他的选择。

任何有这方面实践经验的人都可以给我建议吗？谢谢。

Answer 1

在关于浏览器的支持，从Wikipedia：

数据URI目前支持 以下Web浏览器：

• 壁虎及其衍生物，如Mozilla Firefox
• Opera
• KDE，通过KIO输入/输出系统。这允许KDE浏览器Konqueror支持数据URI。
• Safari;虽然Safari的渲染引擎WebKit是Konqueror的KHTML引擎的衍生产品，但Mac OS X不共享KIO从属体系结构，因此实现不共享。
• 适用于iPhone的Safari;
• Google Chrome
• Internet Explorer 8;出于安全原因，微软对某些“不可导航”内容提供了有限的支持，例如在标签和CSS规则中，包括担心嵌入在数据URI中的JavaScript可能无法通过基于Web的电子邮件所使用的脚本过滤器来解释客户端。数据URI必须小于32k。
• TheWorld Browser;指对数据URI方案

IE不正确处理<object>代码，请参阅here更多细节内置支持的IE外壳浏览器。简而言之，你不能相信IE来显示图像。

​​也没有得到很好的支持，因为它被用于很多跨站脚本攻击。

关于web的this有很多讨论，他们都得出结论，没有好的通用方法来嵌入图像。如果您只需要支持一部分浏览器，那么数据uri可能会工作，或者是数据uri和javascript的组合。

Answer 2

imageData更灵活，例如一些ie将数据限制为32k。

Answer 3

数据URI方案的合理性很好的支持，除了在Internet Explorer版本8

的JavaScript的URI之前，我想，稍微好一点的支持，但如果JS是不可用的失败。

您可以做的最好的事情是坚持外部图像资源。

Answer 4

数据URI在< IE8中不起作用。 IE8支持他们高达32KB。