在使用微信小程序上传SDK上传媒体之前,需要先集成相关SDK。本文提供集成及文件上传指引。
上传文件
微信小程序上传文件的基本操作步骤如下:
引入JavaScript脚本。
JavaScript脚本下载,请参见上传SDK。
import VODUpload from 'aliyun-upload-sdk-1.0.3.min.js'
请求上传地址和凭证或请求STS临时Token,用于上传授权。
微信小程序上传,支持以下两种上传授权方式:
- 部署授权服务获取上传地址和凭证的操作指引请参见获取上传地址和凭证。
- 部署STS服务获取STS临时Token的操作指引请参见获取STS临时Token。
执行结果
使用获取到的上传地址和凭证或STS临时Token作为入参初始化上传实例。
使用上传凭证或STS临时Token初始化上传实例。
初始化上传实例分为声明初始化回调和初始化上传实例两步。
声明
VODUpload
初始化回调。初始化上传实例。请根据业务需求选择用上传地址和凭证方式或STS方式初始化上传实例。
(推荐)上传地址和凭证方式
在上传开始后触发的
onUploadStarted
回调中调用setUploadAuthAndAddress(uploadFileInfo, uploadAuth, uploadAddress,videoId);
方法进行设置。说明当Token超时,会触发
onUploadTokenExpired
回调,需要调用resumeUploadWithAuth(uploadAuth)
方法,设置新的上传凭证继续上传。STS方式
在上传开始后触发的
onUploadStarted
回调中调用setSTSToken(uploadInfo, accessKeyId, accessKeySecret, secretToken);
方法进行设置。说明当STS临时Token失效时,会触发
onUploadTokenExpired
回调,需要调用resumeUploadWithSTSToken(accessKeyId, accessKeySecret, secretToken);
方法,设置新的STS继续上传。
根据上传的文件类型(音视频、图片)构造上传参数。
音视频文件参数
构造添加音视频文件到上传列表的上传请求函数。
wx.chooseVideo({ success: function (res) { var file = {url: res.tempFilePath, coverUrl: res.thumbTempFilePath}; var userData = '{"Vod":{}}'; uploader.addFile(file, null, null, null, userData) } })
上传时,可以通过
paramData
设置自定义音视频信息。paramData
是一个JSON对象字符串,第一级的Vod
必须设置。请在Vod
下面添加paramData
支持的属性。属性支持情况详细信息请参见获取音视频上传地址和凭证。示例如下:var userData = '{"Vod":{"Title":"test","CateId":"234"}}';
图片文件参数
构造添加图片文件到上传列表的上传请求参数。
wx.chooseImage({ success: function (res) { var file = {url: res.tempFilePath, coverUrl: res.thumbTempFilePath}; var userData = '{"Vod":{}}'; uploader.addFile(file, null, null, null, userData) } })
开始上传。
调用
startUpload()
方法开始上传。uploader.startUpload();
文件开始上传后,
onUploadProgress
回调开始同步上传进度。文件上传成功后,
onUploadSucceed
回调会返回上传结果。
执行结果
队列管理
删除上传文件
index对应listFiles接口返回列表中元素的索引。
uploader.deleteFile(index);
取消单个文件上传
uploader.cancelFile(index);
说明该方法只对当前正在上传或等待上传的文件生效。
恢复单个文件上传
uploader.resumeFile(index);
获取上传文件列表
uploader.listFiles();
清理上传文件列表
uploader.cleanList();
上传凭证
上传凭证失效后恢复上传
uploader.resumeUploadWithAuth(uploadAuth);
设置上传地址和上传凭证
设置上传地址和上传凭证方法在
onUploadstarted
回调里调用,此回调的参数包含uploadInfo
的值。uploader.setUploadAuthAndAddress(uploadInfo,uploadAuth, uploadAddress, videoId);
设置STS Token
设置STS Token的方法在
onUploadstarted
回调里调用,此回调的参数包含uploadInfo
的值。uploader.setSTSToken(uploadInfo, accessKeyId, accessKeySecret,secretToken);
上传STS Token失效后恢复上传
uploader.resumeUploadWithSTSToken(accessKeyId, accessKeySecret, secretToken, expireTime);