Phonegap - 如何从 base64 字符串生成图像文件？答案

【问题标题】：Phonegap - How to generate image file from base64 string?Phonegap - 如何从 base64 字符串生成图像文件？
【发布时间】：2012-07-04 01:27:26
【问题描述】：

我正在为 Android 编写一个 phonegap 应用程序，有一次，我将一个 base64 PNG 字符串保存为一个文件。但是，我观察到该字符串只是转储到一个文件中，并且在打开时不能被视为图像。

我希望能够保存从 base64 字符串生成的图像。这就是我所拥有的：

Javascript（为 Phonegap 格式化）：

/*** Saving The Pic ***/
var dataURL = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg=="; //A simple red dot

function gotFS(fileSystem) {
    fileSystem.root.getFile("dot.png", {create: true, exclusive: false}, gotFileEntry, fail);
}

function gotFileEntry(fileEntry) {  
    fileEntry.createWriter(gotFileWriter, fail);
}

function gotFileWriter(writer) {
    writer.write(dataURL); //does not open as image
}

function fail(error) {
    console.log(error.code);
}

我尝试编辑代码以仅保存图像数据，但它也不起作用。（见下文）

function gotFileWriter(writer) {
     var justTheData = dataURL.replace(/^data:image\/(png|jpg);base64,/, "");//Removes everything up to ...'base64,'
     writer.write(justTheData); //also does not show
 }

触发一切的 HTML：

<p onclick="window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, gotFS, fail)">Save a Dot</p>

请帮忙。谢谢。

【问题讨论】：

这可能是这个问题的答案：stackoferflow question 11321347

标签： javascript android cordova base64 phonegap-plugins

【解决方案1】：

您只需将图像的 src 设置为 base 64 数据即可查看图像。

var image = document.getElementById('myImage');
image.src = "data:image/jpeg;base64," + justTheData;

【讨论】：

我正在尝试将文件保存到磁盘；不要为浏览器生成它。不过谢谢你的尝试，西蒙。
您可能需要编写一个插件...我为 iOS 编写了一个将画布图像保存到照片库的插件，您可能需要做类似的事情。不妨先看看图像是如何保存在 Cordova Android 相机 API 中的？
您问“我希望能够查看从 base64 字符串生成的图像。”所以这就是我的回答。您正在正确地将 base64 数据写入文件。如果您将该数据加载到字符串中并像我提到的那样设置 src 它将是可见的。如果您想将该 base64 字符串转换为二进制 png 文件，您需要编写一个插件来执行此操作。
已解决。我按照您的建议创建了一个插件。谢谢。 Check it out
可以提供插件吗？

【解决方案2】：

这里不需要替换base64字符串，只需设置转换字符串如下：

在 javascript 中：

var image = document.getElementById('myImage');
image.src = justTheData;// this convert data

在 jquery 中：

$("#imageid").attr("src",justTheData)

【讨论】：