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

Question

我使用手机在 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

该插件没有 taget 宽度和高度选项。所以我建议你使用 cordova 相机插件。通常，对于图像相关的需求，相机插件比捕获插件更常用。这是插件的链接:http://ngcordova.com/docs/plugins/camera/ 。正如您所看到的，它有更多的选项集，例如目标宽度和高度(意味着捕获图像后需要什么尺寸)、库或直接相机、质量、编码类型、裁剪等。这里是选项集

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了解所有可用选项。