Hlsjs 弹出
A 类 克莱普 播放以 HTTP Live Streaming (HLS) 为基础的播放 hls.js (英语)。 。 。 .
3.0.0中出现突破变化 -
hls.js不再捆绑。 现在所有文物都期待 你提供它。 见下文移徙说明.
使用量
你可以从JSDelivr那里使用:
<script src="https://cdn.jsdelivr.net/npm/@clappr/core@latest/dist/clappr-core.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/hls.js@1/dist/hls.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/@clappr/hlsjs-playback@3/dist/hlsjs-playback.min.js"></script>
或作为 npm 包 :
yarn add @clappr/hlsjs-playback hls.js@^1
要装载的文物
| 假设 | 艺术 |
|---|---|
<script> / CDN, 之后为 @clappr/core 财务报告和审定财务报表 hls.js | dist/hlsjs-playback.min.js |
| Bundler, 普通JS / UMD 条目 | dist/hlsjs-playback.js (包装) main(中文(简体) ) |
| Bundler,无害环境管理条目 | dist/hlsjs-playback.esm.js (包装) module(中文(简体) ) |
移徙说明(3.0+): 现在所有文物都期待 hls.js 从页面或捆绑。 如果装入 hlsjs-playback.min.js 使用单一脚本标签,添加 hls.js 在它开始之前 如果您为避免被捆绑的复制而别名深道, 请将该条目从捆绑者那里删除 resolve.alias (网包)或等同(网络) resolve.alias滚动 alias)——默认条目现在是外部的:
- '@clappr/hlsjs-playback': '@clappr/hlsjs-playback/dist/hlsjs-playback.external.js',
那就加点 HlsjsPlayback 输入您的玩家实例插件列表 :
var player = new Clappr.Player({
source: 'https://bitdash-a.akamaihd.net/content/sintel/hls/playlist.m3u8',
plugins: [HlsjsPlayback]
})
配置
播放的选项如下:
var player = new Clappr.Player({
source: 'https://bitdash-a.akamaihd.net/content/sintel/hls/playlist.m3u8',
plugins: [HlsjsPlayback],
hlsUseNextLevel: false,
hlsMinimumDvrSize: 60,
hlsRecoverAttempts: 16,
hlsPlayback: {
preload: true,
customListeners: []
},
playback: {
extrapolatedWindowNumSegments: 2,
triggerFatalErrorOnResourceDenied: false,
hlsjsConfig: {
// hls.js specific options
}
}
})
hls 使用下一个级别
默认值 :
false
HLS 回放的默认行为是使用 hls. 当前级别 切换当前关卡。 要改变此行为并强制 HLS 播放使用 下一级,添加 hlsUseNextLevel: true 以嵌入参数.
hls 最小DvrSize 码
默认值 :
60 (seconds)
在 Clappr 活模式下定义活动搜索最小 DVR 大小的选项 .
推算出 WindowNum 组件
默认值 :
2
配置起始时间外推窗口的大小, 以多个分块来测量 .
应该是2或2以上,或者0 才能禁用. 如果一次从播放列表的开头删除一个以上的片段,它就应该增加到2以上.
例如:如果播放列表被缓存了10秒,每5秒会添加/删除新的块.
hls 恢复尝试
默认值 :
16
这个 hls.js 有一些致命错误的恢复方法。 此选项为这些错误设置最大回收尝试号 .
触发 Fatal Error 在资源上升级
默认值 :
false
如果设置此选项为真, 如果解密密钥 http 响应码大于或等于 400 , 播放会触发致命错误事件 。 此选项用于尝试复制 iOS 设备行为, 内部使用 html5 视频回放 .
hls 弹出
很快(在新的断开更改版本中),所有与此回放相关的选项都会被声明在游戏范围中
options对象必须在此新范围内宣布 !
组合所有直接相关的选项 HlsjsPlayback 相会相会.
var player = new Clappr.Player(
{
...
hlsPlayback: {
preload: true,
customListeners: [],
},
});
hlsPlayback.preload
默认值 :
true
配置来源是否在 HLS.JS 内部参考设置或仅在第一出戏后.
hlsPlayback.customListeners
包含特定参数的听众对象阵列 HLS.JS 举个例子.
var player = new Clappr.Player(
{
...
hlsPlayback: {
...
customListeners: [
// "hlsFragLoaded" is the value of HlsjsPlayback.HLSJS.Events.FRAG_LOADED constant.
{ eventName: 'hlsFragLoaded', callback: (event, data) => { console.log('>>>>>> data: ', data) }, once: true }
],
},
});
听者对象参数为:
eventName: 一个有效的事件名称hls.js事件 API· ;callback:当事件听到时,应该召回的召回.once: 如果听众需要一次有效, 要配置的旗帜 .
hlsjs 图形
作为 HlsjsPlayback 是基于 hls.js,有可能使用可用的 hls.js 相会也. 你可以检查出来 这里。 。 。 .
要使用这些设置,请使用 hlsjsConfig 对象.
示例
var player = new Clappr.Player(
{
...
playback: {
hlsjsConfig: {
debug: true, // https://github.com/video-dev/hls.js/blob/master/docs/API.md#debug
enableworker: false, // https://github.com/video-dev/hls.js/blob/master/docs/API.md#enableworker
...
},
},
});
发展
输入工程目录并安装依赖 :
yarn install
修改并运行测试( Vitest) :
yarn test
构建自己的版本( Vite 库模式) :
yarn build
检查结果 dist/ 文件夹.
启动本地服务器 :
yarn start
此命令将在端口 8080 启动 Vite dev 服务器 。 您可以使用 HlsjsPlayback 在 http://localhost: 8080/ 上使用 Clappr- core 检查样本页面
释放
要发布新版本, 首先通过运行创建新标签 :
npm version [patch | minor | major]
选择 patch, (中文(简体) ), minor,或 major 根据新版本的修改.
之后,通过运行向国家预防机制发布新版本:
npm publish
请检查新版本 npmjs @ clappr/hlsjs- playback (英语)。 。 。 .