跳转到主要内容
Artifacts 在 Pro、Max、Team 和 Enterprise 计划上可用,需要使用 /login 登录的会话。有关完整的要求集,请参阅 可用性
Artifact 是一个实时交互式网页,Claude Code 从您的会话发布到 claude.ai 上的私有 URL。您可以在浏览器中打开它,当会话继续时它会就地更新。当您想让其他人也看到它时,可以从页面标题中共享它。例如,使用 artifact 来引导审阅者查看带有注释的 diff 的拉取请求、从会话数据构建仪表板,或维护一个随着 Claude 工作而填充的调查时间线。
在 claude.ai/code/artifact 中打开的 artifact。查看器标题显示 artifact 标题 acme-funnel-fix、Share 按钮和作者头像。Share 菜单打开,显示'始终共享最新版本'切换、显示'共享版本 2'的版本选择器、'Acme 中的所有人'受众选择器和'复制链接'按钮。标题下方,artifact 页面显示两个并排的移动模型、一个漏斗图表和一行指标卡。

何时使用 artifact

当终端文本不是 Claude 生成的内容的合适媒介时,请使用 artifact:输出更容易查看和交互,而不是逐行阅读。Claude 从您的会话可以访问的任何内容构建页面,包括您的代码库和通过您的 连接工具 拉取的数据,因此页面可以显示需要段落才能描述的内容。例如,要求 Claude:
  • 引导审阅者查看带有注释的 diff 的拉取请求
  • 从会话已拉取的数据呈现仪表板
  • 并排布置多个设计或实现选项
  • 维护一个在长任务运行时填充的调查时间线
  • 向队友发送链接,而不是将输出粘贴到 Slack
  • 发布一个 通过 MCP 连接器拉取新鲜数据 的状态板,每次有人打开它时都会拉取新数据
有关与这些选项匹配的提示,请参阅 您可以构建的内容,以及 通过 MCP 连接器拉取实时数据 了解连接器支持的板的提示。

Artifact 不是什么

Artifact 是工作的捕获,不是应用程序。它是一个自包含的页面,没有后端,因此无法存储表单输入或提供多个路由,当有人查看它时,它访问外部数据的唯一途径是 调用 MCP 连接器。对于具有后端的托管内部工具,请改为在您自己的基础设施上部署它。有关完整的限制集,请参阅 页面约束

创建 artifact

当输出适合页面时,Claude 可能会自动发布 artifact,或者您可以直接要求一个。要请求,请用纯语言命名功能或描述您想要的视觉输出。任何比作为文本阅读更容易看到的内容都是很好的候选,例如注释的 diff、图表或一组要比较的选项。下面的提示是两个示例;有关更多模式,请参阅 您可以构建的内容
Claude 将页面写入项目中的 HTML 或 Markdown 文件,然后发布它。在发布新 artifact 之前,Claude Code 会要求权限;它可能会说类似 Claude wants to publish "Deploy failures by service" (deploy-failures.html) to a private page on claude.ai 的内容。重新发布您已经批准的 artifact 不会再次提示。 选择 Yes 以发布。Claude 打印 URL,您的浏览器打开到新页面。随时按 Ctrl+] 从终端重新打开最近的 artifact。 Claude 为 artifact 选择标题和浏览器标签图标的表情符号。两者都出现在您在 claude.ai 上的 artifacts 库 和共享链接中,因此如果您想要特定的标题或图标,请要求 Claude 使用它。 要在发布新 artifact 时停止浏览器自动打开,请在您的环境中设置 CLAUDE_CODE_ARTIFACT_AUTO_OPEN=0 如果 Claude 响应它无法发布,或写入本地 HTML 文件而没有链接,则该工具未为您的会话启用。检查 可用性 要求。

更新 artifact

要求 Claude 修改页面,或让长时间运行的任务在取得进展时重新发布。Claude 编辑基础文件并再次发布到相同的 URL。
任何打开页面的人都会看到就地更新。每次发布都会成为一个版本,从页面标题中的 Share 控件,您可以选择查看者看到哪个版本。 要从不同的会话更新 artifact,请向 Claude 提供 artifact 的 URL 并要求它修改。没有 URL,新会话总是创建新 artifact 而不是更新现有的。

分享一个artifact

