请问用VOD-视频点播时,小程序使用上传地址和凭证上传视频后怎么在页面回显?
在小程序中上传视频到阿里云VOD-视频点播后,可以通过获取视频ID并使用阿里云VOD-视频点播提供的播放器组件在页面上回显视频。
具体步骤如下:
1、在小程序中使用阿里云VOD-视频点播提供的上传组件将视频上传到指定的上传地址,并获取上传凭证。
2、在上传成功后,通过调用阿里云VOD-视频点播的API获取上传完成后的视频ID。
3、使用阿里云VOD-视频点播提供的播放器组件,在页面上引入播放器,并设置视频ID作为播放器的参数。
以下是示例代码:
<!--在wxml中引入播放器组件-->
<view class="player">
<video id="player" vod="{{true}}" objectFit="contain"></video>
</view>
Page({
// 获取视频ID并设置为播放器的参数
getVideoInfo: function(uploadAddress, uploadAuth) {
wx.request({
url: 'https://vod.cn-shanghai.aliyuncs.com',
method: 'POST',
data: {
Action: 'CreateUploadVideo',
UploadAddress: uploadAddress,
UploadAuth: uploadAuth
},
success: res => {
const videoId = res.data.VideoId;
// 将视频ID设置为播放器的参数
this.setData({
videoId: videoId
});
}
});
},
onReady: function() {
// 获取上传地址和凭证
const uploadAddress = 'your upload address';
const uploadAuth = 'your upload auth';
// 调用获取视频ID的函数
this.getVideoInfo(uploadAddress, uploadAuth);
// 设置播放器的参数
this.setData({
playerOptions: {
vid: this.data.videoId,
playauth: uploadAuth,
width: '100%',
height: '100%',
autoplay: true
}
});
}
});
使用阿里云VOD-视频点播的播放器组件需要在页面的onReady生命周期中进行设置。同时,需要将视频ID作为播放器的参数传入,以便播放器能够正确地播放对应的视频。
版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。