oss上传封装及使用例子

config/api.js

@@ -37,7 +37,7 @@ var api = {
 	 * @param function catchFun catch回调	
 	 */
 	
-	ossUpload:function(fileBaseUrl,scene,data,thenFun,catchFun){
+	ossUpload:function(fileBaseUrl,scene,data,ossthenFun,osscatchFun){
 		//从http://tmp/IX45zGr8kI1Tb1fd2c2b3045e9bfce734869d2024805.png 中
 		//提取 IX45zGr8kI1Tb1fd2c2b3045e9bfce734869d2024805.png 文件名
 		var fileNameArr = fileBaseUrl.split('//tmp/');
@@ -56,16 +56,22 @@ var api = {
 			console.log('签名成功',res);
 			var ossConfig = res;
 			data.ossConfig = ossConfig;
-			api.upload(ossConfig.host,data,function(rs){
+			 api.upload(ossConfig.host,data,function(rs){
+				
+				var file_url = ossConfig.dir ? ossConfig.dir + (fileName ? '/' + fileName : '') : ossConfig.key;
+				file_url = `/${file_url}`;
+				//console.log(file_url);
+				rs.data.file_url = file_url;
 				console.log('上传成功',rs);
-				if(thenFun) thenFun(rs);
+				if(ossthenFun) ossthenFun(rs);
 			},function(er){
 				console.log('上传失败',er);
-				if(catchFun) catchFun(er);
-			});
+				if(osscatchFun) osscatchFun(er);
+			}); 
+		
 		},function(err){
 			console.log('签名失败',err);
-			if(catchFun) catchFun(err);
+			if(osscatchFun) osscatchFun(err);
 		});
 	},
 	
@@ -133,14 +139,18 @@ var api = {
 	upload:function(urlName, data, thenFun,catchFun){
 		var newData = data;
 		var formData = {};
+		console.log('判断是否存在',data.hasOwnProperty('ossConfig'))
 		if(data.hasOwnProperty('ossConfig'))
 		{
+			var ossConfig = data.ossConfig;
+			var fileNameOss = ossConfig.fileName;
+			var key = ossConfig.dir ? ossConfig.dir + (fileNameOss ? '/' + fileNameOss : '') : ossConfig.key;
 			var newFormData ={
-				key: data.ossConfig.key,
-				OSSAccessKeyId: data.ossConfig.accessId,
-				policy: data.ossConfig.policy, // 输入你获取的的policy
+				key: key,
+				OSSAccessKeyId: ossConfig.accessId,
+				policy: ossConfig.policy, // 输入你获取的的policy
 				success_action_status: '200', // 让服务端返回200,不然，默认会返回204
-				signature: data.ossConfig.signature, // 输入你获取的的signature
+				signature: ossConfig.signature, // 输入你获取的的signature
 			};
 			formData = newFormData;
 		}
@@ -153,7 +163,7 @@ var api = {
 		filePath: newData.filePath, // 要上传文件资源的路径。
 		// 注：如果局部custom与全局custom有同名属性，则后面的属性会覆盖前面的属性，相当于Object.assign(全局，局部)
 		custom: {auth:true,toast:true,}, // 可以加一些自定义参数，在拦截器等地方使用。比如这里我加了一个auth，可在拦截器里拿到，如果true就传token
-		name: 'files', // 文件对应的 key , 开发者在服务器端通过这个 key 可以获取到文件二进制内容
+		name: 'file', // 文件对应的 key , 开发者在服务器端通过这个 key 可以获取到文件二进制内容
 		// #ifdef H5 || APP-PLUS
 		timeout: 60000, // H5(HBuilderX 2.9.9+)、APP(HBuilderX 2.9.9+)
 		// #endif
@@ -163,6 +173,7 @@ var api = {
 		formData: formData, // HTTP 请求中其他额外的 form data
 		// 返回当前请求的task, options。请勿在此处修改options。非必填
 		getTask: (task, options) => {
+			console.log(options);
 		  task.onProgressUpdate((res) => {
 			console.log('上传进度' + res.progress);
 			console.log('已经上传的数据长度' + res.totalBytesSent);
@@ -170,8 +181,11 @@ var api = {
 		  });
 		},
     }).then(res => {
+		
+		console.log('upload then success !!!',res);
 				 if(thenFun) thenFun(res);
 		}).catch((rs) =>{
+			console.log('upload catch err !!!',rs);
 					if(catchFun) catchFun(rs);
 				});
 	},
@@ -259,5 +273,13 @@ var api = {
 	env:function(){
 		return ENV.EnvShow;
 	},
+	/**
+	 * oss 地址
+	 * 
+	 */
+	ossurl(url){
+		const app_config = uni.getStorageSync('app_config');
+		return app_config.public_url + url;
+	},
 }
 module.exports = api;

config/com.js

@@ -261,7 +261,7 @@ var com = {
 	    }
 	    return item
 	  })
-	}
+	},
 
 }
 

config/request.js

@@ -63,8 +63,17 @@ module.exports = (vm) => {
 	
 	// 响应拦截
 	uni.$u.http.interceptors.response.use((response) => { /* 对响应成功做点什么 可使用async await 做异步操作*/
+		console.log('请求返回',response);
+		//这里只针对阿里云oss上传没有返回值的时候做个处理
+		if(response.header.Server == "AliyunOSS" && response.errMsg == "uploadFile:ok" && uni.$u.test.isEmpty(response.data))
+		{
+			return {
+				code:200,
+				msg:"上传OSS成功",
+				data:{},
+			};
+		}
 		const data = response.data
-		//console.log('请求返回',data);
 		// 自定义参数
 		const custom = response.config?.custom
 		if (data.code !== 200) { 

config/user.js

@@ -67,22 +67,7 @@ var user = {
 			return res;
 		}
 	},
-
-	getUserInfo: function() {
-		var res = uni.getStorageSync('token');
-		if (typeof(res) == 'undefined' || res == '') {
-			return false;
-		} else {
-			var userInfo = {};
-			userInfo.nickName = uni.getStorageSync('nickName');
-			userInfo.phone = uni.getStorageSync('phone');
-			userInfo.userId = uni.getStorageSync('userId');
-			userInfo.token = uni.getStorageSync('token');
-			userInfo.avatar = uni.getStorageSync('avatar');
-			userInfo.realName = uni.getStorageSync('realName');
-			return userInfo;
-		}
-	}
+	
 }
 
 module.exports = user

pages/user/account/index.vue

@@ -170,6 +170,9 @@
 					var upData = {filePath:edetail,fileType:'image'};
 					_this.$api.ossUpload(edetail,'user_small',upData,function(res){
 						console.log('ossUpload success',res);
+						var d = res.data;
+						_this.info.avatar = d.file_url;
+						_this.uploadImg = [{url:_this.$api.ossurl(d.file_url)}];;
 					},function(err){
 						console.log('ossUpload fail',err);
 					});