编码图像base64

Question

我试图对图像进行基本编码以通过CSS将其显示为：

background-image: url(data:image/png;base64,%codeForImage%)

所以我尝试了在这里找到的内容：

但这不会显示任何图像（使用“ phonegap android drawable”中的png图像。

两个问题：

我该如何解决这个问题或如何在没有使用base64的情况下显示图像。

示例：是否可以抓取图像的字节并通过显示

background-image:url(data:%uncodedImageBytes%)

背景：我正在从phonegap插件获取图像的字节，并且试图将图像显示给用户。

Answer 1

第一段代码是正确的：

background-image: url(data:image/png;base64,%codeForImage%)

插入二进制数据将不起作用。

如果看到的图像与期望的图像不同，则CSS选择器与元素不匹配（例如，如果元素是<div id="foobar"> ，而选择器是div.foobar ），或者您的选择器不够具体。

无论哪种情况，都可以使用Firebug之类的元素检查该元素，并检查对元素应用了哪些CSS规则，以及是否可以在顶部看到想要的CSS规则。

Answer 2

一般而言，我建议针对移动应用程序使用Base 64。

为什么？ 在这里检查。

如果您希望在性能提高的情况下仍使用Base64，则建议您使用类似该站点的站点来进行Base64编码。 否则，您的url字符串看起来合适，但是二进制文件不是它期望的格式。 有趣的是，它期望使用Base64-完全不同。

编辑

如果您需要在运行时仅使用二进制文件执行此操作，请使用JavaScript进行。 它具有烘焙的功能，该功能将处理从Window对象挂起的二进制文件中的Base64编码。

像这样使用它：

var bSixtyFourString = window.btoa(%MY_BINARY%);