企业官网建设流程全解析

猫抓Cat-Catch的取舍之道：一个嗅探扩展，凭什么敢碰加密视频、多线程下载和实时转封装

【免费下载链接】cat-catch猫抓 浏览器资源嗅探扩展 / cat-catch Browser Resource Sniffing Extension项目地址: https://gitcode.com/GitHub_Trending/ca/cat-catch

先抛一个反常识的现象：一个定位为"嗅探"的浏览器扩展，代码库里却躺着 HLS 解密器、TS 转 MP4 的转封装模块、可调线程数的分片下载器、边下边存的流式写入器，甚至还有 MQTT 推送通道。"嗅探"这个词，本意是"看一眼就走"——列出页面资源、给出直链，任务就结束了。可猫抓 Cat-Catch 偏偏长成了一个小型媒体处理平台。这不合理。一个嗅探工具，凭什么越界到这种程度？答案是：它不这么做，用户的真实需求就落不了地。而支撑它做到这一点的，是几十个"在平台限制里讨价还价"的技术取舍。

先看用户怎么用，再看架构怎么长

还原一个再普通不过的场景：用户点开某个视频页，页面通过 MediaSource 扩展（MSE）把视频切成几十上百个分片，喂给<video>标签，地址栏里永远只有一行blob:。用户想要的是"把这个视频存下来"，浏览器给他的却是"一段不可寻址的临时内存"。嗅探这件事，就这样从"找到 URL"被硬生生升级成了"在播放链路里扒出分片清单、解密密钥、以及带 referer 的完整请求上下文"。

从场景反推，架构必须回答三个问题：资源会从哪几层冒出来（网络层，还是页面里的 JS 调用）；资源以什么形态出现（直链、HLS 清单、MPD 清单，还是加密分片）；下载之后要不要二次加工（合并、改名、转码）。于是猫抓的代码被场景逼成了清晰的三段：捕获、解析、输出。catch-script/catch.js驻在页面里当"内应"，js/background.js挂在 webRequest 上当"门卫"，js/m3u8.js与js/downloader.js各自开一个独立页面当"车间"。架构不是设计出来的，是被用户的使用路径一点点撑出来的。

三个"为什么"：被放弃的方案，往往比被采用的更值钱

为什么存储选了"会话级"，宁可重启就丢

摆在桌面上的备选有两个：storage.local持久但每次写入都可能抛 IO 错误，一旦写坏，用户的配置跟着陪葬；storage.session稳定但会话结束即清空。猫抓的做法是 session 为主、local 兜底、再用alarms定时落盘，让"持久化"变成一件有节奏的、可失败的事，而不是一次豪赌。

把丢得起的瞬时数据放在高稳定性区，把丢不起的配置放在持久区——这就是对存储分级最直白的注脚。嗅探结果本质是"可再生数据"，丢了重抓一遍即可；而"扩展别崩、配置别丢"是不可妥协的信任线。

// background.js 中的定时任务：周期把捕获数据落盘 chrome.alarms.onAlarm.addListener(function (alarm) { if (alarm.name === "save") { (chrome.storage.session ?? chrome.storage.local) .set({ MediaData: cacheData }); // session 不可用则降级 local return; } });

为什么敢跟 Service Worker 的"强制回收"掰手腕

Manifest V3 里，Service Worker 大约 5 分钟就会被浏览器强制回收，代码注释里直接引用了 Chromium 的 bug 编号（1271154）。可嗅探是"全天候守门"的活，SW 一睡，网络监听就断。备选方案都不好看：彻底不守，会错过用户要的资源；每次唤醒重建全部状态，又慢得没法用。

猫抓的选择是"心跳保活"：注册webNavigation的空监听制造活动事件，每 25 秒调一次chrome.runtime.getPlatformInfo，再开一条名为HeartBeat的 Port 定时重连。这招谈不上"正统"，却是把平台规则摸透之后的务实解。它不是对抗平台，而是把平台的回收策略当作约束条件来求解——先承认规则存在，再找出规则允许的生存空间。

为什么解密功能选择"内嵌"，而不是甩给外部工具

HLS 流的 AES-128 加密太常见，一个解析器不会解密，等于只完成了一半工作。外包给 m3u8DL 这类命令行工具确实省事，但用户得先装环境；内嵌解密器，则是直接塞进主包。猫抓从 hls.js 里剥离出AESDecryptor单独内置，让用户在界面上填 key/IV，也可以一键"跳过解密"。

