如何使用 html/angularjs 保存图像文件？

Question

我想允许用户在我的应用程序的一个 page/state 上保存图像，然后以编程方式在我的应用程序的另一个 page/state 上调用该图像。到目前为止，我考虑了三种保存图像的方法，但其中 none 似乎对我有用：

首先，我尝试使用我选择的数据库 Parse 创建一个 'Parse.File'。 Parse.File 是您保存图像的方式。无论出于何种原因，我都无法让它工作 ()。 Parse 的文档具有欺骗性的挑战性，因为它们假设的知识比我多。

接下来我想到将图像保存在云端，然后在 html 中指向它们。我尝试了 Cloudinary，但花了很长时间才弄清楚如何 assemble 他们的 Angularjs 插件，然后它缺少关于如何实际执行任何有意义的事情的任何类型的文档。后来我考虑了 Flickr，它更容易上手，但他们再次缺少一个我可以轻松应用于我的基本案例的示例。

最后，我想到也许我可以将图像保存在本地目录中，并在数据库中使用匹配的引用，就像我可能为我的应用程序调用的任何其他资产一样。到目前为止，我一直无法弄清楚如何做到这一点。我开始尝试使用 $http 上传图片。它没有用，所以我查看了 ng-file-upload 和 ngStorage。两者都没有很好的应用示例或很好的文档。最后，我尝试了本教程，但遇到了可怕的 Access Control Allow Origin 错误。此外，我不清楚哪个是解决此问题的正确方法。

我不确定这些方法是否正确。请与我分享哪种方法可以让用户保存稍后可以调用的图像文件。如果上述任何一种方法有效，请添加一些可能让我取得进展的细节。

Answer 1

这是应用程序还是网站？我同意你的看法，文档非常具有欺骗性。

您可以查看这些链接：

我与 cordova 共享我的应用程序代码：

var photo;

var cameraOptions = {
    quality: 50,
    destinationType: 0,
    encodingType: 0,
    targetWidth: 800,
    targetHeight: 800,
    mediaType: 0,
    correctOrientation: true,
    saveToPhotoAlbum: true
};

$scope.takePicture = function() {
    cameraOptions.sourceType = 1;
    navigator.camera.getPicture(onSuccess, onFail, cameraOptions);
}

$scope.selectPicture = function() {
    cameraOptions.sourceType = 0;
    navigator.camera.getPicture(onSuccess, onFail, cameraOptions);
}

function onSuccess(picture) {
    File.upload(picture)
        .success(function(data) {
            // What you want
        });
}

function onFail(resp) {
    alert('Error: ' + resp);
}

如何使用 html/angularjs 保存图像文件？

How do you save an image file with html/angularjs?

javascript

image

save

angularjs

parse-platform