离子3压缩图像 [英] Ionic 3 compress image

问题描述

我已经尝试使用Ionic 3压缩图像客户端2天了。我尝试过：

I've been trying to compress an image client-side with Ionic 3 for 2 days now. I have tried:

ng2-img-max -使用时会引发错误blue-imp-canvas-to-blob canvas.toBlob（）方法（依赖项 ng2-img-max ）。这只是告诉我错误发生在哪一行。我想我已经读过，不可能在Ionic中创建 HTMLCanvasElement -与 webworkers 有关。

ng2-img-max - throws an error when using the blue-imp-canvas-to-blob canvas.toBlob() method (a dependency of ng2-img-max). It was only telling me what line the error was happening on. I think I have read that creating an HTMLCanvasElement in Ionic isn't possible - something to do with webworkers.

Ahdin-JS库
JIC-JS库
TinyJPG-npm模块

所有这些都引发了各种错误，在对它们进行研究之后，我确定是因为库/模块与Ionic 3不兼容。我认为很多时候这是<$的问题c $ c> HTMLCanvasElement 。

These all threw various errors, after researching them I determined its because the libraries/modules were not compatible with Ionic 3. I think a lot of the time it was a problem with the HTMLCanvasElement.

我尝试了这个问题-但是更改 quality 变量不会更改图像的大小。

I tried the suggestion in this question - but changing the quality variable isn't changing the size of the image.

有人使用Ionic 3成功压缩了客户端的图像吗？您是怎么做到的？

Has anyone had success compressing images client-side using Ionic 3? How did you do it?

推荐答案

尝试将 CameraOptions 与相机插件。

const options: CameraOptions = {
        quality: 20,
        targetWidth: 600,
        targetHeight: 600,
        destinationType: this.camera.DestinationType.DATA_URL,
        encodingType: this.camera.EncodingType.PNG,
        mediaType: this.camera.MediaType.PICTURE,
        sourceType: this.camera.PictureSourceType.PHOTOLIBRARY,
        allowEdit: true //may not work with some deices
}

这篇关于离子3压缩图像的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！