Uniapp 上传 base64 图片

                                                  Uniapp 上传 base64  图片

---

之前通过 纯 vue 项目做过类似，功能 但是发现在 Uniapp for App 端 不好使！又看了 别人的代码； 又只能在 微信小程序 中跑；

经过爬坑： 功能实现 在此记录下过程：

好多 人用  uni.getFileSystemManager() ：但是不能在 APP 和 H5 中使用；

 

正解：

//选择图片
onSelect() {
	 
	uni.chooseImage({
		count: 1,
		sizeType: ['original', 'compressed'],
		sourceType: ['album'],
		success: function(res) {
			console.log('res.tempFilePaths:', res.tempFilePaths);
			detailImage( res.tempFilePaths[0], (data)=>{
                            //base64 图片内容就是  data
                        })
		}.bind(this)
	});
},

detailImage(path, callback) {
	// #ifdef APP-PLUS
	plus.io.resolveLocalFileSystemURL(path, function(entry) {
		entry.file(function(file) {
			var fileReader = new plus.io.FileReader();
			//alert("getFile:" + JSON.stringify(file));
			fileReader.readAsDataURL(file);
			fileReader.onloadend = function(evt) {
				// console.log(JSON.stringify(evt.target.result)); base64字符串  
				callback(evt.target.result);
			}
		})
	})
	// #endif


	// #ifdef H5
	var img = new Image();
	img.src = path;
	img.onload = function() {
		//默认按比例压缩
		var w = this.width,
			h = this.height;
		var quality = 0.95; // 默认图片质量为0.7

		//生成canvas
		var canvas = document.createElement('canvas');
		var ctx = canvas.getContext('2d');

		// 创建属性节点
		canvas.setAttribute("width", w);
		canvas.setAttribute("height", h);

		ctx.drawImage(this, 0, 0, w, h);
		// quality值越小，所绘制出的图像越模糊
		var base64 = canvas.toDataURL('image/jpeg', quality);
		// 回调函数返回base64的值
		callback(base64);
	};
	// #endif
}

• 这里 区分下  APP 和 H5 就可以了
• 获取到 base64 图片内容之后 上传就可以了； 这个base64 是在文件头的