网页在线播放视频任意时刻播放解决方案,实现关闭网页下次打开自动恢复上一次播放的位置
一、需要解决问题:
- 解决网页大视频加载时间长的问题;
- 实现关闭网页下次打开自动恢复上一次播放的位置;
二、解决方案:
- 付费的解决方案:
暂未找到付费的插件或程序;
哔哩哔哩、腾讯视频网页在线视频技术满足上面两点需求,但他们的技术不开源;
- 开源解决方案:
使用视频切片+流媒体推送技术,解决快速加载播放任意时刻视频;
使用浏览器关闭事件记录播放位置信息;
- 支持HLS协议播放器选择:
- 腾讯视频在线播放器:thumbplayer-h5
SuperPlayer – thumbplayer-h5应用层方案:
文档:https://vm.gtimg.cn/thumbplayer/typedoc/release/superplayer/index.html
测试地址:https://m.v.qq.com/tvp/
- DPlayer
文档:https://dplayer.diygod.dev/zh/guide.html
3.Jwplayer
文档:https://docs.jwplayer.com/players/reference/javascript-player-api-introduction
- xgplayer西瓜播放器
文档:https://v2.h5player.bytedance.com/gettingStarted/
- 其他播放器对比:
地址:https://www.jianshu.com/p/95869f3519b1
- 搭建方案:
基于Nginx+rtmp搭建支持hls协议的点播流媒体服务器(windows/Linux)
解决方案:
https://blog.csdn.net/m0_61474393/article/details/129137341
Windows上搭建rtsp-simple-server流媒体服务器实现rtsp、rtmp等推流以及转流、前端html与Vue中播放hls(m3u8)视频流:
https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article/details/129489676
c#开源解决方案参考:
C#实现通过ffmpeg拉取海康摄像头rtsp流转m3u8,并在前端播放的解决方案:
https://www.cnblogs.com/stephenzengx/p/13673981.html
- windows服务器搭建步骤:
1.搭建FFmpeg服务器;
2.开启iis支持HLS协议;
参考:https://www.ewbang.com/community/article/details/961691857.html
https://www.jianshu.com/p/dc4e5d55758a
3.ffmpeg切片推流实现;
4.前端页面DPlayer播放器接入,加载m3u8地址;
- 实现关闭网页下次打开自动恢复上一次播放的位置:
关闭网页时利用监听事件记录 视频信息、播放位置、用户信息,保存至数据库,再次打开播放视频时读取之前的记录,恢复上一次播放位置。
赞赏
微信赞赏
支付宝赞赏