<!-- 来源: https://hostanagent.com/docs/integration/widget/ | 协议: 1.0 | 更新: 2026-09-30 -->

# 聊天组件

`@hostanagent/chat-widget@0.2.5` 提供内嵌、侧栏和浮窗模式，也可以只安装 Client Core 自建界面。Widget 只负责展示和用户交互，不会因为历史回放、挂载或重连而自动执行产品工具。

## 固定版本脚本

以下脚本可用固定版本 UNPKG 地址。产品页面仍需先部署自己的同源 `/api/agent` 代理，按登录态控制身份和权限；组件脚本不应持有应用 Key。

```html
<div id="assistant" style="height:600px"></div>
<script src="https://unpkg.com/@hostanagent/chat-widget@0.2.5/dist/agent-chat.js"
  integrity="sha384-f/Z5a1nBJgPwCmUBTTvSFhK8xiG/oFjU3sAIcuj3PTkq0rvTw9+2/9d9pgY5PIx2"
  crossorigin="anonymous"></script>
<script>
  AgentChat.mount('#assistant', {
    endpoint: '/api/agent',
    agentId: '替换为已发布的 Agent ID',
    mode: 'inline',
  });
</script>
```

严格 CSP 的产品将挂载代码放入自己的外部脚本。也可安装 npm 包 `@hostanagent/chat-widget@0.2.5` 或自托管同一独立脚本并保留 MIT 声明。`mode` 可为 `inline`、`sidebar`、`popup`。在新产品代理中挂载时，若直接指定 `agentVersion`，应同时传入 bootstrap 的 `identityId`，或使用已初始化的 Client Core 客户端；参考[JS 接入](/docs/integration/javascript/)。

Widget 展示受控 Markdown、代码复制、公开推理、工具/确认卡片。模型 HTML 按文本处理，不执行模型脚本。附件回调传递的是产品授权的资源引用，不会自动把图片或音频输入模型。默认不把聊天正文写进浏览器本地持久存储；产品若需要自己的聊天副本，应自行实现和告知用户。[当前数据边界](/docs/help/data-lifecycle/)。

恢复已有 Session 时继续使用它原来的 Agent 版本。身份切换应销毁旧视图、撤销旧 runner、重置客户端身份，再按新登录态重新 bootstrap。视图关闭只释放观察连接；明确取消 Run 和产品业务任务仍是不同操作。[断线与恢复](/docs/integration/recovery/)。
