2026 AI 编程从改代码进化到做产品。用 Claude Code/Cursor 从零开发AI 阅读助手Chrome 扩展MV3 四件套、完整实战代码、安全合规红线、上架发布全流程。引子AI 编程的下一步是一句话做产品2026 年 9 月初 AI 编程工具密集更新Kimi Code 多形态入场、Cursor 上线 Google Workspace 插件读 Gmail/Drive、Claude Code 生态扩张[3]。工具们在抢帮你做产品。Chrome 扩展是 AI 做产品最性感的赛道不需要服务器、改完即用、发布以天计。本文用 Claude Code 从零开发**AI 阅读助手**选中文字 → 一键摘要/解释把 MV3 架构、AI 生成与人工审查的分工、上架合规一次讲透。一、2026 AI 编程应用开发从改代码到做产品1.1 9 月初的动态Kimi CodeCLI/IDE/Web 多形态内置 Plan 模式与 Sub-agent[3]CursorGoogle Workspace 插件AI 能直接读 Gmail/Drive[3]Claude Code终端 Agent 子代理并行[3]信号明确AI 编程从辅助编码转向交付完整应用。1.2 为什么扩展是 AI 第一个产品的最佳载体维度传统应用Chrome 扩展后端需要服务器不需要或极简发布审核慢以天计迭代周期长改代码即生效成本高极低扩展是用 AI 把想法变成产品的最低成本路径[3]。二、Chrome 扩展 MV3 架构2.1 四件套2.2 MV3 安全模型灵魂强制 CSP禁止远程代码与eval最小权限只用到的权限才声明跨域受限外部 API 需host_permissions service worker[1]三、实战用 AI 开发AI 阅读助手3.1 需求一句话做一个 Chrome 扩展选中网页文字点击图标弹出摘要/通俗解释。3.2 AI 生成流程关键本地加载测试 人工审查AI 不会替你完成[3]。3.3 AI 生成 vs 人工审查分工步骤谁做为什么生成代码骨架AI快模板化本地功能测试人AI 协作需要真实浏览器安全与权限审查必须人工MV3 合规是发布前提隐私政策/文案人法律与商业判断红线AI 生成内容发布前必须人工审过安全与合规[1][2]。四、项目精讲四件套代码AI 生成 人工修正后的标准 MV3 实现[1]。4.1 manifest.json最小权限{ manifest_version: 3, name: AI 阅读助手, version: 1.0.0, description: 选中网页文字一键生成摘要与通俗解释, permissions: [storage, activeTab, scripting], host_permissions: [https://api.llm-service.com/*], action: { default_popup: popup.html }, background: { service_worker: background.js }, content_scripts: [{ matches: [all_urls], js: [content.js] }], icons: { 128: icons/icon128.png } }只声明storage/activeTab/scripting——最小权限原则[1]。4.2 popup.html popup.jsbutton idsummarize生成摘要/button textarea idresult readonly rows10/textarea script srcpopup.js/scriptdocument.getElementById(summarize).onclick async () { const [tab] await chrome.tabs.query({ active: true, currentWindow: true }); const [resp] await chrome.scripting.executeScript({ target: { tabId: tab.id }, func: () window.getSelection().toString() }); const selectedText resp.result; if (!selectedText) { alert(请先选中网页文字); return; } chrome.runtime.sendMessage({ type: summarize, text: selectedText }, (summary) { document.getElementById(result).value summary; }); };4.3 background.js调 LLM APIconst API_KEY_STORAGE llm_api_key; chrome.runtime.onMessage.addListener((msg, _sender, sendResponse) { if (msg.type ! summarize) return; (async () { const { [API_KEY_STORAGE]: key } await chrome.storage.local.get(API_KEY_STORAGE); if (!key) { sendResponse(请先配置 API Key); return; } const res await fetch(https://api.llm-service.com/v1/chat/completions, { method: POST, headers: { Content-Type: application/json, Authorization: Bearer ${key} }, body: JSON.stringify({ model: gpt-4o-mini, messages: [ { role: system, content: 你是阅读助手用三句话总结以下内容并给出通俗解释。 }, { role: user, content: msg.text } ] }) }); const data await res.json(); sendResponse(data.choices?.[0]?.message?.content ?? 生成失败); })(); return true; // 保持消息通道开放异步响应 });讲解点跨域走 service worker host_permissions[1]API key 存storage.local异步响应必须return true。五、安全合规MV3 的红线检查项要求CSP无远程代码、无 eval脚本扩展自带权限最小化不请求用不到的权限数据收集数据需隐私政策key 不明文泄露内容不涉及侵权/恶意用途最常见的被拒原因权限声明过大、缺隐私政策、远程代码违反 CSP[2]。六、上架发布全流程打包扩展目录压缩为 zip账号Chrome Web Store 开发者账号一次性 $5[2]提交zip 商店文案 图标 隐私政策审核通常数天被拒按原因修改重提迭代更新自动推送七、我的观点与踩坑建议观点一AI 做扩展的价值在快速验证想法不在零人工。能跑和能上架之间隔着安全审查、权限最小化、隐私声明三道人工关卡。观点二MV3 是 AI 的天然护栏。强制 CSP 和最小权限让 AI 生成的代码更难乱来。踩坑提醒别让 AI 写大权限all_urlstabs必被拒key 别硬编码异步响应记得return true本地先测再上架开发者模式加载AI 编程开发应用的时代已经来了。Chrome 扩展是门槛最低、反馈最快的练习场——让 AI 写骨架你来当安全与体验的守门人。参考资料[1] Chrome 官方文档Extensions / Manifest V3一级[2] Chrome Web Store 政策中心一级[3] 2026-09 初 AI 编程工具动态Kimi Code / Cursor / Claude Code二级[4] 社区 MV3 实战教程三级