比官方 /usage 页面更精确的秘密：Claude Counter 如何从 SSE 流读取未取整的真实配额

比官方 /usage 页面更精确的秘密：Claude Counter 如何从 SSE 流读取未取整的真实配额

【免费下载链接】claude-counterA minimal browser extension that shows token count, cache timer, and usage bars on claude.ai.项目地址: https://gitcode.com/gh_mirrors/cl/claude-counter

Claude Counter是一款极简浏览器扩展，在 claude.ai 侧边栏实时显示token 计数、缓存倒计时和 5 小时/7 天用量进度条。它的核心卖点，是从 Claude 的SSE 流中直接读取未取整的真实配额比例——比官方 /usage 页面的取整百分比更精确，而且数据全部留在本地，无外部服务器。

如截图所示：顶部是~19,646 tokens的上下文用量与cached for 3:49的缓存倒计时；底部则显示Session: 22.8%与Weekly: 78.5%——注意，这里的百分比带有小数位，这正是 SSE 数据的"指纹"。

为什么官方 /usage 页面的百分比"不够真"？

打开 claude.ai 的 /usage 页面，你看到的 5 小时和 7 天用量都是取整后的整数百分比（如 23%、79%）。这对粗略感知够用，但在以下场景会失真：

• 配额临界点判断：差 0.5% 决定是否"还能再开一轮对话"时，整数百分比帮不上忙；
• 精确预估剩余时间：22.8% 和 23% 对应的重置倒计时差异明显；
• 长对话成本感知：想尽量在缓存窗口内继续对话（缓存命中更省钱），需要尽量实时的数字。

Claude 官方其实并没有一个公开接口直接返回精确比例——但它的聊天接口在每次生成回复时，会顺带把精确数据"捎带"推给前端。

从 SSE 流中捕获真实配额：三步拆解

整个抓取逻辑集中在 src/injected/bridge.js，核心只有三步。

1️⃣ 抢在页面框架之前包装fetch

扩展通过 manifest 注入一个运行在页面"主世界"的桥接脚本，它先保存原始的window.fetch，再替换为自己的代理函数，见 bridge.js：

• 对POST /completion或/retry_completion请求，发出cc:generation_start事件（用于切换缓存计时器状态）；
• 请求发出后，检查响应的content-type——只要包含event-stream，就认定为SSE 流并进入下一步。

2️⃣ 克隆响应体，逐行解析message_limit事件

Claude 的回复以SSE（Server-Sent Events）流式推送，数据格式是data: {...}逐行到达。桥接脚本用response.clone()复制一份流（不破坏原页面渲染），通过getReader()边读边解码，见 bridge.js：

data: {"type": "message_limit", "message_limit": {"windows": {"5h": {...}, "7d": {...}}}}

当某行的 JSON 里type等于message_limit时，脚本立刻把message_limit对象通过postMessage发给内容脚本。关键在于windows['5h']和windows['7d']中的utilization字段是一个 0~1 的原始小数（如 0.2283），同时附带 Unix 时间戳resets_at——这就是"未取整的真实配额"。

3️⃣ 内容脚本换算并渲染

main.js 中的parseUsageFromMessageLimit把小数乘以 100 得到精确百分比，并解析重置时间；随后 ui.js 把它渲染成Session: 22.8% · resets in 4h 43m这样的进度条与倒计时。

双数据源策略：SSE 为主，/usage 兜底

只靠 SSE 有个盲区：你不发消息时，SSE 不会触发。Claude Counter 因此设计了三层刷新机制，见 main.js：

窗口翻转的检测很巧妙：main.js 的tick()每秒检查一次，一旦发现当前时间超过resets_at，就主动请求一次 /usage 接口刷新——因为翻转时刻 SSE 大概率不会自己触发。

隐私方面值得强调：扩展只向 claude.ai 发请求，无任何外部服务器，详见 README.md 的 Privacy 章节。

顺带看看另外两个"小功能"

• Token 计数：内置o200k_base分词器（vendored 在 src/vendor/o200k_base.js），沿对话"主干"累加消息 token，配合 20 万上下文上限画出迷你进度条，核心逻辑在 tokens.js；
• 缓存计时器：基于最后一条助手消息的时间加 5 分钟缓存窗口（定义于 constants.js），倒计时归零前继续对话可享受缓存价格。

如何安装 Claude Counter

支持三种方式（Chrome / Edge / Firefox / 油猴）：

1. Chrome / Edge / Chromium：下载 release 的claude-counter-0.4.2.zip，打开chrome://extensions开启"开发者模式"，把 zip 直接拖进页面即可；
2. Firefox：下载.xpi文件，拖入任意 Firefox 窗口点击"添加"；
3. 油猴用户脚本：无需装扩展，安装 claude-counter.user.js 即可，它通过document-start在页面加载前接管fetch，实现与扩展版一致的 SSE 捕获。

如果习惯本地构建，可克隆仓库：

git clone https://gitcode.com/gh_mirrors/cl/claude-counter

小结

Claude Counter 的"精确"并非来自什么独家接口，而是读懂了 claude.ai 自己的数据流：SSE 里的message_limit事件天然携带未取整的utilization小数，扩展只是忠实地把它接了出来。对想精打细算使用额度的用户来说，这个 22.8% 和 23% 之间的差距，就是它存在的意义。

【免费下载链接】claude-counterA minimal browser extension that shows token count, cache timer, and usage bars on claude.ai.项目地址: https://gitcode.com/gh_mirrors/cl/claude-counter