ngCordova相机ImageURI拍摄照片后显示损坏的图像

时间:2016-05-02 03:51:35

标签: ionic-framework camera filepath ngcordova

我正在尝试调用相机并获取拍摄照片的路径以将其发送到我的FTP。

当我使用chrome://inspect之类的

时,我收到错误
   GET data:image/png;base64,file:///storage/sdcard0/Android/data/com.ionicframework.camera108827/cache/1462163674353.png net::ERR_INVALID_URL 

我已经成功调用了相机并拍摄了照片但我得到了破碎的图像。

这是我的代码获取拍摄照片的图像路径。

.controller('mycontroller',function($scope,$cordovaCamera){

  $scope.takePicture = function(){

    var options = { 
            quality : 75, 
            destinationType: Camera.DestinationType.FILE_URI,
            sourceType: Camera.PictureSourceType.CAMERA,
            allowEdit : false,
            encodingType: Camera.EncodingType.PNG,
            targetWidth: 250,
            targetHeight: 250,
            popoverOptions: CameraPopoverOptions,
            saveToPhotoAlbum: false
        };

        $cordovaCamera.getPicture(options).then(function(imageURI) {
            //$scope.image = "data:image/jpeg;base64," + imageData;
            console.log('invokeing cordovaCamera');
            $scope.image = "data:image/png;base64," + imageURI;
            console.log($scope.image);
            console.log(imageURI);

            //$scope.apply();
        }, function(err) {
            // An error occured. Show a message to the user
        });

    };

  });

在我的index.html

<ion-content ng-controller="mycontroller">
        <img ng-show="image !== undefined" ng-src="{{image}}">
        <img ng-show="image === undefined" ng-src="http://placehold.it/250x250">
        <button class="button" ng-click="takePicture()">Take Picture</button>
      </ion-content>

1 个答案:

答案 0 :(得分:0)

问题在于这一行

$scope.image = "data:image/png;base64," + imageURI;

应该是这样的

$scope.image =  imageURI;