缩小相机插件中的图库照片尺寸

Question

我正在使用 Cordova 2.6 相机插件从设备图库获取图像，它们经过 base64 编码。我尝试使用“quality”选项将它们压缩到较低的质量。但我发现压缩不起作用。当我阅读 Cordova 文档https://github.com/apache/cordova-plugin-camera/blob/master/doc/index.md时，我发现：

注意：新设备上的照片分辨率相当高。即使指定了质量参数，从设备图库选择的照片也不会降低到较低的质量。为避免常见的内存问题，请将 Camera.destinationType 设置为 FILE_URI 而不是 DATA_URL。

在我的情况下，我只能使用 DATA_URL，因为我要使用第三方网络服务上传图片并对其进行编码。我仅使用来自设备库（而不是相机本身）的图像。我有一些性能问题，主要是在 Windows Phone 上。由于图像大小（我正在测试从设备图库中保存的大图像，但其是使用5MP或8MP手机相机拍摄的），我的应用程序需要太长时间来处理base64数据。

我的问题是，Cordova插件中是否有解决方案可以使“quality”选项在图库照片中起作用？

是否有自定义插件或分支，可以压缩设备图库的照片？

您建议的其他替代方案是什么？（例如使用FILE_URI的自定义本地插件，并返回压缩图像的base64加密）

- WiPhone

Answer 1

在调用 .getPicture 时，我们正在使用以下选项：

quality: 50,
destinationType: Camera.DestinationType.DATA_URL,
encodingType: Camera.EncodingType.JPEG,
sourceType: Camera.PictureSourceType.CAMERA,
targetWidth: 800,
correctOrientation: true

质量参数似乎对文件大小没有太大的影响。但是 targetWidth 和出于某种奇怪的原因，correctOrientation 有影响。这些设置得到的图片大小大约为24kB，具体取决于设备的相机分辨率。

- 360Airwalk

Answer 2

我在从相机或图库中选择任何照片后使用此下一个函数。我正在使用插件cordova-plugin-simple-image-resizer

  function resizeImageIfNeeded (imageUri, callback) {
    // if image larger than this, resize
    var MAX_IMG_FILE_SIZE = 307200 // 300kb

    app.functions.getFileSize(imageUri, function (fileSize, err) {
      if (!err && fileSize && fileSize < MAX_IMG_FILE_SIZE) {
        // no need to resize image, return image unchanged
        console.log('Image Not resized (file already small): ' + imageUri)
        callback(imageUri)
      } else {
        // resize image (try even if file size is not obtained)
        resizeImage(imageUri, function (resizedImageUri, err) {
          if (err) {
            // could not resize image
            callback(imageUri, Error(err))
          }
          // return resized image
          callback(resizedImageUri)
        })
      }
    })
  }

  function resizeImage (imageUri, callback) {
    // get just fileName with suffix, ex.: "photo1_resized.jpg"
    var fileNameResized = addSuffixToFileName(
      getFilenameFromURL(imageUri)[1],
      '_resized'
    )

    var resizeOptions = {
      uri: imageUri,
      fileName: fileNameResized,
      quality: 90,
      width: 1200,
      height: 1200,
      base64: false
    }

    window.ImageResizer.resize(resizeOptions,
      function (resizedImageUri) {
        // success on resizing
        console.log('%c Image resized: ', 'color: green; font-weight:bold', resizedImageUri)
        callback(resizedImageUri)
      },
      // failed to resize
      function (err) {
        console.log('%c Failed to resize: ', 'color: red; font-weight:bold')
        callback(imageUri, Error(err))
      })
  }

  function getFileSize (fileUri, callback) {
    var fileSize = null
    window.resolveLocalFileSystemURL(fileUri, function (fileEntry) {
      fileEntry.file(function (fileObj) {
        fileSize = fileObj.size
        callback(fileSize)
      },
      function (err) {
        console.error('fileEntry error:\n', JSON.stringify(err))
        callback(fileSize, Error(err))
      })
    },
    function (err) {
      console.error('resolveLocalFileSystemURL error:\n', JSON.stringify(err))
      callback(fileSize, Error(err))
    })
  }

  // ex: from "file:///storage/emulated/0/Android/data/com.form.parking.violation/cache/1525698243664.jpg"
  // output[0] == "file:///storage/emulated/0/Android/data/com.form.parking.violation/cache"
  // output[1] == "1525698243664.jpg"
  function getFilenameFromURL (url) {
    if (!url) {
      return false
    }
    var output = []
    output[1] = url.split('/').pop()
    output[0] = url.substring(0, url.length - output[1].length - 1)
    return output
  }

- João Pimentel Ferreira