关于前端:知识付费阿里云视频点播功能

4次阅读

共计 2099 个字符,预计需要花费 6 分钟才能阅读完成。

阿里云视频点播(VOD)是集音视频上传、自动化转码解决、媒体资源管理、散发减速于一体的全链路音视频点播服务。借助灵便、可伸缩的存储、解决及内容散发服务,帮忙企业和开发者疾速搭建平安、弹性、高可定制的点播平台和利用,提供端到端的残缺解决方案。
第一步:装置
在页面上引入上面三个 JS 脚本,见 视频上传 SDK 下载。
<!– IE 须要 es6-promise –>
<script src=”../lib/es6-promise.min.js”></script>
<script src=”../lib/aliyun-oss-sdk6.10.0.min.js”></script>
<script src=”../aliyun-vod-upload-sdk1.5.2.min.js”></script>
第二步:页面 js 上传代码
申请上传地址加凭证
上传地址和凭证形式 (举荐应用)
首先申请获取的上传地址和凭证初始化时无需设置,而是在开始上传开始后触发的 onUploadStarted 回调中调用 setUploadAuthAndAddress(uploadFileInfo, uploadAuth, uploadAddress,videoId); 办法进行设置。当 token 超时,会触发 onUploadTokenExpired 回调,须要调用 resumeUploadWithAuth(uploadAuth)办法,设置新的上传凭证持续上传。
示例代码
var uploader = new AliyunUpload.Vod({
timeout: 60000,
partSize: 1048576,
parallel: 5,
retryCount:3,
retryDuration: 2,
region: cn-shanghai,
userId:‘12232’,
// 增加文件胜利
addFileSuccess: function (uploadInfo) {
},
// 开始上传
onUploadstarted: function (uploadInfo) {
},
// 文件上传胜利
onUploadSucceed: function (uploadInfo) {
},
// 文件上传失败
onUploadFailed: function (uploadInfo, code, message) {
},
// 勾销文件上传
onUploadCanceled: function (uploadInfo, code, message) {
},
// 文件上传进度,单位:字节, 能够在这个函数中拿到上传进度并显示在页面上
onUploadProgress: function (uploadInfo, totalSize, progress) {var progressPercent = Math.ceil(progress * 100)
},
// 上传凭证超时
onUploadTokenExpired: function (uploadInfo) {
},
// 全副文件上传完结
onUploadEnd: function (uploadInfo) {
$(‘#status’).text(‘ 文件上传完毕!’)
console.log(“onUploadEnd: uploaded all the files”)
}
})

第三步:获取视频上传地址和凭证
常识付费根目录 extend/service/VodService.php 中 videoUploadAddressVoucher 办法
次要取得视频上传地址和凭证;
应用 js 来实现上传:
var createUrl = 应用 videoUploadAddressVoucher 办法返回的链接;
$.get(createUrl, function (data) {
var uploadAuth = data.UploadAuth
var uploadAddress = data.UploadAddress
var videoId = data.VideoId
uploader.setUploadAuthAndAddress(uploadInfo, uploadAuth, uploadAddress,videoId)
}, ‘json’)
第四步:保留上传数据
保留上传时生成的 videoId 值,播放时会须要
第五步:播放连贯
咱们应用获取视频播放凭证,来在阿里云播放器播放;
通过 videoId 获取视频点播的长期链接。常识付费根目录 application/wap/controller/Special.php 中的 get_video_playback_credentials 办法应用 videoId 取得长期链接。
阿里云文档连贯:
https://help.aliyun.com/docum…
实例化播放器
new Aliplayer({

id: 'player',
vid: VideoId,
playauth: PlayAuth,
format: 'mp3',
mediaType: 'audio',
encryptType: 1,
autoplay: false

});
常识付费阿里云视频点播就是这样的流程;
如果你感觉这篇文章对你有点用的话,麻烦请给咱们的开源我的项目点点 star: http://github.crmeb.net/u/defu  不胜感激!

正文完
 0