# 把 Coze 接入网页聊天挂件

Source: https://langbot.app/docs/zh/recipes/coze/web-page

使用 LangBot 把 Coze 应用接入网页聊天挂件：Coze 配置、机器人凭据、网络要求、测试与常见问题。

本文把你的 Coze 应用接到网页聊天挂件机器人上。LangBot 接收网页聊天挂件消息，交给流水线处理后把答案发回去，你不需要写任何平台对接代码。

扣子（Coze）可以可视化搭建智能体。LangBot 通过 Coze API 调用你的智能体，让它出现在扣子本身不支持发布的平台上，并在多个渠道共用同一个智能体。

## 准备工作

- 一个运行中的 LangBot：[LangBot Cloud](https://space.langbot.app/cloud)（无需服务器），或用 Docker、`uvx langbot` [自行部署](https://langbot.app/docs/zh/deploy/langbot/docker.md)。
- LangBot 能通过网络访问到的 Coze 账号或实例。
- 不需要第三方凭据。可选：用于防刷的 Cloudflare Turnstile Site Key 和 Secret Key。

## 网络要求

访客的浏览器会直接连接 LangBot，因此 LangBot 需要可公网访问的 HTTPS 地址；LangBot Cloud 自带。

## 1. 准备 Coze

1. 在扣子开发者控制台的 **API 管理** 中创建令牌（coze.cn 支持服务身份长期凭据，coze.com 只提供个人访问令牌）。
2. 发布智能体时勾选 **API** 渠道，并记录 `bot_id`。

## 2. 创建流水线

在 LangBot WebUI 打开 **流水线**，新建流水线（或编辑默认流水线），按下表配置 **AI** 能力。如果列表里没有对应运行器，请先在 **插件** 或 [LangBot Space 插件市场](https://space.langbot.app/market) 安装官方运行器插件。

| 配置项          | 填写                                                                |
| ------------ | ----------------------------------------------------------------- |
| 运行器          | **扣子**（官方扣子 Agent 运行器插件）                                          |
| API Key      | 扣子令牌                                                              |
| Bot ID       | 智能体的 `bot_id`                                                     |
| API Base URL | coze.cn 填 `https://api.coze.cn`，coze.com 填 `https://api.coze.com` |

## 3. 创建网页聊天挂件机器人

1. 新建机器人，选择 **网页机器人** 适配器并绑定流水线。
2. 把嵌入代码放进你的网站，并把其中的 `localhost:5300` 换成 LangBot 的公网地址。

## 4. 绑定并测试

打开机器人，选择刚才创建的流水线，保存并确认机器人已启用。

打开嵌入了挂件的网页，发起对话。

## 常见问题排查

- 调用失败：检查令牌和 `bot_id` 是否带了多余空格、智能体发布时是否勾选了 API 渠道、Base URL 是否与所用站点一致。
- 挂件加载不出来：嵌入代码仍指向 `localhost`，或 LangBot 地址没有使用 HTTPS。
- 在 WebUI 的 **监控** 页面可以看到每条消息、每次流水线运行和错误详情。

## 常见问题

### 接入网页聊天挂件需要有公网 IP 的服务器吗？

需要，或者直接使用 LangBot Cloud。访客的浏览器会直接连接 LangBot，因此 LangBot 需要可公网访问的 HTTPS 地址；LangBot Cloud 自带。

### 网页聊天挂件机器人支持流式回复吗？

请查看[平台功能对照表](https://langbot.app/docs/zh/insight/platform-features.md)了解该平台支持的能力；AI 后端生成完成后会一次性发送回复。

### 同一套 Coze 配置能同时用在其他平台吗？

可以。一条流水线可以绑定多个机器人，同一套配置能同时在多个平台上回复。

## 相关文档

- [网页聊天挂件完整接入文档](https://langbot.app/docs/zh/usage/platforms/webpage.md)
- [Coze 运行器完整文档](https://langbot.app/docs/zh/usage/pipelines/coze.md)
- 网页聊天挂件上的其他 AI 后端：[Dify](https://langbot.app/docs/zh/recipes/dify/web-page.md) · [n8n](https://langbot.app/docs/zh/recipes/n8n/web-page.md) · [Langflow](https://langbot.app/docs/zh/recipes/langflow/web-page.md) · [DeepSeek](https://langbot.app/docs/zh/recipes/deepseek/web-page.md) · [OpenAI (ChatGPT models)](https://langbot.app/docs/zh/recipes/openai/web-page.md)
- Coze 接入其他平台：[Telegram](https://langbot.app/docs/zh/recipes/coze/telegram.md) · [Discord](https://langbot.app/docs/zh/recipes/coze/discord.md) · [Slack](https://langbot.app/docs/zh/recipes/coze/slack.md) · [飞书](https://langbot.app/docs/zh/recipes/coze/lark.md) · [钉钉](https://langbot.app/docs/zh/recipes/coze/dingtalk.md) · [企业微信应用](https://langbot.app/docs/zh/recipes/coze/wecom.md)