uWeb 中文文档 下载 App

Plyr 与 DPlayer 视频播放器——倍速、弹幕、直播流

为什么要用独立播放器

网页自带的 <video> 标签功能有限:

uWeb 把社区最流行的两个开源播放器打包成 HTML5 应用。

Plyr 播放器

安装

从官方 HTML5 应用页面安装 Plyr,放在 app/plyr.html。

使用

file:///data/.../app/plyr.html?u=视频URL

核心功能

DPlayer 播放器

安装

从官方 HTML5 应用页面安装 DPlayer,放在 app/dplayer.html。

使用

file:///data/.../app/dplayer.html?u=视频URL

比 Plyr 多的功能

特色服务中的视频播放入口

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

使用方式:

  1. 打开视频页面或视频 URL
  2. 长按底部图像按钮
  3. 选择 Plyr 或 DPlayer
  4. 自动用对应播放器打开

全屏播放菜单项 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.jsvideo.js通用、插件生态丰富
Streamedianhtml5_rtsp_playerRTSP 流

下一章