在angularjs中上传图片时如何自动压缩图片

Question

Here is my HTML form:

 <form name="myForm" ng-submit=""> <input ng-model='file' type="file"/> <input type="submit" value='Submit'/> </form> 

I want to upload an image. Here if the file size is big(like 3 or 4 MB), I want to compress image automatically to 1MB or less than that. Any options are there to autocompress images in angularjs or javascript.

Answer 1

you can use image-compressor, where you can specify your desired height and width of your image.

https://www.npmjs.com/package/image-compressor

Answer 2

This Angular directive compresses jpeg or png files using angularjs on client side. Read more about it here

This module depends on angularjs , so make sure you've added angularjs dependency and then angular-image-compress.js . Something like

angular.module('myApp', ['ngImageCompress']);

This is how you can achieve what you want.

 <input id="inputImage" type="file" accept="image/*" image="image1" resize-max-height="800" resize-max-width="800" resize-quality="0.7" resize-type="image/jpg" ng-image-compress />

Directives used in above input tag are self explanatory