uniapp H5图片压缩上传

• compress.js

/**
 *  参数说明：
 *  imgSrc 图片url
 *  scale缩放比例 0-1
 *  type 返回图片类型  默认blob 
 *  callback 回调设置返回值 
*/
export function translate(imgSrc, scale, type , callback) {
	var img = new Image();
	img.src = imgSrc;
	img.onload = function() {
		var that = this;
		var h = that.height; // 默认按比例压缩
		var w = that.width;
		var canvas = document.createElement('canvas');
		var ctx = canvas.getContext('2d');
		var width = document.createAttribute("width");
		width.nodeValue = w;
		var height = document.createAttribute("height");
		height.nodeValue = h;
		canvas.setAttributeNode(width);
		canvas.setAttributeNode(height);
		ctx.drawImage(that, 0, 0, w,h);
		var base64 = canvas.toDataURL('image/jpeg', scale);//压缩比例
		canvas = null;
		if(type == 'base64'){
			callback(base64);
		}else{
			var blob = base64ToBlob(base64); 
			var blobUrl = window.URL.createObjectURL(blob);//blob地址
			callback(blobUrl);
		}
	}
}
export function base64ToBlob(base64) { // base转Blob
	var arr = base64.split(','),
		mime = arr[0].match(/:(.*?);/)[1],
		bstr = atob(arr[1]),
		n = bstr.length,
		u8arr = new Uint8Array(n);
	while (n--) {
		u8arr[n] = bstr.charCodeAt(n);
	}
	return new Blob([u8arr], {
		type: mime
	});
}

• 引入

import {translate} from './compress.js'

• 使用

uni.chooseImage({
	count: that.imgLength,
	sizeType: ['compressed'],
	sourceType: ['album', 'camera'],
	success: (res) => {
		if (that.tempFilePaths.length >= that.imgLength) {
			uni.showToast({
				title: '最多可上传' + that.imgLength + '张照片哦~',
				icon: 'none'
			})
			return
		}
		for (let i = 0; i < res.tempFilePaths.length; i++) {
			if (that.tempFilePaths.length < that.imgLength) {
				translate(res.tempFilePaths[i],0.1,'base64',base64Url=>{
					that.tempFilePaths.push(base64Url)
				})
			}
		}				
	}
})