新的artifact仅对你可见。要分享它,请在浏览器中打开该artifact,并使用页面标题中的Share控件。标题中会显示你是该artifact的作者,因此与你分享的任何人都可以看到谁发布了该页面。它还链接到你的库,位于claude.ai/code/artifacts,其中列出了你创建的每个artifact。 你可以与谁分享取决于你的计划:
  • 在你的组织内:在Team和Enterprise计划中,向你组织中的特定人员或整个组织授予访问权限。查看者以你组织的成员身份登录claude.ai以查看该页面。
  • 公开:分享一个链接,互联网上的任何人都可以打开,无需登录claude.ai。在Pro和Max计划中,公开链接是分享artifact的唯一方式。在Team和Enterprise计划中,公开分享处于关闭状态,直到Owner为组织启用它

让某人与你一起编辑

与你分享的人默认是查看者:他们可以看到你发布的每个版本,但无法更改页面。在Team和Enterprise计划中,你也可以让某人成为编辑者。在分享对话框中,添加一个人并将其角色从viewer切换到editor 编辑者发布新版本的方式与你从另一个会话更新artifact的方式相同:他们在自己的会话中向Claude提供artifact的URL,Claude会拉取当前内容并使用他们的更改重新发布。打开该页面的每个人都会实时看到每个更新。

使用 MCP 连接器拉取实时数据

artifact 可以在每次有人查看它时调用 MCP 连接器,因此页面显示的是当前数据而不是构建它的会话中的快照。来自 artifact 的连接器调用在 Pro、Max、Team 和 Enterprise 计划上可用,需要 Claude Code v2.1.209 或更高版本。在早期版本上,Claude 会发布该页面,其中包含会话在构建时收集的任何数据。 要创建一个由连接器支持的页面,请在提示中命名连接器和您想要的数据:
Claude 在发布时声明页面可能调用的连接器,页面无法调用该声明之外的连接器。只有来自您 claude.ai 账户的连接器符合条件:Claude 在声明中命名它们,当有人查看页面时,每个调用都会 通过查看账户自己的连接 运行到该连接器。您在 Claude Code 中配置的本地 MCP 服务器(例如来自 .mcp.json 的服务器)可以在 Claude 构建页面时提供数据,但已发布的页面无法调用它们。 页面在加载时获取数据,可以按间隔刷新或当查看者在页面上使用刷新控件时刷新。响应缓存在查看者的浏览器中,因此重新打开的页面会立即从缓存的响应呈现,然后使用新结果更新。

连接器调用如何为查看者工作

当已发布的页面调用连接器时,该调用使用查看页面的人的账户,而不是发布它的人的账户:
  • 每个查看者使用自己的连接器:调用通过查看账户的已连接工具进行,因此两个打开同一仪表板的人可能会看到不同的数据,具体取决于他们的账户可以访问什么。页面永远看不到任何人的凭证;claude.ai 代表页面进行调用。
  • 查看者首先批准访问:claude.ai 在页面的第一次连接器调用之前向每个查看者请求权限。拒绝的查看者或未连接页面使用的连接器的查看者仍然可以看到页面,但没有其实时部分。
  • 操作也使用查看者的账户:页面可以提供控件,调用具有副作用的连接器工具,例如发布消息或更新问题。操作通过选择控件的人的账户进行。
当您计划共享由连接器支持的页面时,请要求 Claude 在每个实时部分中包含一条后备消息,该消息命名它需要的连接器。缺少连接的查看者随后会看到要连接的内容,而不是空白部分。 调用连接器的 artifact 无法在任何计划上共享到公共链接。在 Team 和 Enterprise 计划上,您可以将其保持为私密或 在您的组织内共享。在 Pro 和 Max 计划上,其中公共链接是唯一的共享方式,由连接器支持的 artifact 对您保持私密。

页面对查看者显示无实时数据

当由连接器支持的页面呈现但其实时部分对您共享的某人保持空白时,请处理这些原因:
  • 查看者未连接连接器:连接器是按账户的,因此每个查看者都需要自己连接到页面调用的每个连接器。他们可以在 claude.ai 上的 Settings > Connectors 下添加一个,然后重新加载页面。
  • 查看者拒绝了权限请求:拒绝在该页面加载的其余时间内持续。重新加载页面会再次显示权限请求。
  • 为组织关闭了连接器调用:所有者控制管理设置中的 Enable artifact connectors 切换

您可以构建的内容

Artifact 是单个 HTML 页面,因此您可以用 HTML、CSS 和内联 JavaScript 表达的任何内容都在范围内。下面的模式最常出现。

逐步讲解更改

要求一个页面,在相关行旁边呈现 diff 或设计更改并带有注释,以便审阅者可以在代码旁边阅读您的推理,而不是从描述中重建它。

比较替代方案

要求在一个页面上有多个变体,以便您可以相互评估它们。这适用于布局、文案、API 形状或实现计划。

使用交互式控件进行调整

