代码片段参考：配置与自定义

aidisclose.js 是站内脚本，它读取你的 ai-disclosure.json 清单，并渲染法规所要求的披露内容：面向聊天机器人的交互横幅、常驻的内容提示、已标记媒体上的可见标签，以及机器可读的页面元数据。它不依赖任何第三方库，gzip 压缩后约 8.2 KB，并符合 WCAG 2.1 AA。

本页是完整的配置与自定义参考。关于逐平台的安装步骤（WordPress、Shopify、Webflow、标签管理器），请参阅安装指南。你也可以将本文档作为原始 markdown 阅读。

概览

一个脚本标签即可驱动全部功能。加载时，代码片段会获取你的清单，随后仅渲染清单所声明的内容：

交互横幅，用于 conversational 系统：提示访客正在与 AI 对话。
内容提示，用于 scope: site 或 scope: page 的 content-generation 系统：一枚小巧的常驻标记。点击后会打开一段简短说明，其中含提示文本、来自清单的发布者名称与系统用途，以及指向清单文件的链接；提示文本会链接到 aidisclose.io 上一段通俗易懂的说明。“made by humans”徽章会打开同一张卡片，并显示发布者名称。
逐元素标签，用于任何以 data-ai-content 标记的元素：一枚可见的“AI”徽章，外加机器可读的 data-digital-source-type。
页面元数据：一个指向你清单的 <link rel="ai-disclosure"> 和 <meta name="ai-disclosure">。
“Made by humans”徽章，当清单设置了 noAiDeclared 时显示。

以下所有内容均为可选。在无任何配置的情况下，代码片段会读取你的 /.well-known/ai-disclosure.json，以访客的语言在 28 种区域设置下渲染，遵循操作系统的浅色或深色偏好，并叠放在已知的 Cookie 同意栏之上，使两者互不遮挡。

安装

只需添加一次标签，将其放入站点的共享模板、主题页眉或标签管理器中，它便会随每个页面一同发布。它可以置于 <head> 内，也可以置于 </body> 之前的任意位置；它是延迟加载的，因此位置不影响其行为：

<script src="https://cdn.aidisclose.io/v1/aidisclose.js" defer></script>

在不带任何属性的情况下，代码片段会读取位于 https://YOURDOMAIN/.well-known/ai-disclosure.json 的清单。如果你的平台无法在域名根目录提供该文件，可将清单托管于 AIDisclose，并通过键值让标签指向它：

<script src="https://cdn.aidisclose.io/v1/aidisclose.js" data-aidisclose="YOUR_SITE_KEY" defer></script>

如果清单无法访问，代码片段会在控制台记录一条警告，并不渲染任何由清单驱动的提示，因此获取失败绝不会显示凭猜测生成的提示。页面元数据、你的 [data-ai-content] 标签，以及通过 data-banner="true" 强制显示的横幅仍会渲染。

配置

配置代码片段有三种方式。选用最适合你平台的一种即可。

1. 脚本标签上的属性。 最简单的方式，无需额外代码：

<script src="https://cdn.aidisclose.io/v1/aidisclose.js"
        data-theme="light" data-lang="fr" defer></script>

2. 全局配置对象。 在脚本运行前定义 window.AIDiscloseConfig。它公开完整的选项集，包括没有属性形式的选择器选项：

<script>
  window.AIDiscloseConfig = {
    theme: 'light',
    mountSelector: '#ai-disclosure-slot',
    triggerSelector: '#chat-launcher',
  };
</script>
<script src="https://cdn.aidisclose.io/v1/aidisclose.js" defer></script>

3. 手动初始化。 添加 data-manual 以推迟自动启动，然后在你的应用就绪后自行调用 AIDisclose.init()（在单页应用中很有用）：

<script src="https://cdn.aidisclose.io/v1/aidisclose.js" data-manual defer></script>
<script>
  AIDisclose.init({ theme: 'dark', persistentChip: false });
</script>

如果同时存在多个配置来源，window.AIDiscloseConfig 优先：它会覆盖脚本标签属性以及传入 AIDisclose.init() 的任何对象。

选项参考

选项接口在 1.x 系列中保持稳定。

