在您的网站上嵌入小部件

您可以使用 <script> 标签将产品放置在您自己的网站上。有两个小部件，您选择哪个取决于访客是应该进行对话还是执行特定操作。

	聊天小部件	工作流小部件
访客获得什么	与助手的对话	一个工作流及其输入
互动表单	是	否 — 仅显示结果
脚本	chat-widget.js	workflow-widget.js

这两个小部件都是自包含的：您的页面上无需任何框架，无需包含样式表，也无需构建任何东西。

添加聊天小部件

<script src="https://app.example.com/chat-widget.js"></script>
<script>
  sapajaChat('init', {
    templateId: 'your-template-id',
    token: 'your-embed-token',
  });
</script>

您可以从拥有聊天模板的workspace获取模板ID及其令牌。令牌用于授权小部件，并与可以使用它的网站列表相关联 — 从不在该列表上的域使用的令牌将被拒绝，因此复制的令牌在其他地方将无法使用。

访客看到的内容

回复并不是纯文本。小部件呈现与应用内聊天相同的丰富界面 — 卡片、表格、统计数据、徽章、图表和图像 — 所以结果以可读形式呈现，而不是一堆 JSON。

聊天小部件还呈现 真实表单。当助手需要详细信息才能执行操作时，访客会看到带标签的字段和提交按钮，而不是被要求将值输入到句子中。有几个行为值得了解：

• 不完整的提交将返回一个更正的表单，缺失字段会被标记，而不是出现错误。
• 如果提交无法到达我们，表单仍然可编辑，并提供重试 — 它永远不会错误地报告成功。
• 提交的表单仍然可见但被冻结，并标记为已提交，访客可以看到他们发送的内容。

工作流小部件只会显示结果，没有表单；它在前期收集所需的信息。

访客的语言

小部件使用访客的语言，而不是您的语言。它按照以下顺序确定使用哪种语言：您配置的语言，然后是访客的浏览器语言，最后是英语。

sapajaChat('init', { templateId: '…', token: '…', locale: 'fr' });

支持的语言： en, fr, es, th, zh 和 zh-HK。普通浏览器标签也可以使用 — fr-CA 变为法语，zh-TW 变为繁体中文。任何无法识别的语言都会回退到英语而不是失败。

这适用于小部件自身的控制 以及 助手生成的所有内容：状态行、完成消息、结果卡片标签和回复本身。它按消息应用，因此在对话中途切换语言的访客会从下一条消息开始获得新语言。已经发送的内容不会重新翻译 — 结果卡仍保持其构建时的语言。

如果对话开始了一个长期运行的任务，该语言会随之而移动，因此即使是几个小时后，完成消息也会以访客使用的语言到达。

一个例外： 由创建工作流的人撰写的文本 — 字段描述、澄清提示和自定义显示 — 将以原样呈现。这是作者内容而不是产品文案，因此不会翻译。

构建您自己的客户端

您不必使用小部件。嵌入端点在 REST API reference 中有文档说明，并且它们在每次调用时都接受相同的 locale 值 — 发送它您获得相同的行为，省略它您将获得英语。

如果某些内容没有出现

• 没有麦克风按钮。 语音需要安全连接。在普通 HTTP 提供的页面上，浏览器根本不允许麦克风访问，因此不会显示该控制。请通过 HTTPS 提供您的页面。
• 组件没有渲染。 小部件仅渲染已知的组件类型，并静默跳过任何其他组件，因此无法理解的显示会被跳过，而不是显示为损坏。
• 小部件停止工作。 如果拥有该嵌入的小组已不再有效订阅，小部件将礼貌地拒绝，而不是向您的访客显示账单消息。