通过 PhoneGap 将 PNG 或 JPG 图像保存到 iOS 中的照片答案

【问题标题】：Saving a PNG or JPG image to Photos in iOS via PhoneGap通过 PhoneGap 将 PNG 或 JPG 图像保存到 iOS 中的照片
【发布时间】：2012-10-15 03:40:33
【问题描述】：

我是 PhoneGap 的新手，想知道如何将应用内图像保存到 iOS 中的照片。

虽然我可以使用

navigator.camera.getPicture

有选项

quality:50, destinationType:Camera.DestinationType.DATA_URL,saveToPhotoAlbum: true

要将使用相机拍摄的照片保存到照片中，我现在正在尝试了解如何将应用内图像保存到照片中。

考虑以下 PhoneGap - Cordova 页面，其中元素 myPhoto 保存图像数据，例如“data:image/jpeg;base64,”...

<html>
    <head>
    <title>Save Image</title>
    <script type="text/javascript" charset="utf-8" src="cordova-2.1.0.js"></script>
    <script type="text/javascript" charset="utf-8">


    function savePicture(){
                    //this is where the magic would happen
                    //how can I save myPhoto to Photos?
                    //output imageData to a jpg or png file which would show up in Photos?
    }

        </script>
</head>
<body>
    <button onclick="savePicture();">Save Photo</button> <br>
            <input type="hidden" name="myPhoto" id="myPhoto" value="">
</body>
</html>

问题：

savePicture() 应该如何通过 Phonegap 将 myPhoto 中的图像数据保存到 iOS 中的照片？

【问题讨论】：

标签： ios image cordova base64 photos

【解决方案1】：

我最近遇到了以下 Phonegap 插件，用于在 iOS 中将 Canvas 图像保存到照片： https://github.com/devgeeks/Canvas2ImagePlugin

按照自述文件instructions 导入插件，然后您可以通过以下方式使用它：

<html>
    <head>
        <title>Save Image</title>
        <script type="text/javascript" charset="utf-8" src="cordova-2.1.0.js"></script>
        <script type="text/javascript" charset="utf-8" src="../Canvas2Image/Canvas2ImagePlugin.js"></script>
        <script type="text/javascript" charset="utf-8">

        var canvas2ImagePlugin; //devgeeks plugin for saving canvas images to photo gallery

        function onDeviceReady() {
             canvas2ImagePlugin = window.plugins.canvas2ImagePlugin;
         }

        function savePicture(){
            canvas2ImagePlugin.saveImageDataToLibrary(function(msg){console.log(msg);},function(err){console.log(err);},'mycanvas');
         }

        </script>
    </head>
    <body>
        <canvas id="myCanvas" width="500px" height="300px"> <strong>[Your browser can not show this example.]</strong> </canvas>
        <button onclick="savePicture();">Save Photo</button> <br>
    </body>
</html>

【讨论】：

我使用了您的代码和程序，但我无法获得解决方案。你能帮我找出来吗？
是的，我想得到解决方案.. 我得到了线程警告：插件应该使用 CordovaInterface.getThreadPool()。

【解决方案2】：

也许你可以试试我为 IOS 写的插件（如果你想将一个画布元素保存到相册，你可以使用下面的 downloadWithUrl 方法获取画布的 dataURI）。希望它对你有用。

这里是 git 链接：https://github.com/Nomia/ImgDownloader

简短示例：

document.addEventListener("deviceready",onDeviceReady);

//google logo url
url = 'https://www.google.com/images/srpr/logo11w.png';

onDeviceReady = function(){
    cordova.plugins.imgDownloader.downloadWithUrl(url,function(){
        alert("success");
    },function(){
        alert("error");
    });        
}

//also you can try dataUri like: 1px gif
//url = 'data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7'

您也可以使用下载方法将本地文件保存到图库中

【讨论】：

谢谢！！！这对我有用。我面临的唯一问题是，我的网址中有空格。无论如何，节省了我的时间:)
在尝试让文件 + 文件传输在 ios 上运行数小时后（Android 还可以），我放弃了，说好吧，让我们试试这个小插件...... 10 秒后，一切正常。你太棒了@Nimbosa！
你先生是男人！几乎零努力即可完美运行。希望我能在几个小时前找到这个。 :)