企业官网建设流程全解析

• AI Agent
• 人工智能
• 代码智能体
• 交互助手

本文基于仓库中 changelog/unreleased.md 记录的下一个未发布版本内容，结合packages/ui、packages/sdk的源码与测试，逐条拆解 OpenChamber 即将带来的三大核心能力——会话时间线视图、让扩展接管 Agent 浏览器的 Service 协议、以及可直接在应用内预览音视频 / CSV / 字体 / 图表等非文本文件的能力，同时覆盖移动端、桌面端与 VS Code 扩展的改进与修复清单。读完本文，你将清楚每个新特性的使用方式、对应的配置字段与底层实现位置，可以直接对照源码深入验证。

一、版本概览：一份"未发布"变更日志说了什么

changelog/unreleased.md是 OpenChamber 仓库中跟踪下一个版本变更的文档，它采用App / SDK / VS Code三段式结构，分别记录三端（主应用、扩展 SDK、VS Code 扩展）的New、Improvements与Fixes。与已发布版本日志不同，这份文件没有被固定版本号约束，内容随开发持续累积，因此它是对"正在路上"的能力最及时、最贴近实现的观测窗口。

本次变更的核心主题可以概括为三件事：

1. 会话时间线视图：侧边栏新增Timeline与Grouped两种视图切换，让最近会话以一条按时间排列的纵向列表呈现；
2. 扩展成为 Agent 的浏览器：一个已安装的扩展可以声明service.provides: ["browser"]代替应用内浏览器响应 Agent 的browser.*动作，并通过service.surface: true在侧栏（rail）展示实况画面，用户可以点击接管、再交还给 Agent；
3. 文件预览全面升级：音频 / 视频 / CSV 表格 / 字体 / 图表（如 Mermaid、SVG）等非文本文件可直接在文件面板中查看，Agent 还可以把生成的文件主动打开给你检查。

二、新功能：Session Timeline 会话时间线视图

2.1 Grouped / Timeline 双视图切换

变更日志原文：

Session timeline:the sidebar gets a Timeline view with a Grouped/Timeline switch, so recent sessions read as one chronological list.

其实现细节记录在 packages/ui/src/components/session/sidebar/DOCUMENTATION.md 的 "Timeline view" 一节中，可归纳为以下行为：

• 视图模式由 profile 作用域、按显示表面（surface）存储的sidebarViewMode控制，在projects与timeline之间切换；VS Code 没有该开关，始终渲染projects。
• Timeline 保留"受管理的 Chats 区"，但初始展示条数从常规的 Chats 限制改为 3 条；置顶聊天始终显示、不占用该限额，Show more / Show fewer只统计未置顶的行。Chats 行以renderContext: 'timeline-chat'渲染：单行、无左侧沟槽、置顶与状态点放在右侧时间旁边。折叠某个区头会重置其 Show more 状态。
• 区头（zone header）行为不同：在 projects 视图中区头是粘性的，在 timeline 中从不粘性；timeline 的区头去掉前导图标、使用更高的带条。
• Chats 区之下渲染一个timeline活动区头，随后把所有项目与 worktree 的全部非归档根会话放进一个扁平列表，按共享生命周期顺序排列，置顶会话排在最前；没有 reveal 限额，列表是虚拟化的。
• Timeline 行携带renderContext: 'timeline'、深度为 0、无子节点：不可展开、无 chevron、无文件夹、无项目头、无 worktree 分组、也没有 Recent 投影。由于文件夹不投影，行菜单隐藏Move to folder；归档 / 删除动作仍覆盖整个子树（collectSessionSubtreeIds在执行时从全局缓存解析后代）。
• 分支标签在每行都显示：recent/sessionLocation.ts是会话所属项目、目录、worktree 与分支标签的唯一解析者，先走会话归属索引（受管理的 worktree 位于项目路径之外），再回退到路径前缀匹配，并以最长前缀找到所在 worktree。分支标签是"live-first"的：实时 Git 状态优先于已发现的 worktree 元数据。
• Timeline 行自身的渲染组件是 packages/ui/src/components/session/sidebar/sessions/SessionTimelineRowBody.tsx：第一行固定 20px 高，放项目图标 + 项目标签 + 元数据（目录指示、置顶标记、状态点、时间槽）；第二行是标题；第三行按需显示分支标签、PR 徽章、zombie 指示与徽章。紧凑模式（compact）下则合并为单行。

2.2 搜索规则与一致的行元数据

