Langflow
把 Langflow 接入网页聊天挂件
使用 LangBot 把 Langflow 应用接入网页聊天挂件:Langflow 配置、机器人凭据、网络要求、测试与常见问题。
本文把你的 Langflow 应用接到网页聊天挂件机器人上。LangBot 接收网页聊天挂件消息,交给流水线处理后把答案发回去,你不需要写任何平台对接代码。
Langflow 用拖拽方式搭建 Agent 和流程。LangBot 在每条消息到来时通过 Langflow API 运行你的流程。
准备工作
- 一个运行中的 LangBot:LangBot Cloud(无需服务器),或用 Docker、
uvx langbot自行部署。 - LangBot 能通过网络访问到的 Langflow 账号或实例。
- 不需要第三方凭据。可选:用于防刷的 Cloudflare Turnstile Site Key 和 Secret Key。
网络要求
访客的浏览器会直接连接 LangBot,因此 LangBot 需要可公网访问的 HTTPS 地址;LangBot Cloud 自带。
1. 准备 Langflow
- 在 Langflow 中搭建流程(可以从 Simple Agent 模板开始)。
- 在 Settings 中创建 API Key。
- 在 Share → API access 的示例代码中找到 Flow ID。
2. 创建流水线
在 LangBot WebUI 打开 流水线,新建流水线(或编辑默认流水线),按下表配置 AI 能力。如果列表里没有对应运行器,请先在 插件 或 LangBot Space 插件市场 安装官方运行器插件。
| 配置项 | 填写 |
|---|---|
| 运行器 | Langflow(官方 Langflow Agent 运行器插件) |
| Base URL | LangBot 能访问到的 Langflow 地址 |
| API Key | Langflow API Key |
| Flow ID | 要运行的流程 ID |
3. 创建网页聊天挂件机器人
- 新建机器人,选择 网页机器人 适配器并绑定流水线。
- 把嵌入代码放进你的网站,并把其中的
localhost:5300换成 LangBot 的公网地址。
4. 绑定并测试
打开机器人,选择刚才创建的流水线,保存并确认机器人已启用。
打开嵌入了挂件的网页,发起对话。
常见问题排查
- 连接被拒绝:只有 Langflow 与 LangBot 在同一主机、同一网络命名空间时,
http://localhost:7860才可用。 - 挂件加载不出来:嵌入代码仍指向
localhost,或 LangBot 地址没有使用 HTTPS。 - 在 WebUI 的 监控 页面可以看到每条消息、每次流水线运行和错误详情。
常见问题
接入网页聊天挂件需要有公网 IP 的服务器吗?
需要,或者直接使用 LangBot Cloud。访客的浏览器会直接连接 LangBot,因此 LangBot 需要可公网访问的 HTTPS 地址;LangBot Cloud 自带。
网页聊天挂件机器人支持流式回复吗?
请查看平台功能对照表了解该平台支持的能力;AI 后端生成完成后会一次性发送回复。
同一套 Langflow 配置能同时用在其他平台吗?
可以。一条流水线可以绑定多个机器人,同一套配置能同时在多个平台上回复。
相关文档
- 网页聊天挂件完整接入文档
- Langflow 运行器完整文档
- 网页聊天挂件上的其他 AI 后端:Dify · n8n · Coze · DeepSeek · OpenAI (ChatGPT models)
- Langflow 接入其他平台:Telegram · Discord · Slack · 飞书 · 钉钉 · 企业微信应用
