网站聊天窗口

用一行代码把 AI 客服窗口装到你的网站，并设置允许的网站、样式、语言和已登录顾客。

嵌入代码

在控制台「接入」页的「2. 把客服窗口装到你的网站」复制你的代码，贴到网站每个页面的 </body> 之前：

<script src="https://askpurser.com/embed/v1.js" data-key="pk_…" async></script>

data-key 是工作区的公开密钥，以 pk_ 开头。它本来就是公开的，只能用来打开聊天。
async 让脚本不挡页面加载。同一个页面贴了两次也只会加载一次。
页面右下角（或左下角）会出现一个圆形按钮，点开是聊天窗口。窗口宽 380px；屏幕宽度不超过 480px 时（手机）占满整个屏幕。
聊天窗口运行在来自 askpurser.com 的独立 iframe 里：你网站上的其他脚本（统计、录屏、浏览器插件）读不到聊天内容和顾客的订单。
顾客打开聊天时，窗口会带上当前页面的标题和地址，让 AI 知道顾客在看什么（见导购与销售）。开了主动触达时，脚本还会在浏览器里判断顾客在商品页停留多久等，这些不会上传。
脚本里的所有错误都被拦住，不会弄坏你的页面。

可选属性

属性	作用
`data-key`	必填，公开密钥
`data-locale`	固定窗口界面的语言，例如 `data-locale="ja"`；不写就按网页 `<html lang>` 的语言，网页没写再按顾客浏览器的语言（见语言）
`data-position`	写 `data-position="left"` 把按钮放左下角，覆盖样式设置里的位置
`data-hidden`	不显示圆形按钮，由你自己的按钮调用 `Purser.open()` 打开
`data-feedback`	同时装上免费的产品反馈按钮（页面侧边的「反馈」标签）；写 `data-feedback="none"` 则不显示标签，由带 `data-purser-feedback` 的元素打开

租户、样式和权限都由服务器决定，网页上改不了。

用自己的按钮打开

<script src="https://askpurser.com/embed/v1.js" data-key="pk_…" data-hidden async></script>

<button onclick="window.Purser.open()">联系客服</button>

脚本加载后，window.Purser 上有这几个方法：

方法	作用
`Purser.open()`	打开聊天窗口
`Purser.close()`	关闭聊天窗口
`Purser.identify(token)`	告诉窗口当前是哪位已登录顾客，见下文
`Purser.identity = async () => token`	同上，可以在脚本加载前设置，打开聊天时读取
`Purser.setLocale(code)`	切换窗口界面的语言，例如 `Purser.setLocale("ja")`；窗口开着也立即换。优先于 `data-locale`，不带参数调用则恢复默认

网站设置了内容安全策略（CSP）时

如果你的网站有 Content-Security-Policy 响应头，需要放行 askpurser.com：

script-src  https://askpurser.com
frame-src   https://askpurser.com
connect-src https://askpurser.com

按钮的样式用的是 Shadow DOM 里的样式表，不需要改 style-src。

允许的网站

在「接入」页的「允许的网站」里，每行填一个店铺地址，例如 https://shop.example.com，然后点「保存」。

必须是 https，只有 http://localhost 可以用 http；最多 20 个。
只看协议、域名和端口，路径会被去掉。www. 和不带 www. 是两个地址，都要用就都填。
保存后很快生效，不用重新贴代码。

	还没填	填了以后
正式工作区	聊天窗口只在控制台的试聊里出现；你网站上不显示客服按钮	只在这些网站上能用
测试工作区	只在试聊和本机页面（`localhost`、`127.0.0.1`、本地 HTML 文件）上能用	不能填

在不在名单里的网站上，正式工作区的客服按钮不会出现（浏览器控制台里会写明原因）。这些网站会显示在「允许的网站」上方，写着「这些网站装了客服窗口，但还没被允许」，确认是你的店，点「允许这个网站」即可。

App 客服页不受这个名单限制。

样式

「接入」页的「客服窗口样式」可以改四项，右边有实时预览：

设置	选项
主色	6 位十六进制颜色，例如 `#1d4ed8`；默认 `#111827`
位置	右下角（默认）/ 左下角
圆角	小 / 中（默认）/ 大
标题栏	白色（默认）/ 主色

按钮、顾客的消息气泡、发送按钮上的文字固定是白色，所以主色和白色的对比度必须达到 4.5:1（WCAG AA）。颜色太浅时保存不了，页面会给出一个同色调、够深的颜色，点「改用 #……」即可换上。

保存后几秒内在你的网站上生效（刷新页面可见），最迟 5 分钟。样式只有这四项，不支持自定义 CSS。

「由 purser 提供」

聊天窗口底部有一行小字「由 purser 提供」，链接到 askpurser.com。

Free 套餐一直显示，关不掉。
Starter、Growth、Scale 可以在「设置 → 套餐与账单」的「由 purser 提供」卡片里关掉。
付费套餐到期或付款失败超过宽限期、按免费版限制时，它会重新显示。

已登录的顾客

默认所有对话都是匿名的：AI 不会透露任何订单信息。

要让 AI 回答「我的订单到哪了」，你的服务器要为已登录的顾客签一个身份令牌，页面把它交给聊天窗口：

<script>
  window.Purser = window.Purser || {};
  window.Purser.identity = async () => {
    const vid = localStorage.getItem("purser_vid");
    const r = await fetch("/purser-token?vid=" + encodeURIComponent(vid));
    return r.ok ? r.text() : null; // 没登录就返回 null
  };
</script>

这段放在嵌入代码之前或之后都可以。/purser-token 是你自己网站上的接口，purser_vid 是嵌入脚本在浏览器里生成的访客 ID。

令牌最长 10 分钟有效，只能用一次，并且绑定这个访客 ID。
令牌无效时对话按匿名处理，不会报错。
顾客登录或退出后调用 Purser.identify(新令牌或 null)，窗口会开始一段新对话。页面不再给令牌时，下一次打开就是新的匿名对话，不会接着上一位顾客的对话。

签名方法和完整规则见身份令牌。

聊天开始前的自助入口

顾客还没发第一条消息时，开场白下面会出现：

「查询我的订单」按钮：只对已登录的顾客显示，而且他在你这里有订单时才显示（没有订单数据的网站，比如 SaaS，不会出现）。点一下，他最近的 3 张订单的状态和物流用固定模板直接回复，不经过 AI，不计 AI 对话；包裹有问题（丢件、异常、退回）时会同时转给人工。
常见问题：打开了帮助中心时，列出最多 5 篇文章（优先显示标了「常见问题」的，按顾客的语言）。点一篇，答案直接显示在聊天窗口里，并附「查看完整文章」链接；同样不经过 AI、不计量。

顾客一发消息，这块就收起来。

语言

窗口界面（输入框、按钮、提示）有 12 种语言：English、简体中文、繁體中文、日本語、한국어、Español、Français、Deutsch、Português、ภาษาไทย、Tiếng Việt、Bahasa Indonesia。

界面语言依次取：Purser.setLocale(code) 设置的语言 → 脚本上的 data-locale → 网页 <html lang> 的语言 → 顾客浏览器的语言。台湾、香港、澳门的中文用繁体。不在列表里的语言显示英文。
中英双语网站（例如 /docs 和 /zh/docs）只要每种语言的页面写对 <html lang>，窗口就跟着页面走；单页应用切换语言时改了 <html lang>，开着的窗口也会跟着换，不用刷新。
用 data-locale 可以固定界面语言，这时不再跟随 <html lang>。