Connect Langflow to a website chat widget

This recipe puts your Langflow app behind a a website chat widget bot. LangBot receives messages from a website chat widget, runs them through a pipeline, and sends the answer back, so you do not write any platform code.

Langflow builds agents and flows with a drag-and-drop editor. LangBot runs a flow through the Langflow API for every message.

What you need

• A running LangBot instance: LangBot Cloud (no server needed) or a self-hosted deployment with Docker or uvx langbot.
• A Langflow account or instance that LangBot can reach over the network.
• Nothing from a third party. Optionally a Cloudflare Turnstile site key and secret key for anti-abuse.

Networking

Visitors' browsers talk to LangBot directly, so LangBot must be reachable at a public HTTPS address. LangBot Cloud includes one.

1. Prepare Langflow

1. Build a flow in Langflow (the Simple Agent template is a good start).
2. Create an API key under Settings.
3. Copy the Flow ID from Share → API access.

2. Create a pipeline

Open Pipelines in the LangBot WebUI, create a pipeline (or edit the default one) and set AI as follows. If the runner is not listed, install the official runner plugin from Plugins or the LangBot Space marketplace.

3. Create the a website chat widget bot

1. Create a bot with the Web Page Bot adapter and bind a pipeline.
2. Copy the embed code into your site and replace localhost:5300 with LangBot's public address.

4. Bind and test

Open the bot, select the pipeline you created, save and make sure the bot is enabled.

Open the page with the widget and start a conversation.

Troubleshooting

• Connection refused: http://localhost:7860 only works when Langflow runs on the same host and network namespace as LangBot.
• The widget does not load: the embed code still points at localhost, or the LangBot address is not served over HTTPS.
• Check Monitoring in the WebUI: every message, pipeline run and error is recorded there.

FAQ

Do I need a server with a public IP for a website chat widget?

Yes, or use LangBot Cloud. Visitors' browsers talk to LangBot directly, so LangBot must be reachable at a public HTTPS address. LangBot Cloud includes one.

Does the a website chat widget bot support streaming replies?

Check the platform feature matrix for what this platform supports. Replies are delivered once the AI back end has finished.

Can the same Langflow setup serve other platforms too?

Yes. A pipeline can be bound to many bots, so one configuration can answer on several platforms at once.

Related guides

• Full a website chat widget setup guide
• Full Langflow runner guide
• Other AI back ends on a website chat widget: Dify · n8n · Coze · DeepSeek · OpenAI (ChatGPT models)
• Langflow on other platforms: Telegram · Discord · Slack · Lark (Feishu) · DingTalk · WeCom (internal app)