处理iOS中照片的方向与图片压缩

处理iOS中照片的方向与图片压缩

	photoCompress2(fileObj, {
				quality: 0.7
			}, function(base64Codes) {
				// 方法处理
			});
							
		/*
		三个参数
		file：一个是文件(类型是图片格式)，
		w：一个是文件压缩的后宽度，宽度越小，字节越小
		objDiv：一个是容器或者回调函数
		photoCompress()
		 */
		function photoCompress2(file, w, objDiv) {
			var Orientation;
	  		//EXIF js 可以读取图片的元信息 https://github.com/exif-js/exif-js
		  	EXIF.getData(file,function(){
			    Orientation=EXIF.getTag(this,'Orientation');
			    var ready = new FileReader();
				/*开始读取指定的Blob对象或File对象中的内容. 当读取操作完成时,readyState属性的值会成为DONE,如果设置了onloadend事件处理程序,则调用之.同时,result属性中将包含一个data: URL格式的字符串以表示所读取文件的内容.*/
				ready.readAsDataURL(file);
				ready.onload = function() {
					var re = this.result;
					canvasDataURL2(re, w, Orientation, objDiv)
				}
			});
			
		}
		
		function canvasDataURL2(path, obj, dir, callback) {
			var img = new Image();
			img.src = path;
			img.onload = function() {
				var that = this;
				// 默认按比例压缩
				var w = that.width,
					h = that.height,
					scale = w / h;
				w = obj.width || w;
				h = obj.height || (w / scale);
				var quality = 0.8; // 默认图片质量为0.7
				var canvas = document.createElement('canvas');
				var ctx = canvas.getContext('2d');
				// 创建属性节点
				/*var anw = document.createAttribute("width");
				anw.nodeValue = w;
				var anh = document.createAttribute("height");
				anh.nodeValue = h;
				canvas.setAttributeNode(anw);
				canvas.setAttributeNode(anh);*/
				var width = w;
				var height = h;
				//判断图片方向，重置canvas大小，确定旋转角度，iphone默认的是home键在右方的横屏拍摄方式
			  	//荣耀手机不管拍摄角度 dir都是0
			  	switch(dir){
				  	//荣耀
				  	case 0:
						canvas.width = width;
						canvas.height = height;
						ctx.drawImage(that, 0, 0, width, height);
					  	break;
					//iphone横屏拍摄，此时home键在右侧 	
				  	case 1:
						canvas.width = width;
						canvas.height = height;
						ctx.drawImage(that, 0, 0, width, height);
					  	break;
				    //iphone横屏拍摄，此时home键在左侧
				    case 3:
						canvas.width = width;
						canvas.height = height;
				      	ctx.rotate(180*Math.PI/180);
						ctx.drawImage(that, -width, -height, width, height);
				      	break;
				    //iphone竖屏拍摄，此时home键在下方(正常拿手机的方向)
				    case 6:
						canvas.width=height;
				      	canvas.height=width;
				      	ctx.translate(0, width);
				     	ctx.rotate(90*Math.PI/180);
						ctx.drawImage(that, 0, -height, -width, height);
				      break;
				    //iphone竖屏拍摄，此时home键在上方
				    case 8:
						canvas.width=height;
						canvas.height=width; 
						ctx.translate(0, width);
			       		ctx.rotate(270*Math.PI/180);
						//ctx.drawImage(that, 0, h, w, -h);
						ctx.drawImage(that, 0, height, width, -height);
				      break;
				    default :
				    	canvas.width = width;
						canvas.height = height;
						ctx.drawImage(that, 0, 0, w, h);
					  	break;
				    break;
				}
			  	
				// 图像质量
				if(obj.quality && obj.quality <= 1 && obj.quality > 0) {
					quality = obj.quality;
				}
				// quality值越小，所绘制出的图像越模糊
				var base64 = canvas.toDataURL('image/jpeg', quality);
				// 回调函数返回base64的值
				callback(base64);
			}
		}