如何在上传到服务器之前调整 $cordovaCapture.captureImage 图片的大小？

Question

我使用 phone 在我的 Ioinc 应用程序中使用 $cordovaCapture.captureImage 捕捉图像，如下所示：

$cordovaCapture.captureImage(options).then(function(imageData) {

               var imagePath = "file://" + imageData[0].fullPath;
               console.log (imagePath);

                Utils.getBase64ImageFromInput(imagePath, function(err, base64Img) {

                    //Process the image string. 
                    $scope.myprofile.profilepic = base64Img;
                    $scope.myprofile.$save().then(function() {
                      console.log ("Save Avatar Image Successful!")
                    }, function(error) {
                      console.log("Error:", error);
                    });
                    Loader.hide();
                });
            }, function(err) {
                console.log(err);
                Loader.hide();
            });

Utils.getBase64ImageFromInput服务是这样的：

getBase64ImageFromInput: function(input, callback) {
      window.resolveLocalFileSystemURL(input, function(fileEntry) {
          fileEntry.file(function(file) {
                  var reader = new FileReader();
                  reader.onloadend = function(evt) {
                      callback(null, evt.target.result);
                  };
                  reader.readAsDataURL(file);
              },
              function() {
                  callback('failed', null);
              });
      },
      function() {
          callback('failed', null);
      });
    }

效果很好。但问题是我的 iPhone 捕获的图像太大了。我想将大小限制为 200x200，将质量限制为 0.8 jpg。但我没有在 ngCordova 文档中找到任何选项设置来做到这一点。在更新到我的 Firebase 服务器之前，如何调整 base64 图像的大小并对其进行优化？

Answer 1

此插件没有目标宽度和高度选项。所以我建议你使用 cordova 相机插件。通常相机插件比捕获插件更常用于图像相关要求。这是 link 插件： http://ngcordova.com/docs/plugins/camera/ 。如您所见，它有更多选项集，例如目标宽度和高度（意味着捕获图像后您需要的尺寸）、库或直接相机、质量、编码类型、裁剪 etc.Here 是一组选项

var options = {
      quality: 50, //0-100
      destinationType: Camera.DestinationType.DATA_URL, //DATA_URL (returns base 64) or FILE_URI (returns image path)
      sourceType: Camera.PictureSourceType.CAMERA,
      allowEdit: true, //allow cropping
      encodingType: Camera.EncodingType.JPEG,
      targetWidth: 100, //what widht you want after capaturing
      targetHeight: 100,
      popoverOptions: CameraPopoverOptions,
      saveToPhotoAlbum: false
    };
$cordovaCamera.getPicture(options).then(function(imageData) {
      var image = document.getElementById('myImage');
      image.src = "data:image/jpeg;base64," + imageData;
    }, function(err) {
      // error
    });

查看此 link 以了解所有可用选项。

如何在上传到服务器之前调整 $cordovaCapture.captureImage 图片的大小？

How to resize $cordovaCapture.captureImage image before upload to server?

angularjs

cordova-plugins

ionic

ngcordova