代价是包体变大、攻击面变宽，换来的却是零外部依赖的完整闭环：在浏览器里拿到密钥，就在浏览器里解密、合并、转封装，全程不落地。对一个面向非技术用户为主的扩展来说，这条取舍线的方向几乎不用犹豫。

把"嗅探"讲成两句话：装水表，和分段接管

可以把嗅探理解成"在黑箱上装水表"。webRequest是装在大门口的总水表，每个请求进出都会读数，但看不清水管内部的流态；MediaSource 代理则是在水管内部再装一只流量计——通过改写页面里的 MediaSource 方法，能看见播放器真正吞进了哪些分片。双路并举，正好覆盖"直链文件"和"分片流"两类主流场景。

捕获数据是如何配对的，这段逻辑值得细看：

// background.js：按 requestId 暂存请求头，响应到达时再配对 chrome.webRequest.onSendHeaders.addListener(data => { G.requestHeaders.set(data.requestId, data.requestHeaders); // 先记账 findMedia(data, true); }, { urls: ["<all_urls>"] }, ["requestHeaders"]); chrome.webRequest.onResponseStarted.addListener(data => { data.allRequestHeaders = G.requestHeaders.get(data.requestId); G.requestHeaders.delete(data.requestId); // 配对完立即释放，防止 Map 膨胀 findMedia(data); }, { urls: ["<all_urls>"] }, ["responseHeaders"]);

每个请求都以requestId为钥匙，暂存区用后即焚——所以G.requestHeaders是个 Map 而不是数组，这背后是防止内存无限增长的工程自觉。

下载阶段的类比是"水管工分段接管"：几百个 ts 分片不可能一次性塞进内存，downloader.js借助 StreamSaver 边下载边写磁盘，浏览器内存始终保持平稳。所有这些能力最后都被收敛进一个可视化界面，从线程数到密钥框、从下载范围到合并开关，一目了然。

演进不是"推倒重来"，是顺着 bug 一格格打补丁

翻CHANGELOG.md会看到一条特别不性感、却异常有效的演进线：2.6.8 支持 EXT-X-BYTERANGE 分片合并；2.7.0 从浏览器缓存直接读 m3u8，解决"一次性 URL"问题；2.7.1 下载失败自动重试；2.7.2 隐藏已下载切片。没有一次宏大叙事的重构，全是顺着真实用户 bug 逐个击破。这种打法能成立，靠的是模块边界足够干净：catch.js只动页面层，background.js只动网络层，m3u8.js只碰解析，改一处不连累全局。

有意思的是，工程决策不只写在代码里，也写在许可证里。1.0 版用 MIT，2.0 版改成了 GPL v3，README 里直言：为了生态，希望使用了猫抓源码的扩展保持开源。把"防闭源套壳"固化进许可证，是另一种把社区价值做成规则的手段。

国际化的处理同样"工程化"：tools/sync-locales.js以英文为基准，其它语言缺失的 key 自动用英文占位，贡献者只需要翻译自己负责的那一份文件。从韩语、俄语到越南语，CHANGELOG 里长长的致谢名单，就是社区驱动模式最好的证据。

三条能带走的东西

把平台限制当作需求文档来读。SW 回收、存储报错、Trusted Types 强制、iframe sandbox 阻断，每一条"限制"背后都是一个真实的运行环境问题。猫抓的大部分聪明设计，都是被限制逼出来的解，而不是炫技——比如为了绕过 sandbox 阻断而重写 iframe 节点的处理逻辑，这类补丁在代码里俯拾皆是。

给数据分级，而不是一刀切持久化。瞬时数据放高性能区，可再生数据丢了就重抓；只有配置这种"丢不起"的东西，才值得放进持久存储。分清"丢得起"和"丢不起"，能省掉一大半存储架构的复杂度。

把社区治理也做成工程。许可证策略、i18n 同步脚本、拒绝抓取的 Opt-Out 清单——这些不是文档，是代码，是可以被版本管理和持续演进的资产。

最后留一个开放问题：Chrome 已经不止一次收紧 Service Worker 的存活策略，假如某天"心跳保活"这类技巧被彻底堵死，猫抓的监听架构该往哪里走？嗅探这个行当，大概永远在与平台的"不许"赛跑——而这恰恰是它最迷人的地方。

【免费下载链接】cat-catch猫抓 浏览器资源嗅探扩展 / cat-catch Browser Resource Sniffing Extension项目地址: https://gitcode.com/GitHub_Trending/ca/cat-catch