更新记录
1.1.0(2026-08-21) 下载此版本
上传
平台兼容性
uni-app(5.24)
| Vue2 | Vue3 | Chrome | Safari | app-vue | app-nvue | Android | iOS | 鸿蒙 |
|---|---|---|---|---|---|---|---|---|
| - | √ | - | - | - | - | - | - | - |
| 微信小程序 | 支付宝小程序 | 抖音小程序 | 百度小程序 | 快手小程序 | 京东小程序 | 鸿蒙元服务 | QQ小程序 | 飞书小程序 | 小红书小程序 | 快应用-华为 | 快应用-联盟 |
|---|---|---|---|---|---|---|---|---|---|---|---|
| √ | - | - | - | - | - | - | - | - | - | - | - |
uni-app x(5.24)
| Chrome | Safari | Android | iOS | 鸿蒙 | 微信小程序 |
|---|---|---|---|---|---|
| - | - | - | - | - | - |
wc-upload
阿里云 OSS 直传封装,基于 wc-request(/core/mobile/system/aliyun/ossAuth)。
文件不经业务 server 中转(PostObject 表单直传),支持图片/视频/任意文件、多选、进度回调。
安装前置
wc-request≥ 2.2.0、已setupWcAuth()(ossAuth 需登录态)- server 侧已配置 OSS 密钥(
WON_ALIYUN_OSS_KEY/SECRET等)
使用
一站式:选 + 传(最常用)
import {
chooseAndUploadImage,
chooseAndUploadVideo,
} from '@/uni_modules/wc-upload/commons'
// 选 1 张图并上传(默认不传 subDir,跟随 server 配置目录)
const img = await chooseAndUploadImage(1)
console.log(img?.url) // 公网地址
// 多选并发上传
const imgs = await chooseAndUploadImage(9)
// 选视频并上传(自动走视频存储目录)
const video = await chooseAndUploadVideo()
console.log(video.url, video.size)
通用:任意文件直传
import { uploadFileToOss } from '@/uni_modules/wc-upload/commons'
// 已有本地路径(chooseFile / chooseMessageFile / 录音等场景)
const result = await uploadFileToOss('/tmp/xxx.pdf', {
mediaType: 'document',
fileName: '合同_2026', // 自定义文件名(可不带后缀)
})
// result: { url, objectName, fileName, fileType, mime_type, size }
仅拿凭证(自己控制上传时)
import { getOssAuth } from '@/uni_modules/wc-upload/commons'
const auth = await getOssAuth({ media_type: 'video' })
// auth: { accessid, host, policy, signature, expire, dir, ossHost }
存储目录规则(与 server 约定)
最终 OSS 目录由 server 拼接,前端只需要决定"传不传 subDir":
目录 = [server 配置前缀] + [subDir(前端按需传)] + /年/月/
↑ .env 的 DIR_PREFIX ↑ 不传就没有这一段
| 场景 | 建议 |
|---|---|
| 一般业务(默认) | 不传 subDir,文件落在 server 配置的目录下,目录规则全由 server 统一管理 |
| 按用户隔离 | subDir: 'avatar/' + userId —— 用户注销删文件、按用户清理时不可替代 |
| 独立生命周期/CDN 策略 | 需要对该类文件单独设 OSS 规则时,给一个独立 subDir 便于运维按前缀操作 |
subDir 是 server 侧定义的参数(
GET /ossAuth?sub_dir=...),支持多级(order/123)。 不要用它做"看起来整洁"的目录——除非有上面的运维/隔离需求,否则跟随 server 默认。
何时需要进度
await chooseAndUploadVideo({
: (p) => console.log(`${p}%`), // 0-100;多图时每张各自回调
})
行为约定
| 项 | 说明 |
|---|---|
| 上传方式 | OSS PostObject 表单直传(policy 签名,5 分钟有效,≤4GB) |
| 存储目录 | media_type=video 走视频前缀,其余走图片前缀;再拼 subDir + /年/月/ |
| 文件名 | 默认 {prefix}_{timestamp}_{random},可 fileName 覆盖(多选时禁用自定义名) |
| 进度 | onProgress(progress, event),0-100 |
| 用户取消选图 | 返回空数组(不报错);取消选视频 reject('cancel'),调用方判 message 静默 |
| 凭证获取失败 | wc-request 统一处理(toast + token 自动刷新重试) |
返回结构
interface UploadResult {
url: string // 公网访问地址
objectName: string // OSS key,如 wc-tech/demo/2026/08/xxx.jpg
fileName: string // 文件名(不含目录)
fileType: string // 后缀,如 jpg / mp4
mime_type: string // MIME(可能为空)
size: number // 字节(可能为 0)
}
范围说明
刻意不包含(保持简单):
- 分片上传 / 断点续传(server 有 ChunkUploadService,需要时另封装)
- 上传后回写业务库(各业务自己存 UploadResult.url)
- 内容安全检测(server 有 security 系列接口,需要时另封装)

收藏人数:
下载插件并导入HBuilderX
下载插件ZIP
赞赏(0)
下载 3
赞赏 0
下载 12524331
赞赏 1943
赞赏
京公网安备:11010802035340号