网页聊天挂件

挂件在你的网站上放一个聊天启动按钮。它开启的会话会进到和 WhatsApp 同一个收件箱，用同一套工具处理。网站访客默认是匿名的，所以在你告诉 Juno 他是谁之前，他的聊天是独立的一段会话——见文末关于会话的那一节。

安装

一行，放在 </body> 之前：

<script src="https://juno.medpath.com/widget.js" data-key="WIDGET_KEY" data-api="https://juno.medpath.com" async></script>

• data-key（必填）——工作区的挂件密钥，在渠道 → 网页挂件里取。
• data-api（在 juno.medpath.com 之外必填）——API 源站。用你加载 widget.js 的那个域名。

安装就这些。挂件会在右下角挂一个启动按钮，在 Shadow DOM 里渲染（不会和你页面的 CSS 打架），并实时流式显示助手的回复。

挂件密钥是我们签发的一个能力，不是你设定的秘密。它出现在页面源码里是安全的——它只标识工作区，别的什么都不标识。

用 JavaScript 驱动它

脚本会定义一个全局的 Juno。如果要在脚本加载完成之前就调用它，在你自己的调用之前加上这个 stub——它会把调用缓冲到挂件就绪：

<script>
  window.Juno = window.Juno || function () { (Juno.q = Juno.q || []).push(arguments) };
</script>

在 React 应用里

在一个 effect 里挂载一次：

useEffect(() => {
  const s = document.createElement('script')
  s.src = 'https://juno.medpath.com/widget.js'
  s.async = true
  s.dataset.key = 'WIDGET_KEY'
  s.dataset.api = 'https://juno.medpath.com'
  document.body.appendChild(s)
}, [])

验证

打开页面点启动按钮。发一条消息——如果 AI 助手已启用，几秒内会有回复，同时这段会话会出现在收件箱里。

访客的会话是什么

第一次来的访客是匿名的。挂件在浏览器里生成一个 visitor id，服务端在访客发出第一条消息时签发一张短时效的会话票据——能让面板之后回放这段会话历史的是票据，不是那个 id。

实际后果是：清了浏览器数据的访客会开始一段新会话；还没有票据的访客照样能正常实时聊天，只是没有历史存档。如果你需要让回访的访客被识别为某个特定的人，那是身份而不是会话，需要走 identify 流程而不是挂件密钥。