<?xml version="1.0" encoding="UTF-8"?><rss version="2.0" xmlns:content="http://purl.org/rss/1.0/modules/content/"><channel><title>Suohx</title><description>个人博客</description><link>https://blog.suohx.org/</link><language>zh_CN</language><item><title>从 Workflows 说起：Claude 这五个月上线的那些新奇功能</title><link>https://blog.suohx.org/posts/claude-since-workflows/</link><guid isPermaLink="true">https://blog.suohx.org/posts/claude-since-workflows/</guid><description>以 2026 年 5 月底 Claude Code 的 Dynamic Workflows 为起点，盘点之后 Claude 陆续上线的新功能：Slack 里的 Claude Tag、走出桌面的 Cowork、重做的记忆、会“做梦”的 Dreams、Mods，以及一路从 Opus 4.8 换到 5.5 的模型。</description><pubDate>Sat, 10 Oct 2026 00:00:00 GMT</pubDate><content:encoded>&lt;p&gt;这几个月 Claude 的更新密度高到有点离谱：模型从 Opus 4.8 一路换到 5.5，中间还夹着一堆“咦，还能这样？”的功能。我按时间捋了一遍，挑出觉得&lt;strong&gt;新奇、好玩或者真的改变用法&lt;/strong&gt;的那些，起点就定在 5 月底的 Workflows。&lt;/p&gt;
&lt;blockquote&gt;
&lt;p&gt;说明：日期以 Anthropic 官方的 Release Notes 为准，文末附了来源。部分细节（比如并发数量）来自媒体报道，以官方文档为准。&lt;/p&gt;
&lt;/blockquote&gt;
&lt;h2&gt;起点：Claude Code 的 Dynamic Workflows（5 月 28 日）&lt;/h2&gt;
&lt;p&gt;5 月 28 日，Anthropic 发布 &lt;strong&gt;Claude Opus 4.8&lt;/strong&gt;，同一天 Claude Code 里的 &lt;strong&gt;Workflows（动态工作流）&lt;/strong&gt; 进入研究预览。&lt;/p&gt;
&lt;p&gt;它解决的问题很直接：一个大任务，与其让一个 Claude 从头干到尾，不如让它&lt;strong&gt;先拆任务，再派一群子 Agent 并行去干，最后自己汇总、核对结果&lt;/strong&gt;。&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;&lt;strong&gt;规模&lt;/strong&gt;：据报道，一次工作流最多调度 1000 个子 Agent，同时最多 16 个并行；&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;怎么触发&lt;/strong&gt;：在提示词里直接说 “workflow”，或者打开一个叫 ultracode 的设置，让 Claude 自己判断要不要上工作流；&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;能断点续跑&lt;/strong&gt;：执行过程中会保存进度，中断了不用从头再来；&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;会先问你&lt;/strong&gt;：真正开跑前需要确认，因为它&lt;strong&gt;非常吃 token&lt;/strong&gt;，官方也建议先拿小而明确的任务试；&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;在哪用&lt;/strong&gt;：Max、Team 和部分 Enterprise 计划，CLI、桌面端和 VS Code 插件都有。&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;有意思的是，五个月后的 &lt;strong&gt;10 月 9 日&lt;/strong&gt;，同样的能力被搬进了 API：&lt;strong&gt;Claude Managed Agents 的 dynamic workflows（beta）&lt;/strong&gt;，Agent 可以自己写一段程序，分阶段调度很多 Agent，再把结果合并，适合“审几百份文档”这种活。从 Claude Code 里的一个实验功能，变成了开发者能直接调用的平台能力。&lt;/p&gt;
&lt;h2&gt;模型这条线：五个月换了一整代&lt;/h2&gt;
&lt;p&gt;先把模型时间线列出来，后面讲功能时好对照：&lt;/p&gt;
&lt;table&gt;
&lt;thead&gt;
&lt;tr&gt;
&lt;th&gt;日期&lt;/th&gt;
&lt;th&gt;模型&lt;/th&gt;
&lt;th&gt;一句话&lt;/th&gt;
&lt;/tr&gt;
&lt;/thead&gt;
&lt;tbody&gt;
&lt;tr&gt;
&lt;td&gt;5 月 28 日&lt;/td&gt;
&lt;td&gt;Opus 4.8&lt;/td&gt;
&lt;td&gt;Workflows 的同期模型，自适应思考，只在需要时才深想&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;6 月 9 日&lt;/td&gt;
&lt;td&gt;Fable 5 / Mythos 5&lt;/td&gt;
&lt;td&gt;Mythos 级别的能力，Fable 5 是“可以安全地给大众用”的那一版&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;6 月 30 日&lt;/td&gt;
&lt;td&gt;Sonnet 5&lt;/td&gt;
&lt;td&gt;官方说是最“Agent 化”的 Sonnet&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;7 月 24 日&lt;/td&gt;
&lt;td&gt;Opus 5&lt;/td&gt;
&lt;td&gt;接近 Fable 5 的水平，价格减半&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;9 月 1 日&lt;/td&gt;
&lt;td&gt;Fable 5.1 / Mythos 5.1&lt;/td&gt;
&lt;td&gt;Mythos 5.1 只给 Project Glasswing 的参与方&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;9 月 22 日&lt;/td&gt;
&lt;td&gt;Opus 5.5&lt;/td&gt;
&lt;td&gt;5.5 家族第一位，运行成本比 Opus 5 低 40%&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;9 月 28 日&lt;/td&gt;
&lt;td&gt;Sonnet 5.5&lt;/td&gt;
&lt;td&gt;更快更便宜的搭档&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;10 月 7 日&lt;/td&gt;
&lt;td&gt;Haiku 5.5&lt;/td&gt;
&lt;td&gt;最便宜最快的小模型，也有 1M 上下文&lt;/td&gt;
&lt;/tr&gt;
&lt;/tbody&gt;
&lt;/table&gt;
&lt;p&gt;中间还有个小插曲：&lt;strong&gt;6 月 12 日 Fable 5 和 Mythos 5 的访问被暂停，7 月 1 日才恢复&lt;/strong&gt;。另外，新一代模型基本都把“思考”变成了默认开启、自动决定深浅，开发者能调的主要是 effort（努力程度）这个旋钮。&lt;/p&gt;
&lt;p&gt;下面是功能部分。&lt;/p&gt;
&lt;h2&gt;1. 在 Slack 里 @Claude：Claude Tag（6 月 23 日）&lt;/h2&gt;
&lt;p&gt;Team 和 Enterprise 用户可以在 Slack 的对话里&lt;strong&gt;直接 @Claude，把事情丢给它办&lt;/strong&gt;。9 月 24 日又加了 beta 的“个人连接器”：在频道里提的请求，Claude 可以用&lt;strong&gt;你自己&lt;/strong&gt;授权的日历、网盘之类去完成，回复可以先让你过目再发，也可以自动发。&lt;/p&gt;
&lt;p&gt;这个思路挺妙的：Claude 不再只是一个你要专门打开的网页，而是&lt;strong&gt;混在群聊里的一个同事&lt;/strong&gt;。&lt;/p&gt;
&lt;h2&gt;2. 在原地改 Claude 写的草稿（6 月 12 日）&lt;/h2&gt;
&lt;p&gt;Claude 在聊天或 Cowork 里写的草稿，会在对话旁边打开。你可以&lt;strong&gt;直接选中一段文字，让它只改这一段&lt;/strong&gt;，不用再复制粘贴、描述“第三段第二句改一下”。&lt;/p&gt;
&lt;p&gt;功能不大，但很符合直觉，用起来就回不去了。&lt;/p&gt;
&lt;h2&gt;3. Cowork 走出桌面，再走进每个对话（7 月 7 日 → 9 月 16 日）&lt;/h2&gt;
&lt;p&gt;Cowork 可以理解为“让 Claude 帮你干活的工作模式”，以前只在桌面端有：&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;&lt;strong&gt;7 月 7 日&lt;/strong&gt;：扩展到&lt;strong&gt;网页和手机&lt;/strong&gt;，会话存在账号里，换设备能接着干；&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;9 月 16 日&lt;/strong&gt;：更进一步，&lt;strong&gt;任何一个普通对话里都能直接用 Cowork&lt;/strong&gt;，聊天、任务、项目、连接器、Skills 都打通了（Pro 和 Max 逐步开放）。&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;同一天还有一个我很喜欢的更新：&lt;strong&gt;在任何对话里都能直接让 Claude 做设计稿、幻灯片和文档&lt;/strong&gt;，Artifacts 标签页对所有计划开放，包括免费用户。&lt;/p&gt;
&lt;h2&gt;4. 记忆重做了，还多了个“月度回顾”（7 月）&lt;/h2&gt;
&lt;ul&gt;
&lt;li&gt;&lt;strong&gt;7 月 9 日&lt;/strong&gt;：设置里多了 &lt;strong&gt;Reflect（月度回顾）&lt;/strong&gt;，像年度报告一样告诉你这个月聊了哪些话题、使用习惯是什么样；同时加了 &lt;strong&gt;Time and focus&lt;/strong&gt;，可以设&lt;strong&gt;休息提醒&lt;/strong&gt;和&lt;strong&gt;安静时段&lt;/strong&gt;。一个 AI 产品主动提醒你别用太久，挺少见的。&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;7 月 10 日&lt;/strong&gt;：记忆从“每天一份摘要”改成了&lt;strong&gt;一条条分好类的独立记忆&lt;/strong&gt;，更容易看清它记住了什么。&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;8 月 25 日&lt;/strong&gt;：记忆打通到 Cowork，可以按话题编辑；&lt;strong&gt;敏感话题默认不进记忆&lt;/strong&gt;，除非你手动打开。&lt;/li&gt;
&lt;/ul&gt;
&lt;h2&gt;5. 会“做梦”的 Agent：Dreams（研究预览）&lt;/h2&gt;
&lt;p&gt;这是我觉得名字起得最浪漫的一个功能。&lt;strong&gt;Dreams&lt;/strong&gt; 是给开发者的 Agent 记忆功能：它会&lt;strong&gt;回看过去的会话记录，重新整理 Agent 的记忆库&lt;/strong&gt;，就像人睡觉时整理白天的记忆一样。&lt;/p&gt;
&lt;p&gt;它 5 月就开始研究预览，之后陆续支持了 Opus 5、Fable 5、Sonnet 5，到 10 月 1 日已经支持 Opus 5.5、Fable 5.1 和 Sonnet 5.5。&lt;/p&gt;
&lt;h2&gt;6. 操作电脑和浏览器：正式可用（8 月 19 日）&lt;/h2&gt;
&lt;p&gt;&lt;strong&gt;Computer use 工具集正式 GA&lt;/strong&gt;，同时新推出了 &lt;strong&gt;Browser use 工具&lt;/strong&gt;。开发者的应用可以让 Claude 操作一个浏览器：读页面、点元素、填表单、管理标签页。10 月 7 日，Python 和 TypeScript SDK 又加了现成的工具类，每个工具只要实现一个方法，循环和审批回调由 SDK 处理。&lt;/p&gt;
&lt;p&gt;“让 AI 帮你点网页”这件事，从炫技 demo 变成了正经可用的积木。&lt;/p&gt;
&lt;h2&gt;7. 给 Claude Code 装“模组”：Mods（10 月 1 日）&lt;/h2&gt;
&lt;p&gt;这个名字很游戏玩家。&lt;strong&gt;Mods&lt;/strong&gt; 是一些小小的 TypeScript 函数，可以&lt;strong&gt;改写提示词、加界面元素，甚至替换 Claude Code 的内置功能&lt;/strong&gt;，然后打包进插件分享给别人。&lt;/p&gt;
&lt;p&gt;再加上 9 月 25 日上线的&lt;strong&gt;插件开发者门户&lt;/strong&gt;（可以把插件提交到官方目录、看使用数据），Claude 的插件生态开始有点像游戏模组社区了。&lt;/p&gt;
&lt;h2&gt;8. 直接在 Google 文档、表格、幻灯片里用 Claude（10 月 6 日）&lt;/h2&gt;
&lt;p&gt;&lt;strong&gt;Claude for Google Workspace&lt;/strong&gt; 进入公开测试：一个侧边栏插件，能在 Docs、Sheets、Slides 里直接干活，改动要你批准才会生效。同时还有对应的连接器，在聊天里就能新建和编辑 Google 文件。&lt;/p&gt;
&lt;p&gt;此前 7 月 7 日，Microsoft 365 连接器也加了写入能力：可以起草、发送、整理邮件，管理日程，更新 OneDrive / SharePoint 里的文件。两大办公套件都打通了。&lt;/p&gt;
&lt;h2&gt;9. 一个很实在的福利：订阅送 API 额度（10 月 7 日）&lt;/h2&gt;
&lt;p&gt;&lt;strong&gt;Max 和 Team 计划开始每月附带 API 额度&lt;/strong&gt;，在账单设置里关联 Claude Console 组织就能领。对个人开发者来说，这意味着订阅之外，还能免费跑点自己的小应用和 Agent。&lt;/p&gt;
&lt;h2&gt;写在最后&lt;/h2&gt;
&lt;p&gt;把这五个月连起来看，Claude 的变化方向挺清晰的：&lt;/p&gt;
&lt;ol&gt;
&lt;li&gt;&lt;strong&gt;从“一个助手”到“一群 Agent”&lt;/strong&gt;：Workflows 让 Claude 自己当包工头，Managed Agents 把这件事开放给开发者；&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;从“你来找它”到“它在你那儿”&lt;/strong&gt;：Slack、Google Workspace、Microsoft 365、手机，Claude 正在钻进你本来就在用的工具里；&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;从“记住你”到“好好地记住你”&lt;/strong&gt;：记忆可见、可编辑、能避开敏感话题，还会提醒你休息。&lt;/li&gt;
&lt;/ol&gt;
&lt;p&gt;顺便一提，这篇文章本身就是我让 Claude Code 帮忙查资料、起草的，发布在用 Astro + Sveltia CMS 搭的这个新博客上。从 Workflows 到现在，它确实越来越像一个能一起干活的伙伴了。&lt;/p&gt;
&lt;h2&gt;参考来源&lt;/h2&gt;
&lt;ul&gt;
&lt;li&gt;&lt;a href=&quot;https://support.claude.com/en/articles/12138966-release-notes&quot;&gt;Claude 官方 Release Notes（Help Center）&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;https://platform.claude.com/docs/en/release-notes/overview&quot;&gt;Claude Platform 官方 Release Notes&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;https://www.infoq.com/news/2026/06/dynamic-workflows-claude-code/&quot;&gt;InfoQ：Claude Code Adds Dynamic Workflows for Parallel Agent Coordination&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;https://www.testingcatalog.com/anthropic-launches-dynamic-workflows-for-claude-code/&quot;&gt;TestingCatalog：Anthropic launches dynamic workflows for Claude Code&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;https://winbuzzer.com/2026/05/29/anthropic-ships-opus-48-with-dynamic-workflows-xcxwbn/&quot;&gt;WinBuzzer：Anthropic Ships Opus 4.8 with New Dynamic Workflow Feature&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;https://claude.com/resources/articles/claude-code-mods&quot;&gt;Claude Code Mods&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;https://claude.com/resources/articles/claude-now-works-in-google-docs-sheets-and-slides&quot;&gt;Claude now works in Google Docs, Sheets and Slides&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;https://claude.com/resources/articles/claude-tag-now-supports-personal-connectors-in-channels&quot;&gt;Claude Tag supports personal connectors in channels&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;
</content:encoded></item><item><title>webmuic：给自己做一个聚合网易云和 QQ 音乐的本地播放器</title><link>https://blog.suohx.org/posts/webmuic/</link><guid isPermaLink="true">https://blog.suohx.org/posts/webmuic/</guid><description>一个只跑在本机的 WebUI 音乐播放器：用一个网关聚合网易云音乐与 QQ 音乐，凭证不出本机，附带奶白复古风改版与一次性能翻车记录。</description><pubDate>Sat, 10 Oct 2026 00:00:00 GMT</pubDate><content:encoded>&lt;p&gt;歌单散落在两个平台，是很多人的日常：一首歌网易云没版权，就去 QQ 音乐找；QQ 音乐上的红心歌单又和网易云的对不上。两个客户端来回切，界面风格各异，广告和推荐流也越来越重。&lt;/p&gt;
&lt;p&gt;于是我给自己写了一个 &lt;strong&gt;webmuic&lt;/strong&gt;——一个只跑在本机的 WebUI 音乐播放器，把网易云音乐和 QQ 音乐放进同一个界面里搜、听、收藏。&lt;/p&gt;
&lt;blockquote&gt;
&lt;p&gt;项目地址：&lt;a href=&quot;https://github.com/suohx1415-beep/webmuic&quot;&gt;https://github.com/suohx1415-beep/webmuic&lt;/a&gt;&lt;/p&gt;
&lt;/blockquote&gt;
&lt;h2&gt;一句话定位&lt;/h2&gt;
&lt;p&gt;&lt;strong&gt;本机自用、只绑 &lt;code&gt;127.0.0.1&lt;/code&gt;、凭证绝不出本机。&lt;/strong&gt; 它不是一个要部署到服务器上给别人用的服务，而是一个打开浏览器就能用的「私人唱片室」。&lt;/p&gt;
&lt;h2&gt;整体架构&lt;/h2&gt;
&lt;pre&gt;&lt;code&gt;浏览器 WebUI  http://127.0.0.1:5173   (Vue 3 + Vite + Pinia)
      │  同源 /api（Vite 代理）
      ▼