Option	Attribute	Values	Default	Effect
`theme`	`data-theme`	`light`、`dark`、`auto`	`auto`	配色方案。`auto` 遵循访客的操作系统偏好。
`siteKey`	`data-aidisclose`	字符串	无	加载 AIDisclose 托管的该键值清单，而非 well-known 文件。
`manifestUrl`	`data-manifest-url`	URL	`/.well-known/ai-disclosure.json`	从自定义 URL 读取清单。
`lang`	`data-lang`	BCP-47 代码	页面 `<html lang>`，否则为访客的语言	强制指定显示语言。
`banner`	`data-banner`	`true`、`false`	自动	强制开启或关闭交互横幅。若不设置，仅当你的清单声明了 conversational（聊天机器人）系统时才显示。
`persistentChip`	—	`true`、`false`	`true`	显示或抑制交互横幅折叠后的迷你标记（横幅最小化后收拢成的小胶囊）。
`alwaysShow`	—	`true`、`false`	`false`	每次访问都再次显示横幅，忽略访客先前的关闭操作（记录于浏览器的 `localStorage` 中）。
`mountSelector`	—	CSS 选择器	无	在该元素内以内联方式渲染横幅，而非固定于底部的浮层。
`triggerSelector`	—	CSS 选择器	无	仅在访客点击该元素（例如聊天启动按钮）后才显示交互横幅。没有匹配元素的页面不显示横幅，因此仅存在于部分页面的聊天机器人只在那些页面披露。加载后注入的启动按钮同样有效。此前关闭过横幅的访客仍会看到迷你标记。
`adjacentSelector`	—	CSS 选择器	无	在无法直接标记的元素旁放置标签，例如已关闭的小部件或 iframe。
`observe`	—	`true`、`false`	`true`	监视 DOM 中稍后添加的内容并为其加上标签。在完全静态的页面上设为 `false`。
`beaconUrl`	—	URL	无	在值得关注的事件上发送匿名的 `{siteKey, flag}` 信标。无 Cookie，无个人数据。

data-manual 并非一个选项值：它出现在标签上会推迟自动启动，以便你自行调用 AIDisclose.init()。

主题与外观

用 theme（light、dark 或 auto）设置内置方案。若要与你的品牌完全一致，可在你自己的样式表中覆盖代码片段的 CSS 自定义属性。它们定义在 .aid-banner, .aid-chip 上：

Variable	Controls
`--aid-bg`	背景
`--aid-fg`	文本
`--aid-line`	边框
`--aid-btn`	关闭按钮边框
`--aid-btnfg`	关闭按钮文本
`--aid-hov`	关闭按钮悬停

.aid-banner, .aid-chip {
  --aid-bg: #0b1020;
  --aid-fg: #e8eaed;
  --aid-line: #2a2f36;
}

代码片段不附带任何 !important 规则，且使用低优先级选择器，因此你的 CSS 会胜出。类挂钩为 .aid-banner、.aid-chip、.aid-badge、.aid-badge-inline、.aid-wrap、.aid-ai（内容提示）以及 .aid-hm（“made by humans”）。可直接在这些类上重新设置间距、圆角与阴影。

默认情况下，横幅是固定在视口底部的浮层。设置 mountSelector 可将其以内联且静态的方式渲染到你所控制的元素内，使其位于你自己的布局之中。

自定义文案

横幅与标记开箱即以 28 种语言呈现准确的本地化文本。若要覆盖文案：

按语言，在清单中设置。 为某个系统添加 disclosure.texts，以语言代码为键。代码片段会为匹配的访客语言使用你的文本：

{
  "disclosure": {
    "texts": { "en": "Some copy on this page was drafted with AI.", "fr": "Une partie du texte a été rédigée avec de l'IA." }
  }
}

按元素设置。 为已标记的元素添加 data-ai-label，以设置该徽章的标签。

当某个系统设置了 editorialResponsibility.humanReview: true，且其内容并非完全由 AI 生成或篡改时，提示会自动以访客的语言显示为“AI 辅助、人工审核”，而非“AI 生成”。

标记你的 AI 内容

代码片段只标记你所标记的内容。为任何 AI 生成的元素添加 data-ai-content：

<img data-ai-content src="/img/generated.webp" alt="…">
<p data-ai-content>AI-drafted summary…</p>
<video data-ai-content src="/clip.mp4"></video>

每个已标记的元素都会获得一枚可见的“AI”徽章，以及机器可读的 data-digital-source-type（默认为 trainedAlgorithmicMedia，一个兼容 IPTC 与 schema.org 的值）。添加 data-ai-label 以自定义标签文本，或自行设置 data-digital-source-type 使其更为具体。

