js 图片上传压缩

<input type="file" class="upfile" id="upfile" accept="image/*" />

var canvas = document.createElement('canvas');
var context = canvas.getContext('2d');

var upfile = document.getElementById('upfile');
	upfile.onchange = function(e){
		var file = this.files[0];
		var imageType = /image.*/;		
		if (!file.type.match(imageType)) {
			layer.open({ content: "目前仅支持上传图片！", skin: 'msg', time: 3 });
			return;
		}

		var reader = new FileReader();
				
		reader.onload = function(e){				
			var img = new Image();
            img.src = e.target.result;
            compress(img);			
		};
		reader.readAsDataURL(file);
			
	}

 function compress(img,w,h) {
        img.onload = function () {
            // 缩放图片需要的canvas（也可以在DOM中直接定义canvas标签，这样就能把压缩完的图片不转base64也能直接显示出来）
            

            // 图片原始尺寸
            var originWidth = this.width;
            var originHeight = this.height;

            // 最大尺寸限制，可通过设置宽高来实现图片压缩程度
            var maxWidth = originWidth <= 1500 ? originWidth : 2100,
                maxHeight = originHeight <= 1500 ? originHeight : 2100;
            // 目标尺寸
            var targetWidth = originWidth,
                targetHeight = originHeight;
            // 图片尺寸超过1500x1500的限制
            if(originWidth > maxWidth || originHeight > maxHeight) {
                if(originWidth / originHeight > maxWidth / maxHeight) {
                    // 更宽，按照宽度限定尺寸
                    targetWidth = maxWidth;
                    targetHeight = Math.round(maxWidth * (originHeight / originWidth));
                } else {
                    targetHeight = maxHeight;
                    targetWidth = Math.round(maxHeight * (originWidth / originHeight));
                }
            }
            // canvas对图片进行缩放
            canvas.width = targetWidth;
            canvas.height = targetHeight;
            // 清除画布
            context.clearRect(0, 0, targetWidth, targetHeight);
            // 图片压缩
            context.drawImage(img, 0, 0, targetWidth, targetHeight);
            /*第一个参数是创建的img对象；第二三个参数是左上角坐标，后面两个是画布区域宽高*/

            //压缩后的图片转base64 url
           
            var newUrl = canvas.toDataURL('image/jpeg', 0.92);
		    // $('#divimg img').attr('src',newUrl);               	
			setTimeout(function(){
				$('#upfile').val('');
			},2000);				
						
			 $.ajax({
                    type: 'POST',
                    url: 'img/posturl',
                    dataType: 'json',
                    data: {
                        "file":newUrl
                    },
                    success: function(data){
                       
                    },
                    error:function(){
                       
                    }
                })
            
        };


    }