网关          http://127.0.0.1:8787   (Express + TypeScript)
      ├── 网易云后端  http://127.0.0.1:3010   NeteaseCloudMusicApi
      └── QQ 音乐后端 http://127.0.0.1:3200   Rain120/qq-music-api（打了补丁）
&lt;/code&gt;&lt;/pre&gt;
&lt;p&gt;一共四个进程，&lt;code&gt;pnpm dev&lt;/code&gt; 会按 网易云 → QQ → 网关 → 前端 的顺序依次拉起，并等每个端口真正就绪再启动下一个。Windows 上也准备了双击即用的 &lt;code&gt;install-windows.bat&lt;/code&gt; / &lt;code&gt;start-windows.bat&lt;/code&gt;。&lt;/p&gt;
&lt;h3&gt;为什么要有一个网关&lt;/h3&gt;
&lt;p&gt;最初的想法很简单：前端直接调两个开源的音乐 API 后端不就行了？真做起来发现中间必须有一层，理由有三个：&lt;/p&gt;
&lt;ol&gt;
&lt;li&gt;&lt;strong&gt;凭证隔离。&lt;/strong&gt; 平台 Cookie 是账号的全部权限，绝不能交给浏览器。网关把它放在本地文件里（权限 600、已 gitignore），网易云的 cookie 由网关逐请求注入，QQ 的 cookie 写进一个文件让 QQ 后端热读取。对前端只暴露 SHA256 的前 8 位指纹，用来显示「已登录」。&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;两个平台的数据长得完全不一样。&lt;/strong&gt; 网关里的适配器把两边的响应归一化成同一套 &lt;code&gt;Track&lt;/code&gt; / &lt;code&gt;Playlist&lt;/code&gt; / &lt;code&gt;Album&lt;/code&gt; / &lt;code&gt;Artist&lt;/code&gt;，曲目 ID 统一成 &lt;code&gt;平台:平台内ID&lt;/code&gt;，比如 &lt;code&gt;netease:2652820720&lt;/code&gt;、&lt;code&gt;qq:0039MnYb0qxYhV&lt;/code&gt;。音质也抽象成 &lt;code&gt;standard / high / lossless / hires&lt;/code&gt; 四档，由适配器映射到各自平台的参数。&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;音频要走代理。&lt;/strong&gt; 平台 CDN 有防盗链，直链也不该暴露给前端。网关的 &lt;code&gt;/stream&lt;/code&gt; 只放行白名单里的 CDN 域名，只透传 Range、Content-Type 这类播放需要的响应头。&lt;/li&gt;
&lt;/ol&gt;
&lt;h3&gt;别把平台打急了：限速、合并与熔断&lt;/h3&gt;
&lt;p&gt;聚合搜索很容易一下子打出一串上游请求。网关里做了三件事：&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;&lt;strong&gt;令牌桶限速&lt;/strong&gt;：网易云每秒 3 个、QQ 每秒 2 个，带少量突发。&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;SingleFlight&lt;/strong&gt;：同一时刻相同的请求只发一次，结果共享。&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;熔断冷却&lt;/strong&gt;：上游连续 5 次异常就进入 3 分钟冷却，界面上会提示「某平台暂时不可用」，另一个平台照常工作。&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;播放地址解析结果缓存 30 分钟（LRU + TTL，纯内存）。如果 CDN 返回 403——地址过期了但缓存还没到期——就清掉这首歌所有音质档位的缓存，重新解析一次。&lt;/p&gt;
&lt;h3&gt;给上游 QQ 后端打补丁&lt;/h3&gt;
&lt;p&gt;QQ 音乐这边用的是开源的 &lt;code&gt;Rain120/qq-music-api&lt;/code&gt;，但直接用有几个问题，所以项目里有一个 &lt;code&gt;scripts/patch-qq-backend.mjs&lt;/code&gt;，自动打 6 处补丁：&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;强制只监听 &lt;code&gt;127.0.0.1&lt;/code&gt;，端口可由环境变量配置；&lt;/li&gt;
&lt;li&gt;新增从本地文件热读取 cookie 的逻辑，并在请求上游时带上 Cookie 头，换 cookie 不用重启；&lt;/li&gt;
&lt;li&gt;uin 从 cookie 中动态提取；&lt;/li&gt;
&lt;li&gt;把已经失效的搜索接口替换成可用的那个。&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;打完会留下一个 &lt;code&gt;.webmuic-patched&lt;/code&gt; 标记，启动脚本会检查它。&lt;/p&gt;
&lt;h2&gt;前端：一些值得一提的细节&lt;/h2&gt;
&lt;p&gt;前端是 Vue 3 Composition API + Pinia，&lt;strong&gt;没有用任何大型 UI 库&lt;/strong&gt;，样式全部手写。&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;&lt;strong&gt;同步歌词&lt;/strong&gt;：毫秒级同步、自动滚动、点击任意一句跳转，支持双语翻译和逐字卡拉 OK 高亮。&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;一键跳到副歌&lt;/strong&gt;：播放栏上有「高潮」按钮，进度条上标出副歌位置，赶时间的时候直接听最好听的那段。&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;均衡器&lt;/strong&gt;：基于 Web Audio 的 9 段 EQ 加低音增强，带几组预设。这里有个坑：&lt;code&gt;createMediaElementSource&lt;/code&gt; 对同一个 &lt;code&gt;&amp;lt;audio&amp;gt;&lt;/code&gt; 只能调用一次，而且非同源、没有 CORS 的音源接进来之后会&lt;strong&gt;直接静音&lt;/strong&gt;——这也是为什么音频必须走网关的同源代理。&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;离线缓存&lt;/strong&gt;：喜欢的歌可以存进 IndexedDB，下次播放优先从本地读。&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;Media Session 与快捷键&lt;/strong&gt;：系统媒体键、锁屏控制都能用，还有一个画中画桌面歌词。&lt;/li&gt;
&lt;/ul&gt;
&lt;h2&gt;最近一次改版：奶白复古风&lt;/h2&gt;
&lt;p&gt;最早的界面是深色「录音棚」风，后来试过一版蓝紫色的「月光唱片室」。这次彻底换成了&lt;strong&gt;奶白复古风&lt;/strong&gt;：&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;浅色是暖奶白的纸张底色，配赤陶色强调；深色是暖炭灰配浅赤陶；&lt;/li&gt;
&lt;li&gt;标题用衬线体，界面上叠了一层很淡的纸张颗粒；&lt;/li&gt;
&lt;li&gt;发现页的头图换成一幅复古条纹落日，四个榜单卡片用青、芥黄、橄榄、铁锈四种做旧色；&lt;/li&gt;
&lt;li&gt;歌词全屏页换成羊皮纸色，没有封面时会显示一张黑胶唱片。&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;改版时顺手把散落在各个组件里的硬编码颜色全部收进了一个 &lt;code&gt;theme.css&lt;/code&gt; 的设计令牌里，以后调色只改一个文件。&lt;/p&gt;
&lt;h3&gt;一次小小的性能翻车&lt;/h3&gt;
&lt;p&gt;改完一打开——好慢。量了一下，首屏要 2.4 秒，整页加载 8.7 秒。罪魁祸首有两个：&lt;/p&gt;
&lt;ol&gt;
&lt;li&gt;&lt;strong&gt;远程中文字体。&lt;/strong&gt; Google Fonts 会把思源黑体、思源宋体切成几十个分片，每片在我这儿要 5~6 秒。&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;网易云封面默认是原图&lt;/strong&gt;，单张最大 845KB，首页一次要几十张。&lt;/li&gt;
&lt;/ol&gt;
&lt;p&gt;解决办法都很朴素：中文字体改用本机已装的字体，只保留体积很小的英文衬线体；网易云封面按显示尺寸加上 &lt;code&gt;?param=96y96&lt;/code&gt; 这样的参数请求缩略图，列表小图从几百 KB 降到几 KB。改完首屏 1.0 秒，整页 2.5 秒。&lt;/p&gt;
&lt;h2&gt;关于安全的几条底线&lt;/h2&gt;
&lt;p&gt;因为要处理真实账号的 Cookie，项目从一开始就定了几条不能破的规矩：&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;所有进程&lt;strong&gt;只绑定 &lt;code&gt;127.0.0.1&lt;/code&gt;&lt;/strong&gt;，包括 Vite 开发服务器；&lt;/li&gt;
&lt;li&gt;凭证只存在网关的本地文件里，&lt;strong&gt;永远不下发前端&lt;/strong&gt;，前端的 localStorage 里也不存任何凭证；&lt;/li&gt;
&lt;li&gt;音频代理只允许已知 CDN 域名，防止被当成任意 URL 的跳板。&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;开源前我还对全部提交历史做了一次密钥扫描，确认没有任何真实 Cookie 或 token 进过仓库。&lt;/p&gt;
&lt;h2&gt;写在最后&lt;/h2&gt;
&lt;p&gt;webmuic 不是什么宏大的项目，它只是解决了我自己每天都会遇到的一点小麻烦：&lt;strong&gt;在一个干净、安静、属于自己的界面里，听两个平台上的歌。&lt;/strong&gt;&lt;/p&gt;
&lt;p&gt;如果你也有类似的困扰，欢迎去 GitHub 看看。&lt;/p&gt;
&lt;blockquote&gt;
&lt;p&gt;声明：本项目仅供个人学习与本机自用，音乐版权归各平台及版权方所有，请勿用于任何商业或分发用途。&lt;/p&gt;
&lt;/blockquote&gt;
</content:encoded></item><item><title>Hark 使用指南：注册、登录与连接账户</title><link>https://blog.suohx.org/posts/hark-guide/</link><guid isPermaLink="true">https://blog.suohx.org/posts/hark-guide/</guid><pubDate>Wed, 07 Oct 2026 00:00:00 GMT</pubDate><content:encoded>&lt;p&gt;Hark 是一个&quot;帮你把事情办完&quot;的 AI 系统：你用聊天的方式交代任务，它会搜索、比较、填表、下单，甚至操作网页。这篇记录一下从注册到连接账户的完整流程。&lt;/p&gt;
&lt;h2&gt;1. 注册 / 登录&lt;/h2&gt;
&lt;p&gt;打开 hark.com（或手机上的 Hark App），首页就是登录界面：&lt;/p&gt;
&lt;p&gt;&lt;img src=&quot;/images/posts/hark-signup.jpg&quot; alt=&quot;Hark 登录页&quot; /&gt;&lt;/p&gt;
&lt;p&gt;三种方式任选其一：&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;&lt;strong&gt;Continue with Google&lt;/strong&gt;：用 Google 账号一键登录，最省事；&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;Continue with Apple&lt;/strong&gt;：用 Apple ID 登录；&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;邮箱或手机号&lt;/strong&gt;：在输入框填写后点 Continue，按提示输入收到的验证码。&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;第一次登录即自动完成注册，不需要单独设置密码。&lt;/p&gt;
&lt;h2&gt;2. 熟悉界面&lt;/h2&gt;
&lt;p&gt;登录后主要有几个地方：&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;&lt;strong&gt;Chat（聊天）&lt;/strong&gt;：直接用中文或英文说需求，比如&quot;帮我找下周去上海的机票&quot;；&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;Home（左上角房子图标）&lt;/strong&gt;：放置可随时查看的面板，例如包裹追踪、价格监控；&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;Projects（项目）&lt;/strong&gt;：把长期、多步骤的事情（装修、旅行、求职）单独放在一个项目里；&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;右上角头像&lt;/strong&gt;：设置、账单、已连接账户、定时任务等。&lt;/li&gt;
&lt;/ul&gt;
&lt;h2&gt;3. 连接账户&lt;/h2&gt;
&lt;p&gt;连接账户后，Hark 才能结合你的邮件、日历等信息帮你办事。&lt;/p&gt;
&lt;ol&gt;
&lt;li&gt;点右上角 &lt;strong&gt;头像 → Connected accounts（已连接账户）&lt;/strong&gt;；&lt;/li&gt;
&lt;li&gt;选择要连接的服务，例如 Google（Gmail、日历、云端硬盘）、GitHub、Slack 等；&lt;/li&gt;
&lt;li&gt;按跳转的授权页面登录并同意授权；&lt;/li&gt;
&lt;li&gt;回到 Hark，看到账户显示为已连接即可。&lt;/li&gt;
&lt;/ol&gt;
&lt;p&gt;也可以直接在聊天里说&quot;帮我连接 Gmail&quot;，Hark 会弹出连接卡片。&lt;/p&gt;
&lt;blockquote&gt;
&lt;p&gt;提示：其他网站的登录（例如某个购物网站）不需要提前连接。需要时 Hark 会弹出 &lt;strong&gt;Hark Secured Login&lt;/strong&gt; 表单，密码保存在加密保险库里，不会出现在聊天记录中。&lt;/p&gt;
&lt;/blockquote&gt;
&lt;h2&gt;4. 让 Hark 干活&lt;/h2&gt;
&lt;p&gt;几个我实际用过的例子：&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;整理 Gmail 里的促销邮件并退订；&lt;/li&gt;
&lt;li&gt;在 Cloudflare 后台创建 API Token、配置服务；&lt;/li&gt;
&lt;li&gt;部署这个博客（过程见另一篇文章）。&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;需要操作网页时，Hark 会在自己的云端浏览器里完成（Handoff），遇到登录或验证码会在聊天里问你。涉及付款、对外发送消息等操作时，它会先让你确认。&lt;/p&gt;
&lt;h2&gt;5. 小建议&lt;/h2&gt;
&lt;ul&gt;
&lt;li&gt;需求说得越具体越好：时间、预算、地点、偏好；&lt;/li&gt;
&lt;li&gt;重复的事可以让它设成定时任务；&lt;/li&gt;
&lt;li&gt;不想让它记住的内容，直接说&quot;忘掉 XX&quot;。&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;就这么简单，注册完把手头的待办丢给它试试吧。&lt;/p&gt;
</content:encoded></item><item><title>部署过程：用 Cloudflare 免费搭建带后台的博客</title><link>https://blog.suohx.org/posts/deploy-rin-on-cloudflare/</link><guid isPermaLink="true">https://blog.suohx.org/posts/deploy-rin-on-cloudflare/</guid><pubDate>Wed, 07 Oct 2026 00:00:00 GMT</pubDate><content:encoded>&lt;p&gt;这个博客使用开源项目 &lt;a href=&quot;https://github.com/openRin/Rin&quot;&gt;Rin&lt;/a&gt;，跑在 Cloudflare 上，全程免费。记录一下部署过程和踩过的坑。&lt;/p&gt;
&lt;h2&gt;为什么选 Rin&lt;/h2&gt;
&lt;p&gt;一开始用的是静态博客 Fuwari（Astro），但它没有后台，发文章要改代码再重新部署。我想要的是：&lt;/p&gt;
&lt;ul&gt;
&lt;li&gt;有后台，账号密码登录；&lt;/li&gt;
&lt;li&gt;浏览器里直接写文章、传图；&lt;/li&gt;
&lt;li&gt;能部署在 Cloudflare，不用自己的服务器。&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;Rin 正好满足：前端 React，后端 Cloudflare Workers（Hono），数据库用 D1（SQLite），MIT 开源。WordPress 需要 PHP + MySQL 服务器，不适合 Cloudflare，排除。&lt;/p&gt;
&lt;h2&gt;准备工作&lt;/h2&gt;
&lt;ul&gt;
&lt;li&gt;一个 Cloudflare 账户，域名 &lt;code&gt;suohx.org&lt;/code&gt; 已托管在 Cloudflare；&lt;/li&gt;
&lt;li&gt;一个 API Token（Workers、Pages、D1、DNS 等权限），用于命令行部署。&lt;/li&gt;
&lt;/ul&gt;
&lt;h2&gt;坑 1：命令行连不上 Cloudflare API&lt;/h2&gt;
&lt;p&gt;官方流程是 &lt;code&gt;bun install&lt;/code&gt; 后执行 &lt;code&gt;bun run deploy&lt;/code&gt;，脚本会用 wrangler 自动创建 D1、队列和 Worker。但我的部署环境访问 &lt;code&gt;api.cloudflare.com&lt;/code&gt; 一直失败，wrangler 无法使用。&lt;/p&gt;
&lt;h2&gt;坑 2：GitHub Actions 路线也走不通&lt;/h2&gt;
&lt;p&gt;Rin 自带 GitHub Actions 部署流程（fork 仓库 → 填 Secrets → 运行 Build/Deploy）。但我使用的自动化授权没有 fork 和设置 Secrets 的权限，需要手动在手机上点很多步，放弃。&lt;/p&gt;
&lt;h2&gt;最终方案：控制台拖拽上传（Pages 高级模式）&lt;/h2&gt;
&lt;p&gt;Cloudflare Pages 的拖拽上传支持根目录放一个 &lt;code&gt;_worker.js&lt;/code&gt;（Advanced mode），它会接管所有请求，静态文件通过 &lt;code&gt;env.ASSETS&lt;/code&gt; 提供。Rin 的后端正好就是这么读静态资源的，于是：&lt;/p&gt;
&lt;ol&gt;
&lt;li&gt;&lt;strong&gt;本地构建前端&lt;/strong&gt;：&lt;code&gt;cd client &amp;amp;&amp;amp; bun run build&lt;/code&gt;，产物在 &lt;code&gt;dist/client&lt;/code&gt;；&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;打包后端&lt;/strong&gt;：用 &lt;code&gt;wrangler deploy --dry-run --outdir&lt;/code&gt; 把 &lt;code&gt;server/src/_worker.ts&lt;/code&gt; 打成单文件 &lt;code&gt;_worker.js&lt;/code&gt;（这一步不需要联网）；&lt;/li&gt;
&lt;li&gt;把 &lt;code&gt;_worker.js&lt;/code&gt; 放进 &lt;code&gt;dist/client&lt;/code&gt; 根目录，整体压缩成 zip；&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;合并数据库迁移&lt;/strong&gt;：把 &lt;code&gt;server/sql/0000~0012.sql&lt;/code&gt; 合并成一份建表 SQL，并写入 &lt;code&gt;migration_version = 12&lt;/code&gt;；&lt;/li&gt;
&lt;li&gt;控制台 &lt;strong&gt;D1 → 创建数据库 &lt;code&gt;rin&lt;/code&gt;&lt;/strong&gt;，在 Console 里执行上面的 SQL；&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;Workers &amp;amp; Pages → 创建 → Pages → 上传资产&lt;/strong&gt;，项目名 &lt;code&gt;suohx-blog&lt;/code&gt;，上传 zip；&lt;/li&gt;
&lt;li&gt;项目 &lt;strong&gt;设置&lt;/strong&gt;：
&lt;ul&gt;
&lt;li&gt;绑定 D1：变量名 &lt;code&gt;DB&lt;/code&gt; → 数据库 &lt;code&gt;rin&lt;/code&gt;；&lt;/li&gt;
&lt;li&gt;兼容性日期 &lt;code&gt;2026-01-20&lt;/code&gt;；&lt;/li&gt;
&lt;li&gt;环境变量：&lt;code&gt;NAME&lt;/code&gt;、&lt;code&gt;DESCRIPTION&lt;/code&gt;、&lt;code&gt;FRONTEND_URL&lt;/code&gt;、&lt;code&gt;CACHE_STORAGE_MODE=database&lt;/code&gt;、&lt;code&gt;ADMIN_USERNAME&lt;/code&gt;；&lt;/li&gt;
&lt;li&gt;加密 Secret：&lt;code&gt;ADMIN_PASSWORD&lt;/code&gt;、&lt;code&gt;JWT_SECRET&lt;/code&gt;（随机 64 位十六进制）；&lt;/li&gt;
&lt;/ul&gt;
&lt;/li&gt;
&lt;li&gt;重新上传一次 zip，让配置生效；&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;自定义域&lt;/strong&gt; 添加 &lt;code&gt;suohx.org&lt;/code&gt;，Cloudflare 自动生成 CNAME 指向 &lt;code&gt;suohx-blog.pages.dev&lt;/code&gt;。&lt;/li&gt;
&lt;/ol&gt;
&lt;h2&gt;几点说明&lt;/h2&gt;
&lt;ul&gt;
&lt;li&gt;&lt;strong&gt;不需要 R2&lt;/strong&gt;：图片存储（R2/S3）是可选的，缓存改用 &lt;code&gt;database&lt;/code&gt; 模式即可；不过后台上传图片需要配置对象存储，目前文章里的图片放在静态目录。&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;队列可选&lt;/strong&gt;：Rin 的任务队列只用于 AI 摘要等后台任务，不配置不影响写文章和评论。&lt;/li&gt;
&lt;li&gt;&lt;strong&gt;管理员账号&lt;/strong&gt;：Rin 用环境变量里的用户名密码登录，首次登录自动创建管理员。&lt;/li&gt;
&lt;/ul&gt;
&lt;h2&gt;结果&lt;/h2&gt;
&lt;p&gt;部署完成后访问首页就能看到博客，右上角登录后即可写文章。这篇文章就是通过后台 API 发布的。&lt;/p&gt;
</content:encoded></item></channel></rss>