Aliplayer视频点播加密播放
Aliplayer视频播放器填坑
aliplayer视频点播分为Flash和HTML5两个版本，移动端不支持Flash播放器。
Flash播放器兼容IE8+，HTML5播发器支持比较新的浏览器，对浏览器的版本要求较Flash播放器对浏览器的版本的要求要高一些。
其中：
h5播放器在移动端不支持flv和rtmp的播放
播放flv、m3u8视频，PC端支持的浏览器，需要启用允许跨域访问
HLS标准加密与MPS私有加密对比
| 加密类型/设备环境 | iOS | Android | PC |
|---|---|---|---|
| 标准加密 HLS | √ | √ |
Chrome Firefox Safari Edge IE 11+for Windows8.1+ |
| 私有加密 MPS | × | Chrome for Android |
Chrome Firefox Safari Edge IE 11+for Windows8.1+ |
Aliplayer播放器Demo
注：Aliplayer在线配置网址
HTML代码：
<!DOCTYPE html>
<html><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" /><title>用户测试用例</title><!-- aliplayer样式表 --><link rel="stylesheet" href="https://g.alicdn.com/de/prismplayer/2.8.2/skins/default/aliplayer-min.css" /><!-- aliplayer Flash版&HTML5版 --><script src="https://g.alicdn.com/de/prismplayer/2.8.2/aliplayer-min.js" type="text/javascript" charset="utf-8"></script><!-- Flash版 --><script src="https://g.alicdn.com/de/prismplayer/2.8.2/aliplayer-flash-min.js" type="text/javascript" charset="utf-8"></script><!-- HTML5版 --><script src="https://g.alicdn.com/de/prismplayer/2.8.2/aliplayer-h5-min.js" type="text/javascript" charset="utf-8"></script></head><body><div class="prism-player" id="J_prismPlayer"></div></body>
</html>JavaScript代码：
var player = new Aliplayer({id: 'J_prismPlayer',width: '100%',autoplay: true,//支持播放地址播放,此播放优先级最高source: '播放url',//播放方式二：点播用户推荐vid: '',playauth: 'ddd',cover: 'logo.png',//播放方式三：仅MPS用户使用（私有加密播放）vid: '',accId: 'dd',accSecret: 'dd',stsToken: 'dd',domainRegion: 'dd',authInfo: 'dd',//播放方式四：使用STS方式播放vid: '',accessKeyId: 'dd',securityToken: 'dd',accessKeySecret: 'dd',region: 'cn-shanghai',
}, function(player) {console.log('播放器创建好了。')
});注：aliplayer属性和接口使用说明
Vue中使用Aliplayer播发器
注：现在index.html中引入aliplayer的css和js，或者在当前vue文件中引入aliplayer的css和js。
<template>...<!-- 引入aliplayer播放器 --><div class="prism-player" id="player-con"></div>...
</template>初始化aliplayer播发器
export default {data() {return {player: {},timer: null};},created() {this.loading = this.$loading({background: "rgba(0, 0, 0, 0.5)",text: "拼命加载中"});},methods: {// 销毁和重建aliplayerchangePlayer(dt) {this.player.dispose();this.initPlayer(dt);},// 获取视频播放信息getKeyInfo(videoId, flag) {this.$axios.post("XXXXXToken",qs.stringify({videoId})).then(res => {let data = res.data;if (data.code == 1) {let dt = data.result_data;// 是否初次创建？初次创建播放器：销毁和重建播发器flag ? this.initPlayer(dt) : this.changePlayer(dt);}});},// 初始化视频播放器initPlayer(data) {// 清空dom节点document.getElementById("player-con").innerHTML = "";// 改变this指向，使其指向当前this指向。let _this = this,token = sessionStorage.getItem("token"),userId = sessionStorage.getItem("userId"),isConfirm = sessionStorage.getItem("isConfirm");this.player = new Aliplayer({id: "player-con", // 播放器idformat: "m3u8", // 视频格式width: "100%",height: "450px",playsinline: true,preload: true,encryptType: 1,// HLS标准加密为0（默认）,MPS私有视频加密为1controlBarVisibility: "always",useH5Prism: true,// 视频底部状态工具栏设置，默认为false，全显示skinLayout: [{name: "bigPlayButton",align: "blabs",x: 30,y: 80},{name: "H5Loading",align: "cc"},{name: "errorDisplay",align: "tlabs",x: 0,y: 0},{name: "infoDisplay"},{name: "tooltip",align: "blabs",x: 0,y: 56},{name: "thumbnail"},{name: "controlBar",align: "blabs",x: 0,y: 0,children: [{name: "progress",align: "blabs",x: 0,y: 44},{name: "playButton",align: "tl",x: 15,y: 12},{name: "timeDisplay",align: "tl",x: 10,y: 7},{name: "fullScreenButton",align: "tr",x: 10,y: 12},{name: "volume",align: "tr",x: 5,y: 10}]}],// MPSvid: 'vid',accId: 'accId',accSecret: 'accSecret',stsToken: 'stsToken',domainRegion: "cn-beijing",authInfo: '{"ExpireTime": "' +expireTime +'","MediaId": "' +videoId +'","Signature": "' +signature +'"}'},function(player) {// html5版本的视频事件写在当前callback中player.play();// 定时器let clear = () => {if (_this.timer) {clearTimeout(_this.timer);_this.timer = null;}};// 获取播放时间let getTimes = () => {if (player.getCurrentTime() >= 60) {if (isConfirm == 0) {player.pause();player.fullscreenService.cancelFullScreen();}}// 递归回调，计算播放时间_this.timer = setTimeout(getTimes, 1000);};player.on("ready", function(e) {// 首次播放clear();getTimes();player.on("play", function(e) {// 播放视频clear();getTimes();});player.on("pause", function(e) {// 暂停视频播放clear();});player.on("ended", function(e) {// 视频播放结束clear();});player.on("error", function(e) {// 视频播放失败clear();});});});},// 切换视频播放源：使用函数截流，防止多次触发影响数据展示switchVideo: Debounce(function(index, videoId, isPerchase) {this.mark = index;this.getKeyInfo(videoId);this.isPerchase = isPerchase == undefined ? true : isPerchase;}, 500)},// 生命周期钩子函数：销毁destroyed() {// 清除定时器clearInterval(this.timer);this.timer = null;let play = this.player,len = Object.keys(play);if (!len) return;// 销毁播放器play.dispose();}
};注：播放器中隐藏了画中画、画质切换、视频下载等功能。
同时需要注意的是，aliplayerH5视频点播 在iOS移动端是不支持的，苹果移动端不支持aliplayer的私有加密播放方式！
转载于:https://www.cnblogs.com/zxk5211/p/web_18.html
Aliplayer视频点播加密播放相关推荐
- 防抖音、B站视频点播，加密播放收费视频，防盗链项目介绍
仿抖音.防B站视频点播,h5,小程序,app 加密播放收费视频.防盗链目前支持h5,小程序.app需要额外费用(暂时未实现) 一.首页 轮播图.每行两个视频样式.每行三个视频样式,每行一个视频样式 每 ...
- 移动端应用视频小程序加密播放(存档)
(转载文档备用 2018-12-11) 1.概述 移动端视频的小程序加密播放设置开启后,通过下文设置步骤,视频播放请求m3u8可以在APP.小程序内正常播放. POLYV云平台接收到参数后会 ...
- VideoJS+HLS视频加密播放
前言 前段时间遇到一个播放视频的项目,为了防止登录的用户下载项目的视频,所以需要对视频加密,即使用户下载也不能播放:因为前端采用videojs,最后确认方案是将mp4转m3u8文件格式,来实现视频文件 ...
- 视频加密播放 blob java
1.安装openssl服务,生成加密使用的key openssl rand 16 > enc.key 2.生成加密串,将结果记录下来 openssl rand -hex 16 4.新建一个enc ...
- 记一次视频加密播放以及适配问题
最近公司要做一个卖视频的产品,既然是卖视频,那视频当然得加个密,不让别人随便下载咯.而且是课程类的视频,一个视频长度都在一个小时左右,那就也得考虑流量问题. 如果是使用普通的mp4视频格式,既容易被下 ...
- 在线视频加密播放与防下载该如何考虑？
在线视频加密播放与防下载该如何考虑? ▲ 图 / 防录屏随机水印 1. 视频加密(分片加密)VRM加密: 将视频进行切片.对碎片逐一进行混淆式加密,包括AES128加密.XOR加密.关键帧错序等. 2 ...
- 解析腾讯视频加密播放
引入: <script src="http://qzs.qq.com/tencentvideo_v1/js/tvp/tvp.player.js" charset=" ...
- 加密播放器显示“DRMsoft.cn未注册”
百度看到有一个方法是: 断网,删除C盘的DRMsoft文件夹,然后打开播放器,在输入一遍密码. 我试了之后不行,可以向我这样在电脑设置播放器断网,一劳永逸. 1,打开控制面板–>打开Window ...
- 关于录制短视频点播不能播放问题的总结
现象描述: 直播正常,截取的短视频可以正常播放,分享给他人不能播放. 排查过程: H5分享页面200. api服务器录制短视频时日志正常,分享给他人点播后无日志. 直播服务器/点播服务器 被分享短视频 ...
- 阿里云视频点播加密视频播放报：网络错误加载数据失败(fragLoadError)
问题描述: 1.首先视频id正确 2.视频播放凭证生成正确(未失效) 3.但是网页点播出现错误如下图 解决方案: 阿里云存储权限问题! 设为公共问题解决,可点播加密视频!
最新文章
- 虚拟专题：知识图谱 | 其他文章
- 便携本市场一片混乱 东芝也加入战斗
- 聊聊自己的高效学习方法~
- 实现图片大小的自动控制（ 图片大小控制CSS代码）
- 基于词典的情感分析实验
- UML建模：基于智慧校园的二手交易平台
- BI数据分析师入门项目
- 目标检测：YOLOV2
- spring MVC3 集成 freemarker
- 科幻作品中强大的计算机和人工智能有哪些？
- 简单 Python 快乐之旅之：Python 基础语法之 JSON 专题
- 君子不和牛置气，混蛋让它混到底-- 骂 老板 6
- python的实验报告大一心理_python的期末实验报告
- nginx 配置优化的几个参数
- 一.JavaWeb学习路线
- 证明一个数能被3整除，当且仅当它的各位数的和能被3整除！
- SQL Server 判断时间是一年的第几周、星期几
- 碳排放的计算有多个版本
- hdu1404 博弈
- rados tools