从相机加载图像内容到文件 [英] Load contents of image from camera to a file

问题描述

我正在使用 phonegap API 拍照(或从库中选择)，使用以下描述:

MyApp.directive('Camera', function () {返回 {限制:'A'，要求:'ngModel'，链接:函数(范围，榆树，属性，ctrl){elm.bind('点击', function() {navigator.camera.getPicture(function (imageURI){范围.$应用(函数(){ctrl.$setViewValue(imageURI);});}, 函数(错误){ctrl.$setValidity('error', false);},//选项=>http://docs.phonegap.com/en/2.6.0/cordova_camera_camera.md.html#Camera{ 质量:50，目的地类型:Camera.DestinationType.FILE_URI})});}};});

它返回一个 URI，看起来像，在 chrome 上使用涟漪模拟器，我看不到粘贴这个 URI.

blob:http%3A//localhost%3A8080/8e18de30-d049-4ce2-ae88-8500b444581e

我的问题是加载这个 URI

$scope.updateUserProfile = 函数(用户){var myPicfile = $http.get(user.myPicture);dataService.uploadPicture ...一些将图片更新为 Parse 的代码}

*注意:' +用户.尼克;

 $http({方法:'POST'，网址:服务器网址，数据:user.myPicture，标头:{'X-Parse-Application-Id':PARSE_APP_ID，'X-Parse-REST-API-Key':PARSE_REST_API_KEY，'内容类型':'文本/纯文本'}})

关于如何将图像内容转换为文件然后我可以愉快地上传到 Parse.com 的任何想法?

谢谢！

解决方案

我终于解决了这个问题，因为我的最终目标是将它与 phonegap 一起使用，这篇文章中的信息..非常感谢 Raymond Camden！

function gotPic(data) {window.resolveLocalFileSystemURI(data, function(entry) {var reader = new FileReader();reader.onloadend = 函数(evt){var byteArray = new Uint8Array(evt.target.result);var output = new Array( byteArray.length );变量 i = 0;var n = output.length;而(我< n){输出[i] = byteArray[i];我++;}var parseFile = new Parse.File("mypic.jpg", output);parseFile.save().then(function(ob) {navigator.notification.alert(明白了！", null);console.log(JSON.stringify(ob));}, 函数(错误){控制台日志(错误")；控制台日志(错误)；});}reader.onerror = 函数(evt){console.log('读取错误');console.log(JSON.stringify(evt));}entry.file(function(s) {reader.readAsArrayBuffer(s);}, 函数(e) {console.log('ee');});});}

I am taking a picture (or selecting from library) using phonegap API using the following drictive:

MyApp.directive('Camera', function () {
    return {
        restrict: 'A',
        require: 'ngModel',
        link: function(scope, elm, attrs, ctrl) {
            elm.bind('click', function() {
                navigator.camera.getPicture(function (imageURI)
                {
                    scope.$apply(function() {
                        ctrl.$setViewValue(imageURI);
                    });
                }, function (err) {
                    ctrl.$setValidity('error', false);
                },
                //Options => http://docs.phonegap.com/en/2.6.0/cordova_camera_camera.md.html#Camera
                { quality: 50,
                  destinationType:Camera.DestinationType.FILE_URI                      
                })
            });
        }
    };
});

Which return me a URI that looks like, using ripple emulator on chrome, which I cann see pasting this URI.

blob:http%3A//localhost%3A8080/8e18de30-d049-4ce2-ae88-8500b444581e

My issue is loading this URI

$scope.updateUserProfile = function (user) {

       var myPicfile = $http.get(user.myPicture);

       dataService.uploadPicture . . . some code to update the picture to Parse

    }

*Note: I cannot use phonegap filetransfer together with parse.com :

When I do that I get:

I am making my request like:

uploadPicture: function uploadPicture(user,callback) { var serverUrl = 'https://api.parse.com/1/files/' + user.Nick ;

            $http({
                method: 'POST',
                url: serverUrl,
                data: user.myPicture,
                headers: {'X-Parse-Application-Id': PARSE_APP_ID,
                    'X-Parse-REST-API-Key': PARSE_REST_API_KEY,
                    'Content-Type': 'text/plain'
                }
            })

Any idea on how to get the content of the image to a file that then I can happily upload to Parse.com?

Thanks!

解决方案

I finally work it around, since my ultimate goal was to use it with phonegap, with the info in this post. . Big thanks to Raymond Camden!

function gotPic(data) {

window.resolveLocalFileSystemURI(data, function(entry) {

var reader = new FileReader();

reader.onloadend = function(evt) {
    var byteArray = new Uint8Array(evt.target.result);
    var output = new Array( byteArray.length );
    var i = 0;
    var n = output.length;
    while( i < n ) {
        output[i] = byteArray[i];
        i++;
    }                
    var parseFile = new Parse.File("mypic.jpg", output);

    parseFile.save().then(function(ob) {
            navigator.notification.alert("Got it!", null);
            console.log(JSON.stringify(ob));
        }, function(error) {
            console.log("Error");
            console.log(error);
        });

}

reader.onerror = function(evt) {
      console.log('read error');
      console.log(JSON.stringify(evt));
  }

entry.file(function(s) {
    reader.readAsArrayBuffer(s);
}, function(e) {
    console.log('ee');
});

});
}

这篇关于从相机加载图像内容到文件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！