最近项目在搞视频播放,使用的是腾讯云点播,这里做一个使用总结~
背景
项目中涉及到上传视频,播放视频,以及视频安全等,云点播这几个功能都有,接入起来也是比较顺滑~
上传视频
项目第一步,当然是要上传视频啦~
这里使用的是js的sdk,详情查看 Web 端上传 SDK
使用的方法比较简单,下面是示例代码:
// 引入js sdk
<script src="//unpkg.com/vod-js-sdk-v6"></script>
// 获取签名,这里的签名需要在后端计算,因为涉及账号安全信息
function getSignature() {
return axios.post(url).then(function (response) {
return response.data.signature;
})
};
// 初始化
const tcVod = new TcVod.default({
getSignature: getSignature // 前文中所述的获取上传签名的函数
})
// 上传视频
const uploader = tcVod.upload({
videoFile: videoFile, // 视频,类型为 File
})
// 查看上传进度
uploader.on('video_progress', function(info) {
console.log(info.percent) // 进度
})
// 上传完成回调
uploader.done().then(function (doneResult) {
// deal with doneResult
})
getSignature用于获取上传签名,楼主的项目后台使用的是node,所以提供一下node的版本。详情可查看 客户端上传签名
const querystring = require('querystring');
const crypto = require('crypto');
router.get('/getSignature', function(req, res, next) {
// 确定 app 的云 API 密钥
let secret_id = SecretId;
let secret_key = SecretKey;
// 确定签名的当前时间和失效时间
let current = parseInt((new Date()).getTime() / 1000, 10);
let expired = current + 86400; // 签名有效期:1天
// 向参数列表填入参数,QCVB_DrmProcessFile为加密转码模板,
let arg_list = {
secretId: secret_id,
currentTimeStamp: current,
expireTime: expired,
random: Math.round(Math.random() * Math.pow(2, 32)),
// procedure为配置任务,视频上传完成后,点播后台就会执行相应的操作
// 这里设置了视频转码 以及 加密操作
procedure: 'QCVB_SimpleProcessFile({20,30,40}, 0, 10, 10)'
};
// 计算签名
let orignal = querystring.stringify(arg_list);
let orignal_buffer = new Buffer(orignal, 'utf8');
let hmac = crypto.createHmac('sha1', secret_key);
let hmac_buffer = hmac.update(orignal_buffer).digest();
let signature = Buffer.concat([hmac_buffer, orignal_buffer]).toString('base64');
let response = {
ret: 0,
data: {
signature: signature
}
};
return res.send(response);
});
播放视频
视频上传完成之后,我们就可以播放视频了~
播放视频我们使用的是 点播超级播放器 ,是点播专属的播放器,直接配置fileID & fileId即可播放点播的视频。
使用方式也是相当简单
// 引入播放器
<link href="//imgcache.qq.com/open/qcloud/video/tcplayer/tcplayer.css" rel="stylesheet">
<script src="//imgcache.qq.com/open/qcloud/video/tcplayer/lib/hls.min.0.8.8.js"></script>
<script src="//imgcache.qq.com/open/qcloud/video/tcplayer/tcplayer.min.js"></script>
// 播放器容器
<video id="player-container-id" width="414" height="270" preload="auto" playsinline webkit-playsinline>
</video>
// 初始化播放器
var player = TCPlayer('player-container-id', {
fileID: fileID,
appID: appID
});
视频处理
在上传签名的时候,我们做了预设的处理,procedure参数
转码
用户上传的视频格式千差万别,对视频进行转码,将视频转为统一的格式,这种在播放的时候就可以避免因视频格式的问题导致不能播放。
加密转码
加密转码与转码的不同之处在于,视频格式经过加密处理,播放过程需要进行解密才能播放,这里可以很好的做到视频安全~
不过,点播这里提供的加密只针对hls封装格式的视频,所以转码的配置也要做hls转码,其他的就没有效果哦。
masterplaylist
用户网络有快有慢,hls的masterplaylist可以有效解决因网络带来的播放问题。
hls添加了masterplaylist之后,在播放过程中,可以根据网络的快慢,自动切换视频清晰度,带来更好的用户体验。
视频安全
referer防盗链
referer防盗链,根据网站referer进行限制,开启白名单referer进行防盗处理。
key防盗链
key防盗链,通过在控制台配置&开启key防盗链,用户播放视频时需要传key签名进行校验,校验失败则拒绝返回视频,达到防盗效果。
key防盗链相对于referer防盗链更加安全,毕竟referer可以伪造。
下面提供的是node的实现:
const crypto = require('crypto');
router.get('/getKeySign', function(req, res, next) {
// 确定签名的当前时间和失效时间
let current = parseInt((new Date()).getTime() / 1000, 10);
let expired = current + 86400; // 签名有效期:1天
// 向参数列表填入参数
let arg_list = {
KEY: config.video.key,
appId: req.query.appId,
fileId: req.query.fileId,
t: expired.toString(16),
us: Math.round(Math.random() * Math.pow(2, 32)).toString()
};
// 计算签名
let orignal = '';
for (let item in arg_list) {
orignal += arg_list[item];
}
let md5 = crypto.createHash('md5');
let md5_buffer = md5.update(orignal).digest('hex');
let signature = md5_buffer.toString('base64');
let response = {
ret: 0,
data: {
t: arg_list.t,
us: arg_list.us,
sign: signature
}
};
return res.send(response);
});
hls视频加密
hls视频加密,视频加密针对的防盗用户其实是有权限查看视频的客户,如果没有对视频内容进行加密,用户只要获取到我们的视频,其实就可以将视频下载到本地进行播放,而hls视频加密,就是针对这种场景。就算用户拿到了视频数据,也不能轻易破解播放,那么,加密的目的就达到了~
这块相对来说比较复杂,详细可查看 视频加密
我们先来看几个标识
- 密钥管理服务(Key Management Service,简称KMS)这块点播服务提供了EMS服务
- 数据密钥(Data Key,简称DK)
- 加密后的数据密钥(Encrypted Data Key,简称EDK)
那么,我们要做的处理其实是比较简单的
- 后台向点播后台请求获取EDK与DK的对应关系,并且存储起来
- 搭建鉴权与秘钥派发服务,这里我们需要提供一个接口,将EDK转化为DK,当然,这里的接口还可以做鉴权处理,可以更加安全。
- 上传视频时,将2中提供的接口配置在点播后台作为一个加密模板
- 加密视频时,2中提供的接口会打包到视频数据中
- 播放视频时,视频会先请求打包到视频中的获取秘钥接口(即2中提供的接口)
- 接口返回正确的DK时,视频才能正常播放
整体上传、加密转码、播放加密视频的流程如下:
写在最后
前段时间做了比较多的视频处理,所以总结了一下,加深自己的理解,同时也希望对用到的人有所帮助~