对于你无法直接注释的 AI，例如封闭 iframe 中的第三方聊天小部件，可使用 adjacentSelector 在其旁放置标签，或使用 triggerSelector 在该小部件打开时显示交互横幅。

内容生成提示可覆盖整个站点（disclosure.scope: "site"），或指定页面（disclosure.scope: "page"，并附一个由路径通配符组成的 disclosure.pages 列表，例如 /blog/*）。页面范围的匹配优先于站点范围，而没有匹配路径的页面范围系统在该页不渲染任何内容。

单页应用与框架

代码片段通过 MutationObserver 监视 DOM，并在路由变化时重新评估适用的提示，因此加载后添加的内容和页面仍会被标记。在 SPA 中：

保持 observe 为其默认值（true），以便捕获客户端渲染的内容。
如果你依据应用就绪状态来控制初始化，请添加 data-manual，并在你的框架挂载后调用 AIDisclose.init()。
页面范围的提示会随路由变化自动更新；无需按路由逐一调用。

仅在加载后不注入任何内容的完全静态页面上，才将 observe 设为 false。

内容安全策略

如果你强制实施了内容安全策略，请显式放行代码片段。

重要

严格的 script-src 'self' 会静默阻止 CDN 代码片段，导致披露内容从不渲染。这是一个已正确声明的站点未能达到 Level 2 的最常见原因。

script-src：添加 https://cdn.aidisclose.io，或从你自己的源自托管 aidisclose.js 并保留 'self'。
style-src：代码片段以内联方式注入其样式，因此 'unsafe-inline' 即已足够。如果你不允许内联样式，它会退而从脚本所在目录加载 aidisclose.css，因此也请在 style-src 中放行 https://cdn.aidisclose.io（或将该文件与脚本一同自托管）。
connect-src：对于 well-known 文件，清单获取是同源的，无需任何额外设置。如果你通过键值加载清单，请放行 https://cdn.aidisclose.io。

清单在获取时不带凭据，因此请公开提供它：要求 Cookie 或身份验证的端点将不会收到它们。

版本管理与完整性

CDN 提供三条通道：

/v1/aidisclose.js 跟随最新的 1.x 版本。推荐大多数站点使用。
/v1.0.0/aidisclose.js 是一个固定且不可变的版本，你可以将其锁定，并带有子资源完整性（Subresource Integrity）：

<script src="https://cdn.aidisclose.io/v1.0.0/aidisclose.js"
        integrity="sha384-…" crossorigin="anonymous" defer></script>

/latest/aidisclose.js 始终跨主版本跟踪最新发布的版本。

要获取用于锁定的 SRI 哈希，请构建代码片段：在 packages/snippet 中运行 npm run build 会将其打印出来（源码在 GitHub 上开源）。

构建你自己的披露界面

你可以渲染自己的披露界面来替代内置界面。这里没有单一的总开关：data-banner="false" 与 persistentChip: false 仅抑制交互横幅及其标记，而内容提示、逐元素的 [data-ai-content] 徽章以及“made by humans”徽章仍会依据你的清单与标记进行渲染。完全自定义的界面意味着不依赖这些内置元素，而是渲染你自己的界面。

注意

AIDisclose checker 通过检测参考代码片段的标记来核验渲染。完全手工搭建的披露是有效的，但不会被自动检测到，因此站点会停留在 Level 1（Declared）而非 Level 2（Rendered），除非你的自定义标记再现了 checker 所查找的内容。如果 Level 2 对你很重要，请保留内置渲染并用 CSS 对其重新设置样式。

无障碍

渲染出的界面符合 WCAG 2.1 AA：交互控件上有可见的 :focus-visible 轮廓、正确的角色与标签、在浅色与深色下都保持的对比度，以及受 prefers-reduced-motion 控制的动画。代码片段还会检测已知的 Cookie 同意栏并叠放于其上，使披露内容绝不被 CMP 遮挡。在极窄的屏幕上，交互横幅会以紧凑的标记形式打开，因此绝不会遮住内容。

#概览

#安装

#配置

#选项参考

#主题与外观

#自定义文案

#标记你的 AI 内容

#单页应用与框架

#内容安全策略

#版本管理与完整性

#构建你自己的披露界面

#无障碍

概览

安装

配置