用aliplayer如何实现视频的连续播放？

摘要：场景假如有多个视频，在上一个视频播放完毕时，自动播放下一个视频，要怎么处理的呢？需要按使用的播放器类型和切换的地址格式，采用不同的实现方式。直播地址方式这种方式最简单，h5和flash的行为都是一致的，只需要订阅’ended’，在ended事件里，调用loadByUrl方法，参数为下一个视频的地址。

场景

假如有多个视频，在上一个视频播放完毕时，自动播放下一个视频，要怎么处理的呢？需要按使用的播放器类型和切换的地址格式，采用不同的实现方式。

直播地址方式

这种方式最简单，h5和flash的行为都是一致的，只需要订阅’ended’，在ended事件里，调用loadByUrl方法，参数为下一个视频的地址。

function endedHandle()
{var newUrl = "";player.loadByUrl(newUrl);
}player.on("ended", endedHandle);

vid+playauth Saas播放方式

vid和playauth Saas播放方式，h5和flash需要不同的处理方式:

h5在ended事件里调用replayByVidAndPlayAuth方法，参数为vid和新的playauth值。
flash没有提供切换vid和playauth的方法，需要销毁，重新创建播放器。
注意：playauth的有效期只有100s，调用replayByVidAndPlayAuth方法时，需要重新生产获取playauth

H5 Player

function endedHandle()
{var newPlayAuth = ""; player.replayByVidAndPlayAuth(vid,newPlayAuth);
}player.on("ended", endedHandle);

Flash Player

function endedHandle()
{var newPlayAuth = ""; player.dispose(); //销毁$('#J_prismPlayer').empty();//id为html里指定的播放器的容器id//重新创建player = new Aliplayer({id: 'J_prismPlayer',autoplay: true,playsinline:true,vid: vid,playauth:newPlayAuth,useFlashPrism:true});}
}player.on("ended", endedHandle);

地址协议不一样切换地处理

如果原来播放的是mp4的视频，现在新的地址是hls的视频地址，这种情况只能重新创建播放器。

function endedHandle()
{var newUrl = ""; //新的播放地址player.dispose(); //销毁$('#J_prismPlayer').empty(); //id为html里指定的播放器的容器id//重新创建player = new Aliplayer({id: 'J_prismPlayer',autoplay: true,playsinline:true,source:newUrl});}
}player.on("ended", endedHandle);

作者：樰篱

用aliplayer如何实现视频的连续播放？相关推荐

网页嵌入快播播放器并实现服务器视频文件连续播放
上篇我们在网页中(html.jsp.php)嵌入了快播播放器,嵌入代码如下: <object classid="clsid:F3D0D36F-23F8-4682-A195-74C92B ...
android-连续播放多个视频,VideoView实现视频无缝连续播放
该视频播放器采用了较为简单的videoview,基本思想就是用setOnCompletionListener对视频播进行监听,当视频播放完毕之后,播放下一段视频,视频源放在SD卡内的Download文 ...
android ios av tv,iOS AVPlayer 实现后台连续播放视频
最近接到一个需求,需要做一个在后台播放视频的功能.折腾了一下,最后总算完成了.因此写一篇文章,介绍下具体的实现步骤,也说说自己遇到的坑,算是总结和记录. 前言当 App 退到后台时,会进入 susp ...
基于Vue3+Go本地视频管理与播放系统设计与实现
博主介绍:某大厂从事多年后端开发(Go,C++),目前在学习前端项目,还是一名前端新手.喜欢思考一些实用的小项目并付诸实践.欢迎志同道合的小伙伴一起交流学习,同时希望得到大家的支持,如果您觉得博主的文 ...
优酷视频如何进行连续播放？
优酷视频如何进行连续播放? 您可按下列方式打开和关掉持续播发: 移动端:开启优酷app-左上方[设定]-开启或关掉[持续播发]按键就可以. pc端:开启优酷pc客户端-点一下左上方[设定]-启用或不启 ...
android 无缝连续播放视频
android 无缝连续播放视频最近在做视频合成的时候要求把用户选择的视频能够连续预览,第一想的是用户在预览的时候把视频拼接后在预览,结果发现拼接的时间太久了,这种方式不行,结果搞了一天用media ...
html设置视频一直播放,设置video js多视频连续播放
设置video js多视频连续播放代码如下: var vList = ['http://vjs.zencdn.net/v/oceans.mp4', 'http://clips.vorwaerts-g ...
java的rtsp通信、rtp接收数据、本地实现连续播放视频片段（源源不断）（基本实现）
gitee上放着的代码 ---------------------------------------------2021/5/30---------------------------------- ...
使用video标签，连续播放无限个mp4(h264封装的)视频时，画面会闪烁的问题解决
采用的预加载方法,使用两个video标签加一个js中的Array(存储还没播放的视频.) html页面代码,除了下面的div之外,还需导入一个jquery的库我导的jquery-3.4.1.js这个. ...

用aliplayer如何实现视频的连续播放？

用aliplayer如何实现视频的连续播放？相关推荐

最新文章

热门文章