要求滑块、切换或输入字段绑定到您正在调整的任何内容,以便您可以直接探索值,而不是描述它们。

将结果带回您的会话

Artifact 可以充当您随后交给 Claude 的决定的轻量级编辑器。要求一个导出控件,生成您可以粘贴到终端的文本,以便与页面交互的结果流回会话,而不是停留在页面上。

跟踪进行中的工作

要求 Claude 在长任务运行时保持 artifact 最新,以便任何拥有链接的人都可以跟随,而无需阅读终端。

改进视觉设计

从 Claude Code v2.1.183 开始,Claude 在构建 artifact 时应用内置设计技能,因此页面获得深思熟虑的调色板、排版和布局,无需额外提示。该技能还在选择自己的设计之前查找项目中的现有设计系统。要保持 artifacts 与您产品的品牌一致,请在 Claude 可以找到的地方记录您的设计令牌,例如项目的 CLAUDE.md 或存储库中的主题文件:
Claude 将您的设计系统视为比其自己的选择更高的优先级,并将您的提示视为比两者都更高的优先级。上面的标题和格式是一个示例;任何清晰的颜色、字体和间距列表都有效。

页面约束

每个 artifact 是一个自包含的页面。Claude Code 将您发布的文件包装在 HTML 文档 shell 中,并在严格的内容安全策略 (CSP) 下提供它,这决定了页面可以做什么。 生成 artifact 使用输出令牌,就像任何其他响应一样,样式化页面比相同内容作为终端文本更耗费令牌。内联 CSS、用于交互式控件的 JavaScript,尤其是嵌入为数据 URI 的图像是主要贡献者。要减少 artifact 的令牌成本:
  • 对于图表,优先选择 SVG 或 HTML 和 CSS,而不是嵌入的光栅图像
  • 省略您不需要的交互性
  • 让页面汇总大型数据集,而不是完整内联它们

可用性

Artifacts 需要以下所有条件。当不满足其中一个时,Claude 写入本地 HTML 文件或说它无法发布。

禁用 artifacts

要根据您组织的设置为您自己的会话关闭 artifacts,请使用以下任何一种:

为您的组织管理 artifacts

Team 和 Enterprise 计划上的管理员从 claude.ai 管理设置 控制 artifacts。Artifact 内容存储在 Anthropic 运营的基础设施上,仅对发布组织的经过身份验证的成员可见,除非该 artifact 是公开共享的。

启用或禁用 artifacts

要为整个组织启用或禁用 artifacts,请转到 Settings > Claude Code > Capabilities 并使用 Artifacts 切换。在具有基于角色的访问控制的 Enterprise 计划上,您还可以将 artifacts 限制到特定角色:转到 Settings > Roles,编辑角色,并在 Claude Code 组下设置 Artifacts 权限。

控制来自 artifacts 的连接器调用

来自 artifacts 的连接器调用有自己的切换,与打开或关闭 artifacts 的 Artifacts 切换分开。转到 Settings > Capabilities 并使用 Enable artifact connectors 切换。同一切换控制在 claude.ai 对话中创建的 artifacts 的连接器调用,这就是为什么它位于 Settings > Capabilities 而不是 Settings > Claude Code 下。

控制公开共享

在 Team 和 Enterprise 计划上,公开共享默认处于关闭状态,因此成员只能在组织内共享 artifacts,直到管理员将其打开。要让成员将 artifacts 发布到任何人都可以查看而无需登录的公开链接,请转到 Settings > Claude Code > Capabilities 并在 Artifacts 切换下打开 External sharing。将其关闭会阻止通过现有公开链接的访问,而不会更改每个 artifact 的受众;如果您重新启用它,访问将恢复。

设置保留策略

要设置在自动删除之前保留 artifacts 的时间长度,请转到 Settings > Data & privacy controls。您可以为仍然对其作者私有的 artifacts 和已共享的 artifacts 设置单独的保留期。

查看审计日志

发布、共享和删除 artifact 各自出现在您组织的审计日志中,位于 claude_artifact_* 事件类型下,这是用于在 claude.ai 对话中创建的 artifacts 的同一系列。

将查看器域列入允许列表

claude.ai 上的查看器从沙箱 *.claudeusercontent.com 源加载每个 artifact。如果您的组织限制出站网络访问,请将该域添加到您的允许列表中,与 claude.ai 一起。有关完整列表,请参阅 网络访问要求

使用 Compliance API 列出和删除 artifacts

Compliance API 提供端点来列出组织的 artifacts、检索特定版本的内容和删除 artifact: 有关请求和响应架构,请参阅 Compliance API 参考