Web 和 H5 接入

访客端是提供给网站访客使用的在线咨询页面。完成接入后，访客可以通过网站悬浮入口或独立咨询 URL 打开聊天窗口，向客服发送文字、图片和文件，并查看客服回复。

接入方式

代码接入

将系统生成的接入代码放入网站页面后，网站右下角会显示咨询入口。访客点击悬浮按钮即可打开对话窗口。

部署页面的“代码形式”区域提供完整的 kf.js 接入代码，复制到网站页面即可完成代码接入。

代码接入配置

下面是一个可直接运行的空 HTML 页面示例。将代码保存为 .html 文件并用浏览器打开，即可看到客服悬浮入口：

html

<!doctype html>
<html lang="zh-CN">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>在线咨询</title>
</head>
<body>
  <script src="https://live.99kf.com/static/js/kf.js"></script>
  <script>
    window.kfVisitor = KFVisitor.init({
      "businessId": "afxGIDLM",
      "groupId": 0,
      "baseUrl": "https://live.99kf.com",
      "displayMode": "floating",
      "theme": { "primaryColor": "#2563eb" },
      "preconnect": false,
      "icon": "https://live.99kf.com/icons/afxGIDLM/11/icon.png"
    });
  </script>
</body>
</html>

代码接入效果

URL 接入（Web 端）

直接打开系统提供的咨询 URL，即可进入 Web 端咨询页面。该页面适合在电脑浏览器中使用，右侧可以展示常见问题等辅助内容。

部署页面的“链接形式”区域提供可直接访问的咨询 URL，将该链接放入网页按钮、菜单或其他入口即可使用。

URL 接入配置

URL 接入 Web 端效果

URL 接入（移动端）

在手机浏览器中打开咨询 URL 时，系统会使用移动端布局，访客可以在手机上完成消息发送和会话沟通。

访客字段

代码接入时可配置以下字段：

字段	必填	说明
`businessId`	是	商家 ID。
`groupId`	否	客服分组 ID；不填时使用默认分组。
`baseUrl`	否	客服系统地址；不填时使用 `kf.js` 的加载地址。
`displayMode`	否	打开方式：`floating` 为页面浮层，`window` 为新窗口；默认 `floating`。
`channel`	否	访客渠道来源。可自定义为任意文本，最多 32 个字符，例如 `小红书投放 #1`；未设置时为 `web`。
`visitor`	否	访客资料，可传用户 ID、昵称、头像和扩展属性。
`contexts`	否	当前咨询的商品、订单等上下文。

KFVisitor.init({
  businessId: 'afxGIDLM',
  channel: '小红书 投放 #1'
})

Web 和 H5 接入 ​

接入方式 ​

代码接入 ​

URL 接入（Web 端） ​

URL 接入（移动端） ​