搜索 - 腾讯云开发者社区-腾讯云

开发者社区

文档建议反馈控制台

文章/答案/技术大牛

发布

来自专栏媒矿工厂
HLS.js：过去，当下和未来
一些 HLS.js 的其他释义 HLS.js 的历史 HLSv1.0 为你的流添加 HLS 生成视频段提供播放列表增量更新阻止播放列表重载预加载提示和阻塞媒体下载提供报告的副本概述 HLS.js 什么是 HLS.js？图2 MSE 流程图一些 HLS.js 的其他释义 HLS.js 是在浏览器中播放 HLS 的许多方法之一；苹果浏览器 Safari 是最先使用 HLS.js 的浏览器； HLS.js 的目标是支持任何 HLS.js 的历史 HLS.js 是由 Guillaume du Pontavice 于 2015 年在 Dailymotion 创建的开源项目。图3 参与 HLS.js 开发人员的统计图参与 HLS.js 开发的人历年来具体的贡献可见—— https://github.com/video-dev/hls.js/graphs/contributors
6.1K51编辑于 2022-02-18
来自专栏Kirin博客
HTML5点播m3u8(hls)格式视频
而其他浏览器则需要借助hls.js来兼容m3u8。使用hls.js，不需要任何定制的播放器，只需要
12.2K40发布于 2020-05-11
来自专栏腾讯云音视频专家服务
几招解决超级播放器Error Code:4
前言市面上播放器千千万，比如我们常见的有Video.js、hls.js、点播超级播放器等。图片 2.png 3、Js顺序加载失败如果是这个场景，那需要保证hls.js在tcplayer.js前引入，tcplayer.js加载并初始化播放器后，需要通过hls.js来播放hls视频，如果hls.js 在tcplayer.js之后引入，播放器初始化成功并调用hls.js进行视频播放器的时候，hls.js可能并未加载成功，导致播放失败，原来用户播放失败是这里没有调整好。错误示例：图片 3png.png 正确示例：图片 4.png ps:有些情况下，通过动态加载js，虽然hls.js在tcplayer.js前，但是动态加载并不能保证加载顺序按照对应的顺序加载，hls.js
19.6K153发布于 2020-11-27
来自专栏媒矿工厂
基于 HTTP 的低延迟流媒体播放器的性能
对于 LL-HLS，我们使用了 HLS.js 、Shaka player 和 Apple 的 AVPlayer。这高于 HLS.js 实现的 4.32 秒，但明显低于 AVPlayer 实现的 15.96 秒。 HLS.js 和 Shaka 播放器更接近流的实时边缘，因此，它们比 AVPlayer 更容易重新缓冲（HLS.js 为 36 次，Shaka 播放器为 12 次）。 HLS.js 下载了 662 个块和 11 个整段。与 Shaka 播放器不同，AVPlayer 和 HLS.js 下载了 600 多个媒体对象。最后，HLS.js 由于其高度可变的延迟而具有很大的播放速度变化值。多次观察到 HLS.js 必须以 1.5 倍的速度播放才能赶上实时边缘。最后，我们看看 LL-DASH 播放器的行为。
9.5K40编辑于 2021-12-22
来自专栏GOOPHER的折腾记录
为volantis添加hls.js以在Chrome上播放m3u8视频
为volantis添加hls.js以在Chrome上播放m3u8视频前言按照上一篇文章 https://goopher.tk/posts/2.html 所述，在md中插入视频要写很长一串，并且不支持主题的操作在header.ejs中引入hls.js 打开themes/volantis/layout/_partial/header.ejs文件，在前添加： <script src="https://cdn.jsdelivr.net
1.9K40编辑于 2022-03-31
来自专栏播放器
tcplayer 源码改造第一弹 -> 自定义加密
准备工具 TCPlayerLite 可由腾讯点播获取 hls.js 同样也是腾讯提供的hls文件 ide 客官可随意，能用就行源码改造(各位客官请自行格式化代码) 添加配置参数在代码中定位videoSource 文件中： // hls.js e.readyState || e.open("GET", t.url, ! 0) 此处调用了GET请求，即请求m3u8索引文件、ts文件、加密ts的key文件，而实际处理请求结果就在下面几行： // hls.js var u = void 0, d = (u = t.response).byteLength : (u = t.responseText).length, n.loaded = n.total = d; 由于使用了改造过的hls.js文件，的判断,如果设置了encryptHls蚕食,则使用自定义的hls.js文件进行解析 var n = this, r = w[this.options.hls] || w["0.7.1"]; i ?
4K31发布于 2019-11-01
来自专栏开源服务指南
简单易用、轻松定制的HTML 视频播放器
响应式设计 - 适用于任何屏幕尺寸 Monetization (盈利) - 通过视频赚钱 Streaming (流媒体) - 支持 hls.js，Shaka 和 dash.js 流媒体回放功能 video-dev /hls.js[3] Stars: 13.2k License: NOASSERTION HLS.js 是一个 JavaScript 库，实现了 HTTP Live Streaming 客户端。 HLS.js 还支持 HLS + fmp4 格式，并且可以直接在标准的 HTML
1.6K30编辑于 2023-09-02
来自专栏音视频技术
花椒web端实时互动流媒体播放器
在这个站点中的首页需要一个播放器，既能播放FLV直播视频流，还要在用户点击视频回顾按钮的时候，弹出窗口播放HLS视频流；我们开始开发这个播放器的时候也没有多想，直接使用了大家都能想到的最简单的套路，flv.js和hls.js 在播放视频时，调用中间件video.js来输出的Player来实现播放，这个Player根据视频地址的结尾字符来初始化播放器：new HLS 或者 flvjs.createPlayer，对外提供一致的接口，对HLS.js 完美的实现了产品的需求，不过写代码的时候总感觉有点蠢，HLS.js（208KB）和FLV.js（169KB）体积加起来有点太让人热泪盈眶了。碎片）片段，然后通过Media Source Extensions将MP4片段传输给HTML5的Video标签进行播放; HLS.js的结构如下： ? 代码的读取套路之后我们可以更清晰的了解hls.js实现播放HLS流的大致过程了; hls.js只播放HLS流, 没有NativePlayer, 所以顶级src/hls.js 对应着 flv.js中的
4.5K43发布于 2019-12-17
来自专栏崔哥的专栏
nginx 安装rtmp模块实现推流服务器
./55427366_48_0.flv -c copy -f flv rtmp://127.0.0.1:1935/live/stream OBS推流拉流测试 VLC 容易失败，失败就多试几次 hls.js head> <meta charset="UTF-8"> <title>Title</title> <script src="https://cdn.jsdelivr.net/<em>hls.js</em>
2.1K10编辑于 2022-10-04
来自专栏腾讯云存储
HLS视频加密，让您的视频内容更安全！
在页面中引入压缩包中cos_hls.js、jsencrypt.js 和 hls.js。 3. 根据播放器种类，在页面中引入压缩包中文件，目前支持三种类型（hls.js/tcplayer/video.js）。 hls.js: <script src=". /<em>hls.js</em>"></script> <script src=". play方法播放视频文件 cosHls.play({ // video标签的id container: 'video', // 支持的播放器种类（<em>hls.js</em> /tcplayer/video.js） playerType: '<em>hls.js</em>', // 请求m3u8接口的文件地址 src: 'https://examplebucket
1.6K10编辑于 2024-05-10
《基于hls.js构建企业级M3U8播放器：从原理到实战》
本文将以我实现的一个M3U8播放器为例，深度解析如何基于hls.js构建一个企业级的在线播放解决方案，涵盖核心技术选型、架构设计和性能优化策略。我首先明确了播放器的核心架构：展开代码语言：TXTAI代码解释┌─────────────────┐┌──────────────────┐┌─────────────────┐│M3U8输入界面│->│hls.js this.hls){this.hls.config.maxMaxBufferLength=30;}}}四、部署与实践建议基于这个架构，我将播放器部署为在线工具，主要解决了以下实际问题：快速验证：开发者在集成hls.js 测试不同网络环境下流的自适应表现部署注意事项：使用CDN加速静态资源加载配置合适的CORS策略启用Gzip压缩减少资源大小添加ServiceWorker支持离线使用五、总结通过这个完整的实现案例，我们可以看到基于hls.js
66510编辑于 2025-11-23
来自专栏rikka
将 mp4 视频切片成 ts 后使用 jsDelivr 加速制作 "视频床"
ts 后, 使用 ffmpeg 将 ts 文件切片, 然后上传到 Github 的仓库里此处使用的播放器为 DPlayer: http://dplayer.js.org/zh/ 使用之前要必须先引入 hls.js <script src="https://cdn.jsdelivr.net/<em>hls.js</em>/latest/hls.min.js"></script> 也可以用 hexo-tag-dplayer 通过外挂标签的形式使用
1.2K30编辑于 2022-01-20
来自专栏音视频咖
最佳实践 | 腾讯云X-P2P团队 Web HLS P2P实践
由此, 业界大神创建了hls.js项目，项目的原理是基于浏览器的MSE接口，将HLS转封装为fMP4，曲线救国让浏览器播放转封装后的MP4。基于hls.js已有的工作，再集成XP2P将十分容易，直接拦截本来该向CDN发起的ts请求，改为向其他节点或CDN混合请求的方式去获取ts，其中CDN用于兜底。 XP2P只代理请求获取ts数据，同时将ts数据的下载性能(如耗时)反馈给hls.js，即可让hls.js内部的自适应码率模块依然正常工作，而XP2P则能够代理请求变换码率之后的ts，这种方式让接入十分简单，仅需数行代码即可快速集成hls.js，同时XP2P还提供通用接口, 其他HLS播放器均可集成. const video = document.getElementById('video');const hls = new Hls(); // 创建hls.js实例 // 接入SDKif (HLSP2P.isSupported
3.7K30发布于 2021-09-22
来自专栏SRS开源服务器
SRS6.0: 七年长跑，全面支持H.265
• 不支持：使用Chrome hls.js播放HLS流。底层MSE支持，但hls.js是负责将HLS转fMP4，也需要支持才行。 • 不支持：使用Chrome dash.js播放DASH流。 localhost:8080/live/livestream.flv • http://localhost:8080/live/livestream.m3u8 Note: 注意不能用H5播放HLS，因为hls.js Note: Media Source Extensions (MSE)是浏览器支持流媒体的底层接口，可以认为是把点播或直播转成fMP4切片送给H5 video对象，比如mpegts.js、hls.js和 H5播放器目前mpegts.js支持，hls.js和dash.js还没有支持。在某些场景下，HEVC的应用完全成熟了，具体就需要各位开发者自己评估了。
3.8K40编辑于 2023-04-02
来自专栏媒矿工厂
如何实现 LL HLS
为 LL HLS 进行了优化的播放器，如 JW Player[3] 和 HLS.js[4]，平均在 5 到 6 秒之间，如下图 9 所示。图 9 左边的程序窗口中的视频，右边的播放器窗口中的视频，显示 HLS.js 播放器的延迟略低于 6 秒有趣的是，HLS.js demo 网页提供了大量有用的信息，显示延迟为 3.634 秒，你可以在图图 10 HLS.js demo 页面提供了很多数据，但它的延迟测量似乎不正确另一方面，没有针对 LL HLS 进行优化的播放器，如 Native HLS Playback Chrome 扩展，显示延迟高达 developer-tools.jwplayer.com/stream-tester [4] https://hls-js.netlify.app/demo/ [5] https://github.com/video-dev/hls.js
3.1K30编辑于 2022-04-11
来自专栏羽月技术
如何保护会员或付费视频？优酷是怎么做的？ - HLS 流媒体加密
通过上篇文章设置好后，就可以更改 js 代码，如下： import Hls from 'hls.js';const video = document.querySelector('video')const url) hls.attachMedia(video); hls.on(Hls.Events.MANIFEST_PARSED, () => { video.play(); }); 这里只是给 hls.js hls.js 有两个 loader 一个是 xhr-loader 一个是 fetch-loader。不过所有请求都是通过 xhr-loader 发送的。如果想让视频下载下来也不能观看的话可以对视频片段进行 AES128 加密，AES128 是 HLS 最常用的加密，并且 hls.js 也支持这种加密，它是对称加密（使用同一个密钥进行加密和解密）。
2.4K30编辑于 2022-10-09
来自专栏媒矿工厂
使用开源库构建自定义视频体验
所有使用的库都是开源的，包括react、video.js、vtt.js和hls.js。 Stephen将演讲分为了四部分，项目背景，项目概述与需求，代码实现，已取得的成功与展望。然后是使用到的开源工具，包括Video-react，VTT.js，HLS.js。最后，Stephen展示了已取得的成功与之后的展望。
88330发布于 2019-08-08
来自专栏音视频开发
教你从0开始搭建php直播系统完整教程
Web 播放器常用： flv.js / hls.js video.js + 插件业务服务端（PHP实现）功能：房间管理、用户鉴权、弹幕、礼物、统计、接口API。前端播放：网页端使用 flv.js（FLV over HTTP-FLV）或 hls.js（HLS），移动端用原生播放器或 SDK。 MariaDB Redis（可选但推荐）流媒体服务器：SRS / ZLMediaKit / Nginx-RTMP（示例同时给出 Nginx-RTMP 和 SRS 常用配置）前端库：flv.js / hls.js 使用 hls.js（HLS）<script 前端用 flv.js/hls.js 带 token 请求流地址并播放。弹幕/聊天通过 WebSocket 与聊天室服务交互。
76410编辑于 2025-10-23
来自专栏音视频技术
13款用于Web的流行HTML5视频播放器
hls.js是另一款流行的视频播放器，用于播放HLS（m3u8）视频流。它的网站声明是：“HLS.js是一个实现了HTTP视频流客户端的JavaScript库。它依赖HTML5视频和媒体源扩展进行播放。” 你可以经常看到人们将hls.js作为独立播放器使用，或者通过插件和VideoJS一起使用（比如videojs-hlsjs[3]）。 hls.js具备丰富的功能，包括对直播和点播、fMP4 (CMAF)、DRM（AES-128和SAMPLE-AES）、字幕、隐藏字幕等的支持。 https://github.com/video-dev/hls.js/ https://www.jwplayer.com/html5-video-player/ https://bitmovin.com
9.5K20编辑于 2022-06-29
来自专栏音视频开发
php直播系统源码-系统开发指南
→ 更新 rooms.is_live = 1，写入 streams 表 start_at 观众打开房间页 → 前端向 PHP 请求短期播放 token（签名、过期） → 前端用 flv.js 或 hls.js Sprint 分解）MVP（2-4 周）：用户注册/登录、主播创建房间、生成 stream_key 简单 RTMP 推流鉴权（on_publish）、SRS/nginx-rtmp 集成 Web 播放页（hls.js 14 参考与工具（自测） ffmpeg（用于本地推流与转码测试） flv.js / hls.js（浏览器播放） SRS / ZLMediaKit / nginx-rtmp 文档 Docker images
82310编辑于 2025-10-24

第 2 页第 3 页第 4 页第 5 页第 6 页

点击加载更多