小编Rob*_*Rob的帖子

我正在开发一个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/en/tutorials/file/filesystem/#toc-file-creatingempty

谢谢!