Timeline 的搜索与 Recent 使用同一规则：以ses_开头则只匹配完整会话 ID（大小写不敏感、忽略两侧空白），否则按标题包含匹配，每个列出的行计一次命中。会话行、置顶标记、分支标签、PR 状态都复用同一套解析器，因此同一会话在 Recent、Timeline 与项目分组中看到的分支信息保持一致。

三、新功能：扩展作为 Agent 的浏览器（Browser Provider + Shared Surface）

这是本次变更中协议层面最重的一项。变更日志原文：

Extensions as the agent's browser:an installed extension can stand in for the agent's browser, with a Browser provider dropdown in Settings and a live picture in the rail that you can click to take over and hand back to the agent.

SDK: Services can declareservice.provides: ["browser"]to answer the agent's browser actions andservice.surface: trueto show a live picture users can take over and hand back.

也就是说：宿主（Host）的openchamber_web工具发出的browser.*动作，可以不再路由到应用内浏览器视图，而是路由给一个服务扩展；同时该扩展还可以把实时画面推给宿主，由宿主画在侧栏面板里，用户点击即可接管输入、再交还给 Agent。两份关键协议文档位于 SDK：

• packages/sdk/src/service-providers.ts：Browser Provider 契约；
• packages/sdk/src/service-surface.ts：Shared Surface（共享画面）契约。

3.1 Browser Provider 契约：动作、参数与超时

contributes.service.provides: ["browser"]声明扩展可以代替宿主角色。从 packages/sdk/src/service-providers.ts 看，宿主把每个动作 POST 到服务回环地址上的/browser-control路径（BROWSER_PROVIDER_PATH），动作全集为：

协议层的时间预算与上限同样定义在此文件（这些是宿主强制的约束）：

• BROWSER_PROVIDER_OPEN_TIMEOUT_MS = 45_000：browser.open允许等待慢页面，其余动作默认BROWSER_PROVIDER_ACTION_TIMEOUT_MS = 20_000；
• BROWSER_PROVIDER_RESPONSE_MAX = 12_000_000：单次响应上限（截图最大）；
• BROWSER_PROVIDER_IDLE_MS = 10 * 60_000：10 分钟无动作后宿主停止服务，下一次动作再拉起它——服务按需启动，不需要常驻；
• 每个请求带requestId与context（directory、sessionId），宿主从工具调用填充、模型从不手写；服务可据此按项目或会话维护独立浏览器，null视作"未知作用域"而非独立作用域。

服务端解析入口是readBrowserProviderRequest（packages/sdk/src/service-providers.ts）：它信任宿主已经校验过参数，只检查信封（requestId / action / parameters / context），因此服务 bundle 不需要引入 schema 库。错误响应约定：error字段会被 Agent 读取，应写"下一步该怎么做"（如 "No element matches #save"），而不是内部崩溃信息。

3.2 Shared Surface 契约：帧、输入与控制权

service.surface: true声明服务向宿主展示某个 Agent 正在操作对象的实况画面（浏览器、模拟器、桌面应用），并接收用户的指针与键盘输入。协议定义在 packages/sdk/src/service-surface.ts，宿主在扩展的侧栏面板中绘制画面，服务只负责产帧与消费输入：

• GET /surface/frame?after=<seq>&wait=<ms>：返回比seq更新的下一帧，最长等待waitms；200 返回图片字节（Content-Type为image/jpeg或image/png）并携带x-surface-seq/x-surface-width/x-surface-height/x-surface-title/x-surface-agent-active头；没有新帧则 204。序列号从 1 开始，after=0表示"当前画面"。宿主每个查看者一次只请求一帧——这就是背压机制：慢的查看者不会堆积帧。
• POST /surface/input：{ events: SurfaceInputEvent[] }，坐标使用帧像素；只在用户持有控制权时发送。事件类型包括pointer（down/up/move，带 button 位掩码与修饰键）、wheel、key（down/up，带key与code）、text（粘贴或组合输入）。
• POST /surface/control：{ controller }，取值为none/agent/user，控制权变化时通知，服务可在用户介入时暂停自己的自动化。
• POST /surface/resize：{ width, height }，服务应答它最终采用的尺寸，或返回 400 保持自己的尺寸。
• GET /surface/clipboard：{ text }，用户在画面内复制的内容，由宿主放入剪贴板。

