企业官网建设流程全解析

HLS Downloader：浏览器里直接抓取和下载直播流

刷到一个视频网站想保存，但抓包工具太复杂，命令行又不想碰。HLS Downloader 是一个浏览器扩展，专门解决这个问题：自动检测页面上的 HLS 流，选好画质，点一下就能下。

2620 个 Star，MIT 开源，免费用。

1、它做了什么

浏览器扩展装上之后，打开任何一个播放 HLS 视频的页面，扩展会自动嗅探到流地址。不用开 DevTools，不用手动抓包。

点开扩展图标，所有检测到的播放列表都在「Sniffer」标签里。选一个，挑视频分辨率和音频轨道，点下载。剩下的事交给 ffmpeg.wasm——一个跑在浏览器里的 WebAssembly 版 FFmpeg，把音视频合并成 MP4。

整个过程全在本地完成，不上传任何东西。

2、能控制什么

下载前可以选视频分辨率，从 240p 到 4K，挑你需要的那个。音频语言和码率也能单独选，不会浪费流量下不需要的轨道。

这种精细控制在同类工具里不常见。大多数工具要么全下载，要么只能选一个流，HLS Downloader 把选择权交给了用户。

3、支持哪些浏览器

Chrome、Firefox、Edge、Brave、Arc、Opera，基本覆盖了主流浏览器。Windows、macOS、Linux 都能用。

Chrome 用户需要手动安装（开发者模式下加载解压后的文件夹）。Firefox 用户可以直接从 Add-ons 商店装，也可以手动装 XPI。Edge 有官方商店版本。Brave、Arc、Opera 跟着 Chrome 的步骤走就行。

4、怎么装

Chrome 的安装步骤：

1. 从 GitHub Releases 下载extension-mv3-chrome.zip
2. 解压到一个文件夹
3. 打开chrome://extensions/，开启开发者模式
4. 点「加载已解压的扩展程序」，选那个文件夹

Firefox 更简单，直接去 Add-ons 商店搜「HLS Downloader」，一键安装。

5、开发和自定义

项目用 pnpm 管理依赖，Node.js 20 以上版本。克隆下来之后：

corepackenablecorepack prepare pnpm@10.11.0--activatepnpminstall--frozen-lockfilepnpmrun build

默认构建的是 Manifest V2 版本（Firefox 和旧版 Chromium）。要构建 MV3 版本给新版 Chrome 用：

MV_TARGET=mv3pnpmrun build

想一次构建所有版本：

pnpmrun build:all

源码结构清晰：background 是后台脚本，core 是共享逻辑和 Redux store，popup 是 React 写的弹窗界面，design-system 是 UI 组件库。

6、两种构建版本

官方商店版本（Firefox Add-ons、Edge Add-ons）带了一个屏蔽列表，尊重版权方的退出请求。这是为了符合商店的分发政策。

独立构建版本没有屏蔽列表，适合需要完全本地控制的高级用户。构建命令：

pnpmrun build:mv3:no-blocklist

这个版本名字叫「experimental unstable nightly beta alpha hls-downloader」，只建议个人使用。

7、谁适合用

经常需要保存在线视频的人。不管是学习资料、会议录像还是直播回放，只要页面用的是 HLS 协议，这个扩展就能抓到。

不想折腾命令行工具的人。Ffmpeg 功能强大但上手门槛高，HLS Downloader 把它封装成了点击操作。

在意隐私的人。所有处理都在浏览器本地完成，视频数据不出本机。

8、注意事项

这个工具设计的目的是下载你有权访问的内容。下载受版权保护的内容需要获得授权。用户对自己的行为负责。

如果网站运营者不希望这个工具在其网站上工作，可以通过 GitHub Issues 提交退出请求，项目方会把验证过的域名加入屏蔽列表。

的内容需要获得授权。用户对自己的行为负责。

如果网站运营者不希望这个工具在其网站上工作，可以通过 GitHub Issues 提交退出请求，项目方会把验证过的域名加入屏蔽列表。