javascript - 将 Canvas 图像保存在 IOS/Android 的本地移动存储上

Question

我使用 Fabric JavaScript 库来创建自定义图像。所有数据都保存在 Canvas 中，并使用 Canvas 标签显示。显示图像后，我想为用户提供将其保存在本地的选项。任何人都知道如何做到这一点？该解决方案应该适用于 IO 和 Android，我已经尝试了几种替代方案，但仍然没有成功。

[更新1] 我尝试使用 Canvas2ImagePlugin，但由于某种原因，我的应用程序在运行 window.canvas2ImagePlugin.saveImageDataToLibrary 命令时重新启动。

我的代码(我想在用户触摸保存按钮时保存图像):

$(document).on('click', '#saveButton', function(e){

    window.canvas2ImagePlugin.saveImageDataToLibrary(
    function(msg){
        console.log(msg);
    },
    function(err){
        console.log(err);
    },
    document.getElementById('c')
);

});

应用重新启动后，这会显示在浏览器日志中:

deviceready 在 5 秒后尚未触发。 (13:09:28:529) 在文件:///android_asset/www/cordova.js:1169 channel 未触发:onPluginsReady (13:09:28:542) 在文件:///android_asset/www/cordova.js:1162 channel 未触发:onCordovaReady (13:09:28:550) 在文件:///android_asset/www/cordova.js:1162 channel 未触发:onDOMContentLoaded (13:09:28:557) 在文件:///android_asset/www/cordova.js:1162

我还注意到，当 Netbeans 构建我的应用程序时，由于某种原因它会删除该插件。这是构建输出的一部分:

更新插件:

cordova.cmd 插件 cordova.cmd -d 插件删除 org.devgeeks.Canvas2ImagePlugin

在平台“android”的插件“org.devgeeks.Canvas2ImagePlugin”上调用plugman.uninstall 从 android 卸载 org.devgeeks.Canvas2ImagePlugin

[更新2]

经过一番研究，我发现我必须在文件\nbproject\plugin.properties 中手动添加插件。现在它工作完美。谢谢阿塔努CSE

Answer 1

试试这个插件

Canvas2ImagePlugin

<canvas id="myCanvas" width="165px" height="145px"></canvas>
function onDeviceReady()
{
    window.canvas2ImagePlugin.saveImageDataToLibrary(
        function(msg){
            console.log(msg);
        },
        function(err){
            console.log(err);
        },
        document.getElementById('myCanvas')
    );
}