帧与输入侧的硬性上限：帧请求等待SURFACE_FRAME_WAIT_MS = 25_000ms、单帧最大8_000_000字节、单次输入批次最多 256 个事件、单事件文本最长 64_000、标题最长 200、维度上限 16_384。Agent 动作之后，Agent 被视为"持有控制"SURFACE_AGENT_HOLD_MS = 30_000ms。

3.3 声明方式：manifest 与校验

service的声明在 manifest 的contributes中，类型定义见 packages/sdk/src/manifest.ts：

{ "apiVersion": 1, "contributes": { "service": { "entry": "service/main.js", "runtime": "host", "permissions": { /* 可选：sockets / exec */ }, "provides": ["browser"], // 可选：代替宿主角色 "surface": true // 可选：提供共享实况画面 } } }

关键校验规则（来自 packages/sdk/src/parse.ts 与 packages/sdk/src/parse.test.ts）：

• GUEST_SERVICE_PROVIDES = ['browser']，目前只支持这一个角色；重复provides或未知角色会被拒绝为invalid-service；
• 提供了角色的服务不需要 panel 或 background entry：宿主在第一次动作时拉起它；
• surface必须是字面量true（surface: false会报invalid-service）；
• 若同时声明panel.entry与surface: true，panel.dock（top/bottom/left/right，默认top）与panel.size（24～480 CSS px，默认 40）会把面板页停靠在画面的一侧，形成工具栏 / 检查器 / 工具列；两者必须与service.surface同时存在才合法（否则invalid-panel）；
• provides或surface任意一个存在即自动申请service能力，安装时需用户批准。

四、新功能：文件预览与"Agent 打开文件给你看"

4.1 文件面板中的非文本预览

变更日志原文：

File previews:play audio and video, browse CSV tables, inspect fonts, and view diagrams directly in the files panel.

实现集中在 packages/ui/src/components/views/files/previews/，FilesView.renderArtifactPreview是停靠式与全屏式两个查看器共用的唯一分派入口（见 packages/ui/src/components/views/files/DOCUMENTATION.md）：

• 音频 / 视频：MediaArtifact（MediaArtifact.tsx）使用浏览器原生播放器，preload="metadata"读取时长与（视频的）宽高显示在元数据栏；运行环境无法解码的编码器会以明确的"无法播放"状态呈现并给出下载入口，而不是显示一个死掉的播放器。非文本且必须由浏览器拥有的资源（PDF、音频、视频、字体）通过getRuntimeUrlResolver().authenticatedAsset('/api/fs/raw', …)携带作用域 URL token 加载，服务器流式响应字节范围以支持播放 seek。
• CSV / TSV 表格：TableArtifact（TableArtifact.tsx）把分隔文本解析为网格：粘性表头、等宽字体单元格，并对行数设有硬上限以保证大导出也能渲染——上限会明确写在元数据栏里（"2,000 行"与"仅前 2,000 行"含义不同），不会隐藏。
• 字体：FontArtifact（FontArtifact.tsx）提供字体样张（type specimen）：把字体注册到一次性的FontFace家族名（oc-font-preview-*），仅在该文件打开期间存在，标签页关闭即从document.fonts移除，避免被应用其他部分意外使用；以 48 / 32 / 24 / 18 / 14 px 五档字号展示样本，并给出字母、数字、符号的字形行。
• 图表：SVG、Mermaid（.mmd）与分隔文件是"带 artifact 视图的文本"：每个文件都有按路径的 预览/源码 切换，并且无论"默认以文本打开"设置如何，都会以预览方式打开——因为 Agent 产出的 artifact 被打开就是为了让人看。
• 图片：ImageArtifact支持 fit 或 1:1 显示自然尺寸，仍走 object-URL />赞分享

• Furion与前端框架集成：React、Vue、Angular完美协作指南

  Furion与前端框架集成：React、Vue、Angular完美协作指南 Furion是一个让.NET开发更简单、更通用、更流行的开源框架，它不仅提供了强大的

  后端Web框架

• foobox-cn：重构foobar2000默认用户界面的模块化皮肤配置方案

  foobox cn：重构foobar2000默认用户界面的模块化皮肤配置方案 在数字音乐播放领域，foobar2000以其卓越的音频处理能力和高度可定制性赢得了

  桌面应用音视频

• Harmony未来展望：路线图与新特性预览

  Harmony未来展望：路线图与新特性预览 Harmony 作为一款强大的.NET运行时方法修补库，正在不断演进以满足现代软件开发的需求。这款终极的.NET方法

  开发工具