今天在做canvas图片压缩时碰到一个奇怪的问题，使用canvas绘制画片并转换成base64时，

    老是报错如下：

image_handler.html:50 Uncaught DOMException: Failed to execute 'toDataURL' on 'HTMLCanvasElement': Tainted canvases may not be exported.

产生这个错误的原因是因为我使用的是一张远程的图片(图片地址以http开头),canvas在使用远程图片的时候会有跨域的问题。解决的方法是在加载图片之前做如下的设置即可：

    if(image.indexOf('http') == 0)img.crossOrigin = '*';

注意：不这样设置的话，图片也是可以绘制出来的，但是要对它进行运算就不行了。这个坑以后可能还会踩到，所以记录下来。

完整代码如下：