离子读取图像数据url

时间:2016-03-14 23:41:15

标签: cordova ionic-framework

我正在尝试使用Image Data Url Content插件或图库中的照片阅读$cordovaCamera,但我无法使其正常工作。它总是以Error Code 5: ENCODING_ERR返回。我也找不到它的含义。

我目前的代码如下

var options = {
  quality: 50,
  destinationType: Camera.DestinationType.FILE_URI,
  sourceType: Camera.PictureSourceType.CAMERA,
  allowEdit: false,
  correctOrientation: true,
  encodingType: Camera.EncodingType.JPEG,
  saveToPhotoAlbum: false
};

$cordovaCamera.getPicture(options)
  .then(function (imageURI) {
    var indexOfLash = imageURI.lastIndexOf('/') + 1;
    var name = imageURI.substr(indexOfLash);
    var namePath = imageURI.substr(0, indexOfLash);

    return $cordovaFile.copyFile(namePath, name, cordova.file.dataDirectory, name);
  })
  .then(function (info) {
     console.log('copied', info);
     return $cordovaFile.readAsDataURL(cordova.file.dataDirectory, info.nativeURL);
   })
   .then(function (success) {
   // success
     console.log("image data", success);
   })
   .then(function () {
     $scope.profile = user.getProfile();
   })
   .catch(function (error) {
     console.log('Failed because', error);
   });

2 个答案:

答案 0 :(得分:0)

安装此插件 cordova插件添加org.apache.cordova.camera

  // EDIT PROFILE IMG CHANGE
  $scope.editProfileImgGallary = function() {
    navigator.camera.getPicture(uploadEditProfilePhotosImage, onFailEditProfilePhoto, {
      targetWidth: 512,
      targetHeight: 512,
      quality: 80,
      correctOrientation: true,
      allowEdit: true,
      destinationType: navigator.camera.DestinationType.FILE_URI,
      sourceType: navigator.camera.PictureSourceType.PHOTOLIBRARY
    });
  }

  function onFailEditProfilePhoto(message) {
    // alert('Failed because: ' + message);
  }

  function uploadEditProfilePhotosImage(imageURI) {
    $ionicLoading.show({
      template: '<p>Loading...</p><ion-spinner icon="bubbles"></ion-spinner>'
    });
    console.log(imageURI);
    var img = document.getElementById('userEditProfileImg');
    img.src = imageURI;
    var options = new FileUploadOptions();
    options.fileKey = "file";
    options.fileName = imageURI.substr(imageURI.lastIndexOf('/') + 1);
    options.mimeType = "image/jpeg";
    var ft = new FileTransfer();
    ft.upload(imageURI, encodeURI("http://XYZ/Xyz.php?uid=" + userId + ""), winEditProfilePhotos, failEditProfilePhotos, options);
  }

  function winEditProfilePhotos(r) {
    console.log("Code = " + r.responseCode);
    console.log("Response = " + r.response);
    console.log("Sent = " + r.bytesSent);
    $ionicLoading.hide();
  }

  function failEditProfilePhotos(error) {
    console.log("upload error source " + error.source);
    console.log("upload error target " + error.target);
    $ionicLoading.hide();
    var alertPopup = $ionicPopup.alert({
      title: 'Uh Oh!',
      template: 'You Get Some Error Please Try Again..'
    });
  }

  // END = EDIT PROFILE IMG CHANGE

答案 1 :(得分:0)

我能够使用fullPath而不是nativeURL来读取文件,这里是代码片段

$cordovaFile.readAsDataURL(cordova.file.dataDirectory, info.fullPath.substring(1));

注意前导“/”的减法,因为它会引发错误