html img 标签可以读取 base64 文件吗？答案

【问题标题】：Can a html img tag read base64 files?html img 标签可以读取 base64 文件吗？
【发布时间】：2014-09-22 21:10:15
【问题描述】：

小问题：html img 标签可以读取 base64 编码的图像文件吗？

<img src='path-to-file/image.base64'>

因为我遇到了麻烦。它触发 onerror 事件但没有给出原因（至少它没有说它找不到文件）

哦！一些上下文：我正在尝试将图像缓存到 android 上的 sdcard 作为 base64 编码文件。那部分有效，但是当我尝试加载缓存的图像时它失败了:(

【问题讨论】：

How to display base64 encoded image in HTML if it is located in a separated file? 的可能重复项
看看标题你可能是对的。会检查。谢谢！
不客气 :) 答案给出了一些关于如何和什么的指示，但是 TL;DR 使用 base64 仅用于内联，因为它是一种占用更多空间的编码格式，所以如果无论如何，您都使用文件，不只保存实际图像是没有意义的。

标签： android html base64

【解决方案1】：

从内联数据中获取图像的语法是：

<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUA
AAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO
9TXL0Y4OHwAAAABJRU5ErkJggg==" alt="your image">

【讨论】：

谢谢，但我不想内联使用它，我希望它从文件中读取 base64 字符串。还是不支持？

【解决方案2】：

好吧，原来 base64 仅用于内联使用（或者如果你有字符串，你可以用 javascript 设置它）

所以这行得通：

var image = new Image();
image.src = base64_string;

但是当你将 src 指向包含 base64_string 的文件时它不起作用

var image = new Image();
image.src = "path/base64.txt";

PS：感谢 cmets，这为我指明了正确的方向

【讨论】：