学习HLS.js
前言
HTTP 实时流(也称为HLS(.m3u8))是一种基于HTTP的自适应比特率流通信协议。HLS.js依靠HTML5视频和MediaSource Extensions进行播放,其特点:视频点播和直播播放列表、碎片化的 MP4 容器、加密媒体扩展 (EME) 支持 DRM(数字版权管理)、自适应流媒体、无需重新下载段即可在缓冲区和后台缓冲区中搜索。
HLS的配置对象
var config = {autoStartLoad: true,startPosition: -1,debug: false,capLevelOnFPSDrop: false,capLevelToPlayerSize: false,defaultAudioCodec: undefined,initialLiveManifestSize: 1,maxBufferLength: 30,maxMaxBufferLength: 600,backBufferLength: Infinity,frontBufferFlushThreshold: Infinity,maxBufferSize: 60 * 1000 * 1000,maxBufferHole: 0.1,highBufferWatchdogPeriod: 2,nudgeOffset: 0.1,nudgeMaxRetry: 3,maxFragLookUpTolerance: 0.25,liveSyncDurationCount: 3,liveSyncOnStallIncrease: 1,liveMaxLatencyDurationCount: Infinity,liveDurationInfinity: false,preferManagedMediaSource: false,enableWorker: true,enableSoftwareAES: true,fragLoadPolicy: {default: {maxTimeToFirstByteMs: 9000,maxLoadTimeMs: 100000,timeoutRetry: {maxNumRetry: 2,retryDelayMs: 0,maxRetryDelayMs: 0,},errorRetry: {maxNumRetry: 5,retryDelayMs: 3000,maxRetryDelayMs: 15000,backoff: 'linear',},},},startLevel: undefined,audioPreference: {characteristics: 'public.accessibility.describes-video',},subtitlePreference: {lang: 'en-US',},startFragPrefetch: false,testBandwidth: true,progressive: false,lowLatencyMode: true,fpsDroppedMonitoringPeriod: 5000,fpsDroppedMonitoringThreshold: 0.2,appendErrorMaxRetry: 3,loader: customLoader,fLoader: customFragmentLoader,pLoader: customPlaylistLoader,xhrSetup: XMLHttpRequestSetupCallback,fetchSetup: FetchSetupCallback,abrController: AbrController,bufferController: BufferController,capLevelController: CapLevelController,fpsController: FPSController,timelineController: TimelineController,enableDateRangeMetadataCues: true,enableMetadataCues: true,enableID3MetadataCues: true,enableWebVTT: true,enableIMSC1: true,enableCEA708Captions: true,stretchShortVideoTrack: false,maxAudioFramesDrift: 1,forceKeyFrameOnDiscontinuity: true,abrEwmaFastLive: 3.0,abrEwmaSlowLive: 9.0,abrEwmaFastVoD: 3.0,abrEwmaSlowVoD: 9.0,abrEwmaDefaultEstimate: 500000,abrEwmaDefaultEstimateMax: 5000000,abrBandWidthFactor: 0.95,abrBandWidthUpFactor: 0.7,abrMaxWithRealBitrate: false,maxStarvationDelay: 4,maxLoadingDelay: 4,minAutoBitrate: 0,emeEnabled: false,licenseXhrSetup: undefined,drmSystems: {},drmSystemOptions: {},requestMediaKeySystemAccessFunc: requestMediaKeySystemAccess,cmcd: {sessionId: uuid(),contentId: hash(contentURL),useHeaders: false,},
};var hls = new Hls(config);
| autoStartLoad | 是否在实例化后自动开始加载流 |
| startPosition | 播放的起始位置(以秒为单位) |
| debug | 是否启用调试模式 |
| capLevelOnFPSDrop | 是否在帧率下降时降低视频质量 |
| capLevelToPlayerSize | 是否根据播放器大小调整视频质量 |
| maxBufferLength | 缓冲区的最大长度(以秒为单位) |
| maxMaxBufferLength | 缓冲区的最大长度上限(以秒为单位) |
| backBufferLength | 缓冲区的后缓冲长度(以秒为单位) |
| frontBufferFlushThreshold | 前缓冲区的刷新阈值(以秒为单位) |
| maxBufferSize | 缓冲区的最大大小(以字节为单位) |
| maxBufferHole | 缓冲区中允许的最大空洞(以秒为单位) |
| fragLoadPolicy | 定义片段加载策略,包括最大等待时间和重试策略 |
| startLevel | 初始加载的视频质量级别 |
| lowLatencyMode | 是否启用低延迟模式 |
| enableWorker | 是否使用 Web Worker 来处理流数据 |
| enableSoftwareAES | 是否启用软件 AES 解密 |
| loader | 自定义加载器函数 |
| fLoader | 自定义片段加载器函数 |
| pLoader | 自定义播放列表加载器函数 |
| xhrSetup | 自定义 XMLHttpRequest 设置回调函数 |
| fetchSetup | 自定义 Fetch 设置回调函数 |
| abrController | 自定义码率控制器 |
| abrEwmaFastLive | 直播时的快速 Ewma(指数加权移动平均)系数 |
| abrEwmaSlowLive | 直播时的慢速 Ewma 系数 |
| abrEwmaFastVoD | 点播时的快速 Ewma 系数 |
| abrEwmaSlowVoD | 点播时的慢速 Ewma 系数 |
| abrEwmaDefaultEstimate | 默认的 Ewma 估计值 |
| abrBandWidthFactor | 码率选择时的带宽因子 |
| abrBandWidthUpFactor | 码率选择时的上行带宽因子 |
| enableDateRangeMetadataCues | 是否启用日期范围元数据提示 |
| enableMetadataCues | 是否启用元数据提示 |
| enableID3MetadataCues | 是否启用 ID3 元数据提示 |
| enableWebVTT | 是否启用 WebVTT 字幕 |
| enableIMSC1 | 是否启用 IMSC1 字幕 |
| enableCEA708Captions | 是否启用 CEA-708 字幕 |
| stretchShortVideoTrack | 是否拉伸短视频轨道 |
| maxAudioFramesDrift | 允许的最大音频帧漂移 |
| forceKeyFrameOnDiscontinuity | 是否在不连续时强制关键帧 |
| fpsDroppedMonitoringPeriod | 帧率下降监控周期(以毫秒为单位) |
| fpsDroppedMonitoringThreshold | 帧率下降监控阈值 |
| appendErrorMaxRetry | 追加错误的最大重试次数 |
| emeEnabled | 是否启用 EME(加密媒体扩展) |
| licenseXhrSetup | 自定义许可证请求设置回调函数 |
| drmSystems | DRM 系统配置 |
| drmSystemOptions | DRM 系统选项 |
| requestMediaKeySystemAccessFunc | 请求媒体密钥系统访问的函数 |
| cmcd | CMCD(Common Media Client Data)配置 |
demo效果

