为什么可以显示带有“image/jpeg”数据 URL 的 base64 编码的 PNG？答案

【问题标题】：Why it is possible to show a base64 encoded PNG with an "image/jpeg" data URL?为什么可以显示带有“image/jpeg”数据 URL 的 base64 编码的 PNG？
【发布时间】：2018-08-04 16:36:17
【问题描述】：

以下是 base64 编码的 PNG 数据 URL 的示例（当然使用“image/png”数据类型）：

data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAYAAABWzo5XAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAZdEVYdFNvZnR3YXJlAHBhaW50Lm5ldCA0LjAuMTczbp9jAAAA1UlEQVQ4T62SsQ0CMQxFUzAEA1BQMgIlI1zJCIxAT0HJCBSUlFdQMAQlJWOE78hnObYDIuJLTzr/+/5FkpRz/guh2UM9pLQBWzDXvgVacG4lngncAH08QFgGLcEL0LAX34ROHCBcGaRLiEH+meAMXDhESBlkS3bVrh6KEZetQbOk7FmjmL5M40rKTmQSEJVdeXlCDtcSmgRkz4Ro32Zo+pK7+g7LqqEYjduBjsrzT6Mavl3xhzIJcXDkEBHfTl3WfNln8ARhyQR0sDkX6iU0ewjN38npDdYczGIKuRnZAAAAAElFTkSuQmCC

我注意到（在 Firefox 和 Chrome 中）即使数据类型设置为“image/jpeg”（其余所有内容保持不变）也能正常工作，如下所示：

data:image/jpeg;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAYAAABWzo5XAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAADsMAAA7DAcdvqGQAAAAZdEVYdFNvZnR3YXJlAHBhaW50Lm5ldCA0LjAuMTczbp9jAAAA1UlEQVQ4T62SsQ0CMQxFUzAEA1BQMgIlI1zJCIxAT0HJCBSUlFdQMAQlJWOE78hnObYDIuJLTzr/+/5FkpRz/guh2UM9pLQBWzDXvgVacG4lngncAH08QFgGLcEL0LAX34ROHCBcGaRLiEH+meAMXDhESBlkS3bVrh6KEZetQbOk7FmjmL5M40rKTmQSEJVdeXlCDtcSmgRkz4Ro32Zo+pK7+g7LqqEYjduBjsrzT6Mavl3xhzIJcXDkEBHfTl3WfNln8ARhyQR0sDkX6iU0ewjN38npDdYczGIKuRnZAAAAAElFTkSuQmCC

但是……为什么？

【问题讨论】：

标签： image browser base64 data-uri

【解决方案1】：

他们都在使用图像处理子系统，它忽略了 mime 类型，只使用图像的实际格式。

具体来说，大多数浏览器会将查看图像转换为查看带有<img> 标签的 HTML 网页。由于服务器存在缺陷，而且浏览器应该能够显示配置错误的网站，因此在大多数情况下，处理图像的浏览器部分将完全忽略任何扩展名或 MIME 类型。对 data: URI 的异常进行编程是没有意义的。

【讨论】：

嗯，是的，确实有道理。谢谢，接受