uniapp上传图片文件到阿里云OSS经验总结

1.配置Bucket跨域(一般是后端干，嘿嘿)

了解一下后端的 配置流程

服务器端做签名，前端携带签名直接将图片等资源上传OSS
优点：安全、高效、优雅、与现有服务器不冲突无影响，业务无限发展也毫不担心OSS性能问题。
核心3步骤：
1、开通阿里云OSS服务 做好相关配置 拿到相关签名数据
2、后台服务端创建签名接口
3、前端选择图片、获取签名、上传OSS

但小程序端，前端需要配置上传域名白名单《小程序配置域名白名单》

2.实践方案Demo进行上传测试

• 下载应用服务器代码
• 将文件解压，并打开upload.js文件
• 修改upload.js中的配置信息。
• accessId ： 设置你的AccessKeyId。
• accessKey ： 设置你的AessKeySecret。
• host：格式为bucketname.endpoint，例如bucket-name.oss-cn-hangzhou.aliyuncs.com。关于Endpoint的介绍，请参见Endpoint访问域名。
• expiration：设置Policy的失效时间，如果超过失效时间，就无法通过此Policy上传文件

3.进行上传测试

4.获取上传需要的签名（signature）和加密策略（policy）

5.使用uniapp上传文件

uni.chooseImage({
				count: 1, //默认9
				sizeType: ['compressed'],
				sourceType: ['album'],
				success: res => {
					let tiemr = new Date();
					let address = tiemr.getFullYear() + '' + (tiemr.getMonth() + 1) + '' + tiemr.getDate();
					address = 'zskp/userHead/' + address + '/';
					var imageSrc = res.tempFilePaths[0];
					let str = res.tempFilePaths[0].substr(res.tempFilePaths[0].lastIndexOf('.'));
					let nameStr = address + tiemr.getTime() + str;
					let ossUrl = 'http://xxx.xxxxxxxxxxxxxxxxxxxxxx.xxx/';
					uni.uploadFile({
						url: ossUrl,//输入你的bucketname.endpoint
						filePath: imageSrc,
						fileType: 'image',
						name: 'file',
						formData: {
							name: nameStr,
							key: nameStr,
							policy: 'xxxxxxxxxxxxxxxxxxxxxxxxxxx', // 输入你获取的的policy
							OSSAccessKeyId: 'xxxxxxxxxxxxxxxxxxxxxxxxxxx', // 输入你的AccessKeyId
							success_action_status: '200', // 让服务端返回200,不然，默认会返回204
							signature: 'xxxxxxxxxxxxxxxxxxxxxxxxxxx' // 输入你获取的的signature
						},
						success: res => {
							if(res.statusCode == '200'){
								consonle.log(ossUrl + nameStr);
							}else{
								consonle.log(res);
							}
						}
					});
				}
			});

上传成功的状态码为200时，则上传成功，如果未成功，请检查对应bucket是否设置跨域，已及AccessKeyId和签名（signature）和加密策略（policy）是否填写正确。