文档提示工程人工智能【免费下载链接】claude-code-system-promptsAll parts of Claude Codes system prompt, 27 builtin tool descriptions, sub agent prompts (Plan/Explore/Task), utility prompts (CLAUDE.md, compact, statusline, magic docs, WebFetch, Bash cmd, security review, agent creation). Updated for each Claude Code version.项目地址https://gitcode.com/gh_mirrors/cl/claude-code-system-prompts点击查看免费下载导读本文围绕 Claude Code 系统提示词中 Artifact 页面契约的浏览器存储指导展开讲解在 v2 页面契约下localStorage、sessionStorage与 IndexedDB 的真实能力边界数据只属于单个查看者的浏览器、可随重新发布保留、但随时可能为空或抛异常。读完本文你将掌握如何在 Artifact 页面中安全读写浏览器存储、如何用 try/catch 实现无存储值时的优雅降级以及哪些状态绝不应该放进浏览器存储而应交给运行时能力runtime capability。本文以仓库中的 v2 页面契约浏览器存储指导ccVersion 2.1.281为骨架并交叉参考 v1 版本、带 capabilities skill 引用的版本 以及 运行时能力指导 等仓库文档进行纵深展开。一、浏览器存储在 Artifact 页面契约中的定位Claude Code 会为每个 Artifact 页面生成独立的发布环境。与静态 HTML 页面不同Artifact 页面运行在查看者的浏览器中因此系统提示词需要明确告诉模型页面能不能用浏览器存储、能用它存什么、存的东西会去哪。v2 页面契约浏览器存储指导 给出的定位非常精确浏览器存储localStorage可用sessionStorage和 IndexedDB 同样可用。每个 artifact 从自己的 origin 提供服务因此页面存储的内容对该 artifact 是私有的会在重新发布到同一 URL 后保留并且只存在于该查看者的浏览器中——它永远不会到达其他查看者、查看者的其他设备或 Claude。一句话概括其定位浏览器存储是可失败的、按查看者区分的便利状态fallible per-viewer convenience state。它不是可靠存储不是共享存储更不是与 Claude 通信的通道。二、存储隔离模型一个 Artifact、一个 Origin、一个查看者理解浏览器存储的行为关键是理解三层隔离1. 每个 Artifact 拥有独立的 Origin每个 artifact 从自己的 origin 提供服务这与同一个站点下多个页面共享 localStorage的常规 Web 习惯不同。Artifact 页面之间互不共享存储键空间你无法用一个 artifact 的 localStorage 去读取另一个 artifact 的数据。2. 数据只存在于单个查看者的浏览器页面存储的任何内容都只落在当前查看者自己的浏览器中。这意味着其他查看者看不到这些数据查看者的其他设备手机、另一台电脑看不到这些数据Claude 本身永远读不到这些数据。这一点在 页面实现要求app 措辞版 中被再次强调它不会到达其他查看者、其他设备或 Claude。3. 重新发布到同一 URL 后数据保留由于 origin 不变当同一个 artifact 被重新发布到同一 URL 时查看者浏览器中已有的存储值会继续存在。这给了页面一种轻量记忆能力例如记住查看者上次选中的标签页或筛选条件重新发布后体验依然连贯。三、可失败性为什么存储值可能为空或抛出异常v2 页面契约中最关键、也最容易被开发者忽视的一点是浏览器存储是可失败的。文档明确列出可能返回空隐私窗口private window、清除站点数据cleared site data、不同的浏览器a different browser都会让读取结果为空访问器本身可能抛异常缩略图捕获thumbnail capture、预览previews、浏览器设置为阻止站点数据browsers set to block site data等场景下读写操作本身就会 throw。因此文档给出的硬性要求是请用 try/catch 包裹每一次读取和写入并在没有任何存储值的情况下也能正确渲染页面。这意味着 Artifact 页面的默认渲染路径必须不依赖任何存储值。存储只是可选的增强有值则恢复查看者的便利状态无值则页面照常完整可用。参考 HTML 文档骨架 中的 reset 与 响应式页面契约 中的布局要求页面在裸奔状态下也必须自洽、可读、可用。四、安全读写与优雅降级推荐写法基于文档的要求可以这样封装一次安全的存储访问这是将文档规则落地的常见写法页面需自行保证无存储值时也能工作script // 统一的安全读取任何异常都回退到 null页面照常渲染 function safeGet(key) { try { const value localStorage.getItem(key); return value; // 可能为 null调用方必须接受这一点 } catch (e) { return null; // 隐私窗口、阻止站点数据、缩略图捕获等场景 } } // 统一的安全写入写失败也绝不阻塞页面主流程 function safeSet(key, value) { try { localStorage.setItem(key, value); } catch (e) { // 忽略存储本就是可选的便利状态 } } // 页面初始化读取记住的标签页读不到就用默认值 const rememberedTab safeGet(lastActiveTab); activateTab(rememberedTab || overview); /script要点归纳读取与写入都要包 try/catch不能只包读取读取结果可能是null未写入过或访问被拒调用方必须把null当作合法输入处理写入失败不能抛错打断页面——存储是可选项不是页面正确运行的先决条件页面必须在无任何存储值时渲染正确这是文档的明确验收标准。五、适用场景按查看者的轻量便利状态文档给出了三类典型且被明确认可的用途记住的标签页或筛选条件a remembered tab or filter查看者上次停留的位置折叠区状态a collapsed section页面中某块内容的展开/收起偏好未发送的草稿an unsent draft查看者尚未提交的输入内容。这三类共同点是丢了也无伤大雅。即便存储被清空、被阻止或换了浏览器页面依然完整可用只是查看者的个性化偏好需要重新设置。这正与fallible per-viewer convenience state的定位完全吻合。六、明确禁区三类绝不该放进浏览器存储的状态文档同时划出了三条红线以下状态不能依赖浏览器存储1. 必须可靠持久化的状态例如订单、投票记录、报名信息。浏览器存储随时可能被清空或阻止不能作为可信的持久层。2. 需要在查看者之间共享的状态例如多人协作的签到表、共享看板、实时清单。如前所述存储是 per-viewer 的其他查看者根本读不到。3. 之后需要被 Claude 读回的状态浏览器存储与 Claude 完全隔离Claude 没有任何渠道读取查看者浏览器中的值。凡是模型之后需要消费的数据都不能走这条路。七、与运行时能力Runtime Capabilities的边界需要特别说明的是仓库中存在多个版本的浏览器存储指导它们在是否需要加载 capabilities skill这一点上有明确分工v1 版本ccVersion 2.1.271将可靠/共享状态引向 runtime capabilities带 capabilities skill 引用的版本ccVersion 2.1.281面向 v1 页面契约要求先加载${ARTIFACT_CAPABILITIES_SKILL_NAME}skill 再写页面本文对应的 v2 页面契约版本ccVersion 2.1.281不包含runtime-capabilities skill 加载指令聚焦于把浏览器存储定义为 per-viewer 便利状态本身。从源码结构看v2 契约版本刻意做了职责收窄它只回答浏览器存储能干什么、不能干什么而把需要可靠/共享状态时该怎么做交给 运行时能力指导 处理。后者明确指出已发布页面通过capabilities输入声明能力读取实时数据、跨查看者共享状态、记忆用户操作、保存文件等而当能力可用时当某个保持状态的能力可用时优先用它而不是浏览器存储来承载这类状态localStorage仍然是按查看者便利状态的回退方案。也就是说浏览器存储与 runtime capabilities 的分工是状态类型正确归属记住标签页、折叠区、未发送草稿等便利状态浏览器存储localStorage/sessionStorage/IndexedDB必须可靠持久化、跨查看者共享、Claude 需要读回的状态runtime capability通过capabilities声明更完整的边界说明可参见 发布与更新指导其中同样强调这类状态属于 runtime capability当该用户拥有时。八、v2 页面契约下浏览器存储的完整决策清单将本文内容浓缩为一份可直接用于页面开发的检查清单写之前问自己这个值丢了页面还能不能正常渲染——不能则不要用浏览器存储其他查看者需要看到这个值吗——需要则不要用浏览器存储Claude 之后需要读这个值吗——需要则不要用浏览器存储。写的时候4. 每次getItem/setItem是否都在 try/catch 内 5. 读取结果为null时页面是否有合理的默认行为 6. 页面是否在存储完全不可用隐私窗口、阻止站点数据、缩略图捕获、预览时依然完整可用发布之后7. 重新发布到同一 URL查看者的存储值会保留——不要把重新发布后应该清空当作默认假设 8. 存储是 per-viewer 的——永远不要用它模拟服务端状态或跨设备同步。九、总结在 Claude Code 的 v2 Artifact 页面契约下浏览器存储是一把带约束的工具它真实可用、按 origin 隔离、随同一 URL 的重新发布而保留但只服务于单个查看者且随时可能为空或抛异常。正确的姿势是用 try/catch 包裹每一次访问让页面在无存储值时依然正确渲染并且只把记住标签页、折叠区、未发送草稿这类轻量便利状态放进去任何需要可靠持久化、跨查看者共享或由 Claude 后续读取的状态都应该交给 运行时能力指导 所描述的 runtime capabilities 承载。相关文档延伸阅读v2 页面契约浏览器存储指导本文主文档v1 浏览器存储指导带 capabilities skill 引用的浏览器存储指导Artifact 运行时能力指导Artifact 页面实现要求app 措辞版Artifact 发布与更新指导Artifact 响应式页面契约Artifact HTML 文档骨架赞分享文档提示工程人工智能【免费下载链接】claude-code-system-promptsAll parts of Claude Codes system prompt, 27 builtin tool descriptions, sub agent prompts (Plan/Explore/Task), utility prompts (CLAUDE.md, compact, statusline, magic docs, WebFetch, Bash cmd, security review, agent creation). Updated for each Claude Code version.项目地址https://gitcode.com/gh_mirrors/cl/claude-code-system-prompts点击查看免费下载相关推荐Claude Code Artifact 浏览器存储权威指南localStorage 的边界、失效模式与运行时能力归属Claude Code Artifact 浏览器存储权威指南localStorage 的边界、失效模式与运行时能力归属 导读 本文基于 Claude Cod文档提示工程人工智能Claude Code Artifact 浏览器存储规范localStorage 的边界与运行时能力Runtime Capability的正确取舍Claude Code Artifact 浏览器存储规范localStorage 的边界与运行时能力Runtime Capability的正确取舍 本文基文档提示工程人工智能Claude Code Artifact Type 页面信任边界解析如何安全处理由发布者编写的页面 HTMLClaude Code Artifact Type 页面信任边界解析如何安全处理由发布者编写的页面 HTML 本篇技术指南聚焦 Claude Code 内置系文档提示工程人工智能上一篇OmX 0.15.1 发布解析直接启动控制、被动状态读取与 Repo-Aware Team DAG 依赖重映射下一篇Apache Airflow Triggerer 队列延迟指标 triggerer.trigger_queue_delay 深度解析创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考