画布 TODataURL 到带有文件路径的图像答案

【问题标题】：Canvas DataURL to image with filePath画布 TODataURL 到带有文件路径的图像
【发布时间】：2015-06-08 12:28:00
【问题描述】：

我正在使用 cordova/PhoneGap 和 IonicFramework（使用 AngularJS）创建一个移动应用程序。在应用程序中，用户可以在画布上绘制他的签名 (https://github.com/szimek/signature_pad)。目前画布保存为 DataURL：

data:image/png;base64,iVBORw0KGgoAAAANS ...

保存签名后，我想使用 Cordova (http://docs.phonegap.com/en/3.1.0/cordova_file_file.md.html#FileTransfer) 的 FileTransfer 插件将图像发送到服务器。

我已经对从相机拍摄的常规图像执行此操作，并且效果很好。这是我的上传功能：

function uploadPicture(fileURL) {

        var win = function (result) {
            console.log('Success!');
        }

        var fail = function (err) {
            console.log('Fail!');
        }

        var options = new FileUploadOptions();
        options.fileKey = 'file';
        options.fileName = fileURL.substr(fileURL.lastIndexOf('/') + 1);
        options.mimeType = 'image/jpeg';
        options.chunkedMode = true;
        options.params = {};

        var ft = new FileTransfer();
        ft.upload(fileURL, encodeURI('http://example.com/upload/'), win, fail, options);
    }

现在您可以看到fileURL 是文件的完整路径。我发现当我以某种方式将 dataURL 转换为实际图像时，我可以使用该插件（不是 100% 确定这是否会修复它）。

这有可能吗？我搜索了很多，但找不到任何有用的东西。大多数示例都是关于将 dataURL 发送到服务器并让服务器处理它，但我不是在寻找那个。

对此有任何想法/想法/帮助吗？我希望我想要的都是可能的！

【问题讨论】：

标签： javascript cordova canvas file-transfer data-url

【解决方案1】：

您必须将 base64 转换为设备上的图像。然后上传它。但是，最好将base64发送到服务器并让其处理，以节省客户端的空间和时间。

【讨论】：

是的，我明白，但我真的很想在客户端做。我目前也将 dataURL 保存在 LocalStorage...