/** * 获得base64 * @param {Object} obj * @param {Number} [obj.width] 图片需要压缩的宽度,高度会跟随调整 * @param {Number} [obj.quality=0.8] 压缩质量,不压缩为1 * @param {Function} [obj.before(this, blob, file)] 处理前函数,this指向的是input:file * @param {Function} obj.success(obj) 处理后函数 * @example * */ $.fn.localResizeIMG = function (obj) { this.on('change', function () { var file = this.files[0]; var URL = URL || webkitURL; var blob = URL.createObjectURL(file); // 执行前函数 if($.isFunction(obj.before)) { obj.before(this, blob, file) }; if( navigator.userAgent.match(/iphone/i) ) { var preImg = new Image(); preImg.onload = function(event) { EXIF.getData(preImg, function() { var orientation = 1; if(preImg.exifdata) { orientation = preImg.exifdata.Orientation; } $('#txtinfo').val(orientation); _create(blob, orientation); }); } preImg.src = blob; } else { _create(blob, 1); } this.value = ''; // 清空临时数据 }); /** * 生成base64 * @param blob 通过file获得的二进制 */ function _create(blob, orientation) { var img = new Image(); img.src = blob; img.onload = function () { var that = this; //生成比例 var w = that.width, h = that.height, scale = w / h; w = obj.width || w; h = w / scale; //生成canvas var canvas = document.createElement('canvas'); var ctx = canvas.getContext('2d'); $(canvas).attr({width : w, height : h}); ctx.drawImage(that, 0, 0, w, h); /** * 生成base64 * 兼容修复移动设备需要引入mobileBUGFix.js */ var base64 = canvas.toDataURL('image/jpeg', obj.quality || 0.8 ); // 修复IOS if( navigator.userAgent.match(/iphone/i) ) { var mpImg = new MegaPixImage(img); console.log(orientation); $('#txtinfo').val(orientation); mpImg.render(canvas, { maxWidth: w, maxHeight: h, quality: obj.quality || 0.8, orientation: orientation||1}); // base64 = canvas.toDataURL('image/jpeg', obj.quality || 0.8 ); } // 修复android if( navigator.userAgent.match(/Android/i) ) { var encoder = new JPEGEncoder(); base64 = encoder.encode(ctx.getImageData(0,0,w,h), obj.quality * 100 || 80 ); } // 生成结果 var result = { base64 : base64, clearBase64: base64.substr( base64.indexOf(',') + 1 ) }; // 执行后函数 obj.success(result); }; } }; // 例子 /* $('input:file').localResizeIMG({ width: 100, quality: 0.1, //before: function (that, blob) {}, success: function (result) { var img = new Image(); img.src = result.base64; $('body').append(img); console.log(result); } }); */