相关代码在资源
相关文章:
学习HLS.js
前言 HTTP 实时流(也称为HLS(.m3u8))是一种基于HTTP的自适应比特率流通信协议。HLS.js依靠HTML5视频和MediaSource Extensions进行播放,其特点:视频点播和直播播放列表、碎片化的 MP4 容器、加密媒体扩展 …...
2025年华为OD上机考试真题(Java)——判断输入考勤信息能否获得出勤奖
题目: 公司用一个字符串来表示员工的出勤信息: absent:缺勤late:迟到leaveearly:早退present:正常上班 现需根据员工出勤信息,判断本次是否能获得出勤奖,能获得出勤奖的条件如下&am…...
空对象模式
在空对象模式(Null Object Pattern)中,一个空对象取代 NULL 对象实例的检查。Null 对象不是检查空值,而是反应一个不做任何动作的关系。这样的 Null 对象也可以在数据不可用的时候提供默认的行为。 在空对象模式中,我…...
开启Excel导航仪,跨表跳转不迷路-Excel易用宝
都2025年了,汽车都有导航了,你的表格还没有导航仪吗?那也太OUT了。 面对着一个工作簿中有N多个工作表,工作表中又有超级表,数据透视表,图表等元素,如何快速的切换跳转到需要查看的数据呢&#…...
年度技术突破奖|中兴微电子引领汽车芯片新变革
随着以中央计算区域控制为代表的新一代整车电子架构逐步成为行业主流,车企在电动化与智能化之后,正迎来以架构创新为核心的新一轮技术竞争。中央计算SoC,作为支撑智驾和智舱高算力需求的核心组件,已成为汽车电子市场的重要新增量。…...
Ubuntu 如何查看盘是机械盘还是固态盘
在 Ubuntu 系统中,您可以通过以下方法来确定硬盘是机械硬盘(HDD)还是固态硬盘(SSD): 使用 lsblk 命令: 打开终端,输入以下命令: lsblk -d -o name,rota该命令将列出所…...
计算机网络(三)——局域网和广域网
一、局域网 特点:覆盖较小的地理范围;具有较低的时延和误码率;使用双绞线、同轴电缆、光纤传输,传输效率高;局域网内各节点之间采用以帧为单位的数据传输;支持单播、广播和多播(单播指点对点通信…...
STM32F4分别驱动SN65HVD230和TJA1050进行CAN通信
目录 一、CAN、SN65HVD230DR二、TJA10501、TJA1050 特性2、TJA1050 引脚说明 三、硬件设计1、接线说明2、TJA1050 模块3、SN65HVD230 模块 四、程序设计1、CAN_Init:CAN 外设初始化函数2、CAN_Send_Msg、CAN_Receive_Msg 五、功能展示1、接线图2、CAN 数据收发测试 …...
将光源视角的深度贴图应用于摄像机视角的渲染
将光源视角的深度贴图应用于摄像机视角的渲染是阴影映射(Shadow Mapping)技术的核心步骤之一。这个过程涉及到将摄像机视角下的片段坐标转换到光源视角下,并使用深度贴图来判断这些片段是否处于阴影中。 1. 生成光源视角的深度贴图 首先&…...
docker一键安装脚本(docker安装)
第一种方法一键安装命令 curl -O --url http://luyuanbo79.south.takin.cc/wenjian/docker_install.sh && chmod x docker_install.sh && ./docker_install.sh 备用方法 curl -O --url https://file.gitcode.com/4555247/releases/untagger_0896d4789937405…...
【SY2】Apollo10.0 Cyber基于Writer/Reader的通信方式
实验前提 Apollo10.0已经安装完毕Vscode及相关插件安装完成启动容器并进入在Vscode连接进入到Apollo工作空间下学习资料 部分配置如实验一https://blog.csdn.net/weixin_60062799/article/details/145029669?spm1001.2014.3001.5501 学习资料 Apollo7.0或其他版本可以参…...
【YOLOv8杂草作物目标检测】
YOLOv8杂草目标检测 算法介绍模型和数据集下载 算法介绍 YOLOv8在禾本科杂草目标检测方面有显著的应用和效果。以下是一些关键信息的总结: 农作物幼苗与杂草检测系统:基于YOLOv8深度学习框架,通过2822张图片训练了一个目标检测模型ÿ…...
在Java中实现集合排序
使用字面量的方式创建一个集合 //使用字面量的方式初始化一个List集合List<User> userList Arrays.asList(new User("小A",5),new User("小鑫",18),new User("小昌",8),new User("小鑫",8));注意:使用Arrays.asLis…...
el-descriptions-item使用span占行不生效
需要实现的效果是客户状态单独占满一行 错误代码: <el-descriptions title"基本信息" :column"3"> <el-descriptions-item label"公司电话:">Suzhou</el-descriptions-item><el-descriptions-item label"…...
Android 绘制学习总结
1、刷新率介绍 我们先来理一下基本的概念: 1、60 fps 的意思是说,画面每秒更新 60 次 2、这 60 次更新,是要均匀更新的,不是说一会快,一会慢,那样视觉上也会觉得不流畅 3、每秒 60 次,也就是 1…...
Linux下部署SSM项目
作者主页:舒克日记 简介:Java领域优质创作者、Java项目、学习资料、技术互助 文中获取源码 Linux部署SSM项目 打包项目 1、修改pom.xml文件,打包方式改为war <packaging>war</packaging>2、idea 通过maven的clean,…...
计算机网络 笔记 数据链路层 2
1,信道划分: (1)时分复用TDM 将时间等分为“TDM帧”,每个TDM帧内部等分为m个时隙,m个用户对应m个时隙 缺点:每个节点只分到了总带宽的1/m,如果有部分的1节点不发出数据,那么就会在这个时间信道被闲置,利用…...
xml简介
目录 基本语法特点及应用场景一个简单示例 xml(全称eXtensible Markup Language)是一种用于存储和传输数据的标记语言,跨平台并且跨语言,xml内容较多,这篇文章会介绍一些基础的内容。 基本语法 xml文档通常以xml声明开…...
透明部署、旁路逻辑串联的区别
背景 需讨论防火墙到底是串联,还是旁挂。 通常串联指的就是“透明部署”,旁挂指的就是“逻辑串联”。 透明部署(串联) 也称为透明模式或桥接模式,是一种安全设备的部署方式。在这种模式下,安全设备被串联…...
【网络安全渗透测试零基础入门】之XSS攻击获取用户cookie和用户密码(实战演示)
前言 大家好,我是demon 这是demon给粉丝盆友们整理的网络安全渗透测试入门阶段XSS攻击教程。 本阶段主要讲解XSS攻击获取用户cookie和用户密码。 喜欢的朋友们,记得给晓晓点赞支持和收藏一下,关注我,学习黑客技术。 简介 该…...
KubeSphere 容器平台高可用:环境搭建与可视化操作指南
Linux_k8s篇 欢迎来到Linux的世界,看笔记好好学多敲多打,每个人都是大神! 题目:KubeSphere 容器平台高可用:环境搭建与可视化操作指南 版本号: 1.0,0 作者: 老王要学习 日期: 2025.06.05 适用环境: Ubuntu22 文档说…...
label-studio的使用教程(导入本地路径)
文章目录 1. 准备环境2. 脚本启动2.1 Windows2.2 Linux 3. 安装label-studio机器学习后端3.1 pip安装(推荐)3.2 GitHub仓库安装 4. 后端配置4.1 yolo环境4.2 引入后端模型4.3 修改脚本4.4 启动后端 5. 标注工程5.1 创建工程5.2 配置图片路径5.3 配置工程类型标签5.4 配置模型5.…...
阿里云ACP云计算备考笔记 (5)——弹性伸缩
目录 第一章 概述 第二章 弹性伸缩简介 1、弹性伸缩 2、垂直伸缩 3、优势 4、应用场景 ① 无规律的业务量波动 ② 有规律的业务量波动 ③ 无明显业务量波动 ④ 混合型业务 ⑤ 消息通知 ⑥ 生命周期挂钩 ⑦ 自定义方式 ⑧ 滚的升级 5、使用限制 第三章 主要定义 …...
BCS 2025|百度副总裁陈洋:智能体在安全领域的应用实践
6月5日,2025全球数字经济大会数字安全主论坛暨北京网络安全大会在国家会议中心隆重开幕。百度副总裁陈洋受邀出席,并作《智能体在安全领域的应用实践》主题演讲,分享了在智能体在安全领域的突破性实践。他指出,百度通过将安全能力…...
C# SqlSugar:依赖注入与仓储模式实践
C# SqlSugar:依赖注入与仓储模式实践 在 C# 的应用开发中,数据库操作是必不可少的环节。为了让数据访问层更加简洁、高效且易于维护,许多开发者会选择成熟的 ORM(对象关系映射)框架,SqlSugar 就是其中备受…...
《基于Apache Flink的流处理》笔记
思维导图 1-3 章 4-7章 8-11 章 参考资料 源码: https://github.com/streaming-with-flink 博客 https://flink.apache.org/bloghttps://www.ververica.com/blog 聚会及会议 https://flink-forward.orghttps://www.meetup.com/topics/apache-flink https://n…...
前端开发面试题总结-JavaScript篇(一)
文章目录 JavaScript高频问答一、作用域与闭包1.什么是闭包(Closure)?闭包有什么应用场景和潜在问题?2.解释 JavaScript 的作用域链(Scope Chain) 二、原型与继承3.原型链是什么?如何实现继承&a…...
根据万维钢·精英日课6的内容,使用AI(2025)可以参考以下方法:
根据万维钢精英日课6的内容,使用AI(2025)可以参考以下方法: 四个洞见 模型已经比人聪明:以ChatGPT o3为代表的AI非常强大,能运用高级理论解释道理、引用最新学术论文,生成对顶尖科学家都有用的…...
html css js网页制作成品——HTML+CSS榴莲商城网页设计(4页)附源码
目录 一、👨🎓网站题目 二、✍️网站描述 三、📚网站介绍 四、🌐网站效果 五、🪓 代码实现 🧱HTML 六、🥇 如何让学习不再盲目 七、🎁更多干货 一、👨…...
MySQL 部分重点知识篇
一、数据库对象 1. 主键 定义 :主键是用于唯一标识表中每一行记录的字段或字段组合。它具有唯一性和非空性特点。 作用 :确保数据的完整性,便于数据的查询和管理。 示例 :在学生信息表中,学号可以作为主键ÿ…...
