大快人心网

uniapp 将二进制流 图片文件 直传 到 阿里云OSS云存储

uniapp 将二进制流 图片文件 直传 到 阿里云OSS云存储

关于阿里云OSS的将进文章可以看OSS来存储文件 和 自己搭建文件服务器_tengyuxin的博客-CSDN博客_oss本地搭建

前端上传的逻辑思路:

1. 根据html5+的 封装的API ,根据图片本地路径,制流直传将图片转成base64数据

2. 通过uniapp的图片API。将 base64数据转成 ArrayBuffer 二进制数据,文件就可以上传了

1. 具体代码如下

解释一下参数:
(1)imgFile是存储图片本地路径
(2)uploadUrl 是OSS临时上传的STS凭证
(3)type 是上传图片的类型,如 png ,将进jpg ,制流直传JPEG 等

//1. 直接将二进制流图片直传到OSS	const directOss = (imgFile,图片uploadUrl,type)=>{ 		let fileReader = new plus.io.FileReader();		fileReader.readAsDataURL(imgFile);		fileReader.onloadend = function(evt) { 			//得到base64的字符串			let base64Str = evt.target.result;			//去掉base64的前缀data:image/jpeg;base64,			let tempStr = base64Str.replace(/^data:image\/\w+;base64,/, '');			//获取二进制流			let fileBinary = uni.base64ToArrayBuffer(tempStr);			uni.request({ 				url: uploadUrl,				data: fileBinary,				method: 'PUT',				header: { 					"Content-Type": type,				},				success: (res) =>{ 					// console.log(res);				},			});		}	};

 

未经允许不得转载:大快人心网 » uniapp 将二进制流 图片文件 直传 到 阿里云OSS云存储