Plyr 与 DPlayer 视频播放器——倍速、弹幕、直播流
为什么要用独立播放器
网页自带的 <video> 标签功能有限:
- 倍速通常只有 0.5/1/1.5/2 四档
- 不支持弹幕
- 不支持直播流协议(HTTP-FLV、HLS)
- 没有快捷键控制
uWeb 把社区最流行的两个开源播放器打包成 HTML5 应用。
Plyr 播放器
安装
从官方 HTML5 应用页面安装 Plyr,放在 app/plyr.html。
使用
file:///data/.../app/plyr.html?u=视频URL
核心功能
- 倍速播放:0.5x、0.75x、1x、1.25x、1.5x、1.75x、2x
- 画中画模式:支持 PiP(Picture-in-Picture)
- 快捷键:空格播放暂停、左右方向键快进快退、M 静音、F 全屏
- 字幕支持:SRT 等字幕格式
- 循环播放:A-B 循环特定片段
DPlayer 播放器
安装
从官方 HTML5 应用页面安装 DPlayer,放在 app/dplayer.html。
使用
file:///data/.../app/dplayer.html?u=视频URL
比 Plyr 多的功能
- 弹幕系统:支持视频上方滚动弹幕
- HTTP-FLV 支持:B站 flv.js 引擎,适合直播流
- HLS 支持:hls.js 引擎,适合 m3u8 直播流
- Danmaku 格式:B站原生弹幕格式支持
特色服务中的视频播放入口
default.urls 里预设了播放器的快捷入口:
plyr播放器:file:///data/user/0/info.torapp.uweb/files/app/plyr.html?u=%u
dplayer播放器:file:///data/user/0/info.torapp.uweb/files/app/dplayer.html?u=%u
使用方式:
- 打开视频页面或视频 URL
- 长按底部图像按钮
- 选择 Plyr 或 DPlayer
- 自动用对应播放器打开
全屏播放菜单项 default.playrate
default.playrate 配置"全屏播放"菜单的倍速选项。格式类似 default.link:
.5x:
.75x:
1x:
1.25x:
1.5x:
1.75x:
2x:
自定义倍速命令:你的播放命令
前几行只有倍速值(冒号后为空),uWeb 识别为倍速菜单项。最后一行是附加命令。
至少要有一个倍速菜单项才能让菜单生效。
支持的直播流
HTTP-FLV(flv.js)
B站技术生态,低延迟、高并发:
file:///.../dplayer.html?u=http://example.com/live/stream.flv
HLS(hls.js)
苹果提出的协议,兼容性好:
file:///.../dplayer.html?u=http://example.com/live/stream.m3u8
RTSP(html5_rtsp_player)
安防摄像头等场景:
file:///.../app/rtsp.html?u=rtsp://example.com/stream
其他可用播放器
| 播放器 | 引擎 | 特色 |
|---|---|---|
| APlayer | - | 音乐播放器,适合音频文件 |
| video.js | video.js | 通用、插件生态丰富 |
| Streamedian | html5_rtsp_player | RTSP 流 |