我正在将canvas转换为dataURL(base64)类型,我想使用PhoneGap的编写器将其保存到手机文件系统,但没有成功(我得到了无法打开的文件) - 这是我的一些代码:
var dataURL = document.getElementById("gen").toDataURL('image/png'); //substr() .replace('datadata:image/png;base64,', ''); window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, gotFS, fail); function gotFS(fileSystem) { fileSystem.root.getFile("screenshot.png", {create: true, exclusive: false}, gotFileEntry, fail); } function gotFileEntry(fileEntry) { fileEntry.createWriter(gotFileWriter, fail); } function gotFileWriter(writer) { console.log("open and write"); writer.seek(0); writer.write(dataURL); console.log("close and save"); } function fail(error) { console.log(error.code); } var fileTransfer = new FileTransfer(); fileTransfer.download("/", screenshot.png, function(entry) { alert("download complete"); }, function(error) { alert("download error source " + error.source); alert("download error target " + error.target); alert("upload error code" + error.code); } );
我也尝试过stackoverflow的其他解决方案,它基于addtional java插件,但它对我不起作用.是否有纯JS(附加js libs)解决方案?
FileWriter的write方法不带base64字符串.根据文档(http://docs.phonegap.com/en/edge/cordova_file_file.md.html#FileWriter),文本在编写之前将被编码为UTF-8.因此,在写入文件之前,您的base64字符串正在被编码,因此它不是有效的图像数据.您必须将图像数据作为Blob或ArrayBuffer传递.请注意,这仅适用于iOS和Android.在这个答案中看看Jeremy Banks的b64toBlob功能:https://stackoverflow.com/a/16245768
function b64toBlob(b64Data, contentType, sliceSize) { contentType = contentType || ''; sliceSize = sliceSize || 512; var byteCharacters = atob(b64Data); var byteArrays = []; for (var offset = 0; offset < byteCharacters.length; offset += sliceSize) { var slice = byteCharacters.slice(offset, offset + sliceSize); var byteNumbers = new Array(slice.length); for (var i = 0; i < slice.length; i++) { byteNumbers[i] = slice.charCodeAt(i); } var byteArray = new Uint8Array(byteNumbers); byteArrays.push(byteArray); } var blob = new Blob(byteArrays, {type: contentType}); return blob; }
您可以将生成的blob传递给write方法.