JS中图片压缩的一般方法

前两天公司业务上有需求需要将较大的图片压缩后再传到远程服务器，网上找了不少方法都不太好用，今天有空索性自己写了一个方法，并把它放到了自己的github上，有兴趣的同学可以戳这里

一、需求是什么？

首先想一想我们有哪些需求？大多时候我们需要将一个File对象压缩之后再变为File对象传入到远程图片服务器；有时候我们也需要将一个base64字符串压缩之后再变为base64字符串传入到远程数据库；有时候后它还有可能是一块canvas画布，或者是一个Image对象，或者直接就是一个图片的url地址，我们需要将它们压缩上传到远程；面对这么多的需求，王二索性画了一张图：

[图片上传失败…(image-d58aa3-1510824060109)]

二、解决办法

如上图所示，王二一共写了七个方法，基本覆盖了JS中大部分文件类型的转换与压缩，其中：

1、urltoImage(url,fn) 会通过一个url加载所需要的图片对象，其中url参数传入图片的url,fn为回调方法,包含一个Image对象的参数，代码如下：

function urltoImage (url,fn){
   
    var img = new Image();
    img.src = url;
    img.onload = function(){
   
        fn(img);
    }
};

2、imagetoCanvas(image)会将一个Image对象转变为一个Canvas类型对象，其中image参数传入一个Image对象，代码如下：

function imagetoCanvas(image){