照着做，30 分钟看到客服入口。

第 1 步：准备两个信息

向 DAP 管理员索取 siteId，并让管理员登记你的业务系统域名。例如：siteId 是 mall_web，域名是 https://mall.example.com。

第 2 步：把这段代码放到页面底部

找到页面末尾的 </body>，把下面代码放在它前面。只替换 YOUR_SITE_ID 和 YOUR_APP_ID。

<script
  src="https://dap.cnyu.net/sdk/loader/v1.js"
  data-api-base="https://dap.cnyu.net"
  data-site-id="YOUR_SITE_ID"
  data-app-id="YOUR_APP_ID"
  data-fallback-url="https://dap.cnyu.net/support?siteId=YOUR_SITE_ID">
</script>

data-app-id 填一个能看懂的英文名称，例如 mall-pc 或 order-h5。

第 3 步：刷新页面并检查

1. 页面右下角出现客服气泡。
2. 点击气泡，直接展开在线客服对话窗口。
3. 发送一条消息，能在窗口内看到回复；页面不会跳到工单。
4. 需要人工或异步处理时，再点击对话窗口中的“转人工客服”或“提交工单”。
5. 用手机打开，对话窗口完整可用，输入框不会被键盘或气泡遮挡。

做到这里，最小接入就完成了。在线客服与工单是连续流程：先对话，需要时再转人工或升级工单。

第 4 步：按需要增加能力

下面都不是首次接入的必填项。建议先上线客服入口，再逐项增加。

const dap = await window.OCSLoader.ready;

// 用户登录后再调用；没有账号可以不调用
await dap.identify({
  userId: "YOUR_INTERNAL_USER_ID",
  userName: "Alice"
});

// 记录一个必要的业务行为
await dap.track("order_submitted", {
  page: location.pathname
});

不要把手机号、身份证、密码或完整订单内容直接放进行为记录。

常见问题