uniapp 图片检测旋转并压缩

const getOrientation = function(buffer) {
	// resolve需要先传值
	return new Promise(function(resolve) {
		let view = new DataView(buffer)
		if (view.getUint16(0, false) != 0xFFD8) {
			// resolve() 等于传值,这样then 直接就可以获取的到
			resolve(-2);
			return;
		}
		let length = view.byteLength,
			offset = 2;

		while (offset < length) {
			let marker = view.getUint16(offset, false);
			offset += 2;

			if (marker == 0xFFE1) {
				if (view.getUint32(offset += 2, false) != 0x45786966) {
					resolve(-1)
					return;
				}
				let little = view.getUint16(offset += 6, false) == 0x4949;
				offset += view.getUint32(offset + 4, little);
				let tags = view.getUint16(offset, little);
				offset += 2;

				for (let i = 0; i < tags; i++)
					if (view.getUint16(offset + (i * 12), little) == 0x0112) {
						resolve(view.getUint16(offset + (i * 12) + 8, little));
						return;
					}

			} else if ((marker & 0xFF00) != 0xFF00) break;
			else offset += view.getUint16(offset, false);
		}
		resolve(-1);
	});
}

// 创建画布
const createCanvas = function(oCanvas,url,dir){
	console.log(oCanvas,url,dir)
	let degree = 0;
	let drawWidth = 0;
	let drawHeight = 0;
	let context = uni.createCanvasContext(oCanvas);
	 return new Promise(function(resolve){
		 switch (dir) {
		 		
		 	//iphone横屏拍摄,此时home键在左侧 
		 	case 3:
		 		degree = 180;
		 		drawWidth = -161;
		 		drawHeight = -161;
		 		break;
		 		//iphone竖屏拍摄,此时home键在下方(正常拿手机的方向) 
		 	case 6:
		 		context.width = 161;
		 		context.height = 161;
		 		degree = 90;
		 		drawWidth = 161;
		 		drawHeight = -161;
		 		break;
		 		//iphone竖屏拍摄,此时home键在上方 
		 	case 8:
		 		context.width = 161;
		 		context.height = 161;
		 		degree = 270;
		 		drawWidth = -161;
		 		drawHeight = 161;
		 		break;
			default: 
				degree = 0;
				context.width = 161;
				context.height = 161;
				drawWidth = 161;
				drawHeight = 161;
		 }
		
		context.rotate(degree * Math.PI / 180);
		context.drawImage(url, 0, 0, drawWidth, drawHeight)
		context.draw()
	
		 // h5 base64 小程序blo值
		 setTimeout(() => {
				uni.canvasToTempFilePath({
		 		x: 0,
		 		y: 0,
		 		width: 161,
		 		height: 161,
		 		quality: 0.3,
		 		canvasId: oCanvas,
		 		success: (res) => {
					let base = res.tempFilePath
					console.log(base)
					resolve(base)
		
		 		}
		 	})
		 }, 50)	
	 })
		
}

export {getOrientation,createCanvas} 
// 临时路径
				let base64 = '';
				let dir = 0;
				let urls = '' 
				// 打开文件
				uni.chooseImage({
					count: 1,
					sourceType: ['album'],
					success: (res) => {
					urls = res.tempFilePaths[0]
					// this.imgPath = urls
					// 请求文件获取arraybuffer
					return new Promise(function(resolve) {
						uni.request({
							url: urls,
							method: 'GET',
							responseType: 'arraybuffer',
							success: res => {
								// 首次先传值给promise,不然then是没值的
								resolve(res.data)
							}
							});
						// then的值为初始值	
					}).then((buffer) => {
						// 调用识别方向获取结果
						getOrientation(buffer).then(dir => {
							console.log(dir)
							// 开始生成
							createCanvas('firstCanvas',urls,dir).then(base64 =>{
								
								console.log(base64)
								this.imgPath = base64
								this.isShow =true
							}).catch(a=>{
								console.log(a)
							})
						})
					});
				
					}
				})

拿上即用,觉得好点个赞


版权声明:本文为a690392431原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。