嵌入式 Base64 图像不会在 Dolphin 或 Android Stock 浏览器中显示

Question

我整个下午都在谷歌上搜索这个问题，似乎找不到任何 Dolphin 和 Base64 图像或数据 URL 一起出现的搜索。但是，当我找到有关一般嵌入 Base64 图像的文章时，他们几乎都说它适用于除 IE 之外的几乎所有浏览器。当然，我不能只查看该死的页面源代码或设备（Samsung Galaxy Tab Gingerbread）上的任何错误控制台来查看页面正在解释的内容。我得到的只是？图像应该在哪里。适用于 Chrome 和 Opera，但 Dolphin 或普通浏览器都不起作用。

基本上，我有一个第三方签名板控件，其签名图像作为 base64 编码字符串返回给我。然后，我采用该 base64 编码字符串，将其转换为 DataURL 并将其作为 src 分配给我的 img 控件。在 Chrome 和 Opera 上运行起来就像一个魅力，但在我需要它运行的任何移动浏览器上都不起作用。

 var canvas = signaturestr.toDataURL("image/png") //Have also tried jpg and bmp
 $("#image").attr("src", canvas)

这给了我？图像应该在哪里。因此，要么我需要一种方法来获取数据 url 并使其被这些浏览器接受，要么我需要能够使用原始 base64 代码来生成图像。同样重要的是要注意，这是一个离线应用程序，我需要所有解决方案都采用 javascript 或 jquery。

编辑：发现来自其他网站的 Base64 图像（包括来自 stackoverflow 论坛的头像）确实出现在这些浏览器上。已尝试缩小图像的大小，但仍然没有成功。仍然得到替代文本和？。尺寸绝对不是问题。将我的图像缩小到比有效头像更小的尺寸。真的不知道为什么这个图像不能在这些浏览器上工作。看起来与有效的图像完全相同。

Answer 1

我遇到了类似的问题，并发现：

当您尝试加载 JPEG 文件时，dataURL 是错误的......它以 data:base64 开头code> 而不是 data:image/jpeg;base64。我解决了这个问题：

var image = new Image();
image.onload = doSomethingElse();
image.src = myDataURL.replace('data:base64', 'data:image/jpeg;base64');

PNG 文件似乎工作正常。

我使用 Android 4（冰淇淋三明治）进行了测试，效果非常好 - 甚至可以直接从设备加载大照片。

Answer 2

能够简单地在禁用控件的新实例上重新显示捕获的签名，而不是转换为图像并以这种方式显示。工作原理是一样的。