uniapp 小程序开发，实现图片直传阿里云的简单方法

​ 借用uniapp官方的第三方组件uni-file-picker和插件市场的已经封装好的插件yushijie-ossutil就能简单实现，下载链接：阿里云oss文件直传-无需后台签名 - DCloud 插件市场

​编辑

一、在要使用的页面引入

import uploadImage from "../../common/ossutil/uploadFile.js";

在config.js文件去修改成自己的信息

var fileHost = '';//你的阿里云地址最后面跟上一个/   在你当前小程序的后台的uploadFile 合法域名也要配上这个域名
var config = {
   //aliyun OSS config
  uploadImageUrl: `${fileHost}`, // 默认存在根目录，可根据需求改
  AccessKeySecret: '',        // AccessKeySecret 去你的阿里云上控制台上找
  OSSAccessKeyId: '',         // AccessKeyId 去你的阿里云上控制台上找
   timeout: 87600 //这个是上传文件时Policy的失效时间
};
module.exports = config

 二、在uni-file-picker添加select事件（用于选择图片时触发上传图片到阿里云，删除是delete）具体看官方文档

<view class="example-body">
				<uni-file-picker v-model="imageValue" fileMediatype="image" mode="grid" :limit="9" ref="files"
					title="最多选择9张图片" :auto-upload="false" @select="select" @delete="delImg" @progress="progress"
					@success="success" @fail="fail" />
			</view>

//每次点击选择调用阿里云文件上传
async select(e) {
				console.log("选择图片成功", e)
				e.tempFiles.forEach((i) => {
					let file = i.path;
					uploadImage(file, "cbb/",
						result => {
//将上传后的图片以对象（官方要求的格式）的形式存入uni-file-picker的value值imageValue（imageValue值的结构为数组包对象）用于图片回显
							let objAge = {
								'url': result,
								'extname': 'png',
								'name': 'imgss.png'
							};
							this.imageValue.push(objAge)
							uni.hideLoading();
						}, result => {
							uni.showToast()
						})
				});
			},

 这样就能实现图片上传阿里云，视频同理，欢迎大佬指正！

​