把 Agent Harness 装进 Chrome 浏览器！深度拆解 Manifest V3 架构、Side Panel 原生侧边栏、Content Script 网页感知清洗与长流式通信。
在传统独立网页中，用户需要手动将文章、表格或代码“复制 ➔ 切换标签页 ➔ 粘贴 ➔ 提问”。而在 Chrome Extension 中：
sidePanel API，Agent 界面与用户正在浏览的网页并排呈现，无需窗口来回切换。运行在专属扩展窗口中。负责渲染用户对话界面、流式渲染打字效果、展示工具调用时间线。
注入到用户网页内部执行。负责 DOM 清洗（移除广告、脚本、导航冗余）、选区文本监听与模拟点击输入。
处理跨域请求中转、与远程 Agent 后端建立 SSE 长连接、多标签页状态协调与用户授权管理。
// 监听来自 Side Panel 的抓取指令
chrome.runtime.onMessage.addListener((request, sender, sendResponse) => {
if (request.action === "EXTRACT_CLEAN_CONTENT") {
// 复制主体并移除无关干扰标签
const clone = (document.querySelector('article') || document.body).cloneNode(true);
const ignoreSelectors = ['script', 'style', 'nav', 'footer', 'aside', 'iframe', '.ad'];
ignoreSelectors.forEach(sel => clone.querySelectorAll(sel).forEach(el => el.remove()));
// 提取纯文本正文并截断至合理 Token 长度
const cleanText = clone.innerText.replace(/\s+/g, ' ').trim().slice(0, 12000);
sendResponse({
title: document.title,
url: window.location.pathname,
content: cleanText
});
}
});
在下面这个微型浏览器仿真沙盒中，左侧是用户当前浏览的英文财报资讯，右侧是内嵌的 Chrome Side Panel Agent。
点击“让 Agent 深度分析当前网页”，观察 Content Script 如何抓取正文，以及 Agent 如何流式输出分析研报：
Global AI infrastructure spending accelerated in the third quarter of 2026, reaching a new milestone of $42.5 billion. Major hyperscalers reported a 68% year-over-year increase in capital expenditure, primarily driven by next-generation accelerator deployments and high-density liquid cooling retrofits.
MV3 Service Worker 通常在空闲 30 秒后终止；事件和扩展 API 调用可重置空闲计时，运行时间超过 30 秒不等于必然被中断。Chrome 114 起仅打开长连接端口不重置计时，发送消息才可重置。
设计要点：将任务状态持久化，处理端口断开与重连，在服务端保存长任务进度。避免无期限保活；确需处理特定长任务时，参考 Chrome 官方针对版本的生命周期说明。
Chrome 官方生命周期文档