将PNG画布图像保存到HTML5存储(JAVASCRIPT)?
|
我正在开发chrome扩展程序。
我在画布上打开一个图像文件,对其进行了一些更改,然后尝试将其保存到HTML5文件系统api。
首先,我从画布获取dataURL:
var dataURL = canvas.toDataURL(\'image/png;base64\');
然后只是数据:
var image64 = dataURL.replace(/data:image\\/png;base64,/, \'\');
然后我做一个Blob。
var bb = new BlobBuilder();
bb.append(image64);
var blob = bb.getBlob(\'image/png\');
然后,我使用以下函数onInitFs()请求文件系统;
function onInitFs(fs) {
fs.root.getFile(\'image.png\', {create: true}, function(fileEntry) {
// Create a FileWriter object for our FileEntry (log.txt).
fileEntry.createWriter(function(fileWriter) {
//WRITING THE BLOB TO FILE
fileWriter.write(blob);
}, errorHandler);
}, errorHandler);
}
window.requestFileSystem(window.PERSISTENT, 5*1024*1024, onInitFs, errorHandler);
这导致损坏的文件被写入文件系统。
我不知道还能做些什么。
有人可以指导我朝正确的方向前进。
以下是我用来完成此任务的功能的部分来源。
http://dev.w3.org/html5/canvas-api/canvas-2d-api.html#todataurl-method
http://www.html5rocks.com/zh-CN/tutorials/file/filesystem/#toc-file-creatingempty
谢谢!
没有找到相关结果
已邀请:
5 个回复
捕暑句簿姓
用法:
资料来源: http://mustachified.com/master.js 通过http://lists.whatwg.org/pipermail/whatwg-whatwg.org/2011-April/031243.html 通过https://bugs.webkit.org/show_bug.cgi?id=51652 通过http://code.google.com/p/chromium/issues/detail?id=67587
糕泰灌
这是一个使用FileSaver的小例子:http://jsfiddle.net/JR5XE/
稳赣苍卯改
舞备联
伞腹