diff --git a/docs/docs/Concepts/mcp-server.md b/docs/docs/Concepts/mcp-server.md index d787c8019..0de1abf67 100644 --- a/docs/docs/Concepts/mcp-server.md +++ b/docs/docs/Concepts/mcp-server.md @@ -21,6 +21,8 @@ As an MCP server, Langflow exposes your flows as [tools](https://modelcontextpro * Any LTS version of [Node.js](https://docs.npmjs.com/downloading-and-installing-node-js-and-npm) installed on your computer to use MCP Inspector to [test and debug flows](#test-and-debug-flows). +* [ngrok installed](https://ngrok.com/docs/getting-started/#1-install-ngrok) and an [ngrok authtoken](https://dashboard.ngrok.com/get-started/your-authtoken) if you want to [deploy a public Langflow server](/deployment-public-server). + ## Select and configure flows to expose as MCP tools {#select-flows-to-serve} Langflow runs a separate MCP server for every [project](/concepts-overview#projects). @@ -88,7 +90,8 @@ For example: ``` The **MCP Server** tab automatically includes the correct `PROJECT_NAME`, `LANGFLOW_SERVER_ADDRESS`, and `PROJECT_ID` values. - The default Langflow server address is `http://localhost:7860` (`http://localhost:7868` if using Langflow for Desktop). + The default Langflow server address is `http://localhost:7860`. + If you have [deployed a public Langflow server](/deployment-public-server), the address is automatically included. :::important If your Langflow server [requires authentication](/configuration-authentication) ([`LANGFLOW_AUTO_LOGIN`](/environment-variables#LANGFLOW_AUTO_LOGIN) is set to `false`), you must include your Langflow API key in the configuration. @@ -151,6 +154,11 @@ To include environment variables with your MCP server command, include them like Replace `KEY` and `VALUE` with the environment variable name and value you want to include. +{/* The anchor on this section (deploy-your-server-externally) is currently a link target in the Langflow UI. Do not change. */} +### Deploy your MCP server externally {#deploy-your-server-externally} + +To deploy your MCP server externally with ngrok, see [Deploy a public Langflow server](/deployment-public-server). + ## Name and describe your flows for agentic use {#name-and-describe-your-flows} MCP clients like [Cursor](https://www.cursor.com/) "see" your Langflow project as a single MCP server, with _all_ of your enabled flows listed as tools. @@ -225,84 +233,6 @@ The default address is `http://localhost:6274`. 5. To quit MCP Inspector, press Control+C in the same terminal window where you started it. -{/* The anchor on this section (deploy-your-server-externally) is currently a link target in the Langflow UI. Do not change. */} -## Deploy your MCP server externally {#deploy-your-server-externally} - -By default, Langflow isn't exposed to the public internet. -However, you can forward Langflow server traffic with a forwarding platform like [ngrok](https://ngrok.com/docs/getting-started/) or [zrok](https://docs.zrok.io/docs/getting-started). - -The following procedure uses ngrok, but you can use any similar reverse proxy or forwarding platform. -This procedure also assumes that you're using the default Langflow listening address `http://localhost:7860` (`http://localhost:7868` if using Langflow for Desktop). - -1. Sign up for an [ngrok account](https://dashboard.ngrok.com/signup). - -2. [Install ngrok](https://ngrok.com/docs/getting-started/#1-install-ngrok). - -3. Copy your [ngrok authtoken](https://dashboard.ngrok.com/get-started/your-authtoken) and use it to authenticate your local ngrok server: - - ```bash - ngrok config add-authtoken NGROK_TOKEN - ``` - - Replace `NGROK_TOKEN` with your ngrok authtoken. - -4. Use ngrok to expose your Langflow server to the public internet: - - ```bash - ngrok http http://localhost:7860 - ``` - - The ngrok session starts in your terminal and deploys an ephemeral domain with no authentication. - To add authentication or deploy a static domain, see the [ngrok documentation](https://ngrok.com/docs/). - - - The `Forwarding` row displays the forwarding address for your Langflow server: - - ``` - Forwarding https://94b1-76-64-171-14.ngrok-free.app -> http://localhost:7860 - ``` - - The forwarding address is acting as a reverse proxy for your Langflow server. - -5. From the Langflow dashboard, select the project that contains the flows you want to serve as tools, and then click the **MCP Server** tab. - - Note that the code template now contains your ngrok forwarding address instead of the localhost address: - - ```json - { - "mcpServers": { - "PROJECT_NAME": { - "command": "uvx", - "args": [ - "mcp-proxy", - "https://94b1-73-64-171-14.ngrok-free.app/api/v1/mcp/project/fdbc12af-0dd4-43dc-b9ce-c324d1ce5cd1/sse" - ] - } - } - } - ``` - -6. Complete the steps in [Connect clients to Langflow's MCP server](#connect-clients-to-use-the-servers-actions) using the ngrok forwarding address. - -Your MCP client is now connected to your project's MCP server over the public internet. - -If using Cursor, your conversations are the same as they are on your local host: - -``` -{ - "input_value": "What job experience does Emily have?" -} -Result: -What job experience does Emily have? -Emily J. Wilson has the following job experience: -``` - -You can use the ngrok console output to monitor requests for your project's endpoint: - -``` -16:35:48.566 EDT GET /api/v1/mcp/project/fdbc12af-0dd4-43dc-b9ce-c324d1ce5cd1 200 OK -``` - ## Troubleshooting MCP server If Claude for Desktop is not using your server's tools correctly, you may need to explicitly define the path to your local `uvx` or `npx` executable file in the `claude_desktop_config.json` configuration file. diff --git a/docs/docs/Deployment/deployment-public-server.md b/docs/docs/Deployment/deployment-public-server.md new file mode 100644 index 000000000..15430d9c9 --- /dev/null +++ b/docs/docs/Deployment/deployment-public-server.md @@ -0,0 +1,139 @@ +--- +title: Deploy a public Langflow server +slug: /deployment-public-server +--- + +By default, your Langflow server at `http://localhost:7860` isn't exposed to the public internet. +However, you can forward Langflow server traffic with a forwarding platform like [ngrok](https://ngrok.com/docs/getting-started/) or [zrok](https://docs.zrok.io/docs/getting-started) to make your server public. + +When your Langflow server is public, you can do things like [deploy your Langflow MCP server externally](#deploy-your-mcp-server-externally), [serve API requests](#serve-api-requests), and [share your playground externally](#share-your-playground-externally). + +## Prerequisites + +- [Install Langflow.](/get-started-installation) + +- Install a reverse proxy or forwarding service. + + This guide uses ngrok, but you can use any similar reverse proxy or forwarding platform. + + If you want to follow along with this guide, [install ngrok](https://ngrok.com/docs/getting-started/#1-install-ngrok) and [create an ngrok authtoken](https://dashboard.ngrok.com/get-started/your-authtoken). + +## Expose your Langflow server with ngrok + +1. Start Langflow: + + ```bash + uv run langflow run + ``` + +2. In another terminal window, use your ngrok authtoken to authenticate your local ngrok server: + + ```bash + ngrok config add-authtoken NGROK_AUTHTOKEN + ``` + +3. Use ngrok to expose your Langflow server to the public internet: + + ```bash + ngrok http http://localhost:7860 + ``` + + This example assumes that you use the default Langflow listening address at `http://localhost:7860`. If you have a different listening address, you must modify this command accordingly. + + The ngrok session starts in your terminal and deploys an ephemeral domain with no authentication. + To add authentication or deploy a static domain, see the [ngrok documentation](https://ngrok.com/docs/). + + The `Forwarding` line prints the forwarding address for your Langflow server: + + ``` + Forwarding https://94b1-76-64-171-14.ngrok-free.app -> http://localhost:7860 + ``` + + The forwarding address acts as a reverse proxy for your Langflow server, and ngrok forwards your local traffic to this domain. + +4. To verify that your Langflow server is publicly available, navigate to the forwarding address URL, such as `https://94b1-76-64-171-14.ngrok-free.app`. + +## Use a public Langflow server + +When your Langflow server is public, you can do things like [deploy your Langflow MCP server externally](#deploy-your-mcp-server-externally), [serve API requests](#serve-api-requests), and [share a Playground as a public website](#share-your-playground-externally). + +### Deploy your MCP server externally + +After you deploy a public Langflow server, you can also access your Langflow projects' MCP servers publicly. + +To do this, use your server's forwarding address when you [connect a client to a Langflow MCP server](/mcp-server#connect-clients-to-use-the-servers-actions). +### Serve API requests + +To send requests to a public Langflow server's [Langflow API](/api-reference-api-examples) endpoints, use the server's domain as the [base URL](/api-reference-api-examples#base-url) for your API requests. +For example: + +```bash +curl -X POST \ + "$PUBLIC_SERVER_DOMAIN/api/v1/webhook/$FLOW_ID" \ + -H "Content-Type: application/json" \ + -H "x-api-key: $LANGFLOW_API_KEY" \ + -d '{"data": "example-data"}' +``` + +:::tip +For flows created on public Langflow servers, the code snippets generated in the [**API access** pane](/concepts-publish) automatically use your public server's domain. +::: + +You also use your public domain when making Langflow API calls in scripts, including the code snippets that are automatically generated by Langflow. +For example, the following code snippet calls an ngrok domain to trigger the specified flow (`d764c4b8...`): + + ```python + import requests + + url = "https://3f7c-73-64-93-151.ngrok-free.app/api/v1/run/d764c4b8-5cec-4c0f-9de0-4b419b11901a" # The complete API endpoint URL for this flow + + # Request payload configuration + payload = { + "output_type": "chat", + "input_type": "chat", + "input_value": "Hello" + } + + # Request headers + headers = { + "Content-Type": "application/json", + "x-api-key: $LANGFLOW_API_KEY" + } + + try: + # Send API request + response = requests.request("POST", url, json=payload, headers=headers) + response.raise_for_status() # Raise exception for bad status codes + + # Print response + print(response.text) + + except requests.exceptions.RequestException as e: + print(f"Error making API request: {e}") + except ValueError as e: + print(f"Error parsing response: {e}") + ``` + +For a demo of the Langflow API in a script, see the [Quickstart](/get-started-quickstart). + +### Share your playground externally + +The **Shareable playground** option exposes the **Playground** for a single flow at the `/public_flow/{flow-id}` endpoint. + +This allows you to share a public URL with another user that displays only the **Playground** chat window for the specified flow. + +The user can interact with the flow's chat input and output and view the results without requiring a Langflow installation or API keys of their own. + +:::important +The **Sharable Playground** is for testing purposes only. + +The **Playground** isn't meant for embedding flows in applications. For information about running flows in applications or websites, see [About developing and configuring Langflow applications](/develop-overview) and [Publish flows](/concepts-publish). +::: + +To share a flow's **Playground** with another user, do the following: + +1. In Langflow, open the flow you want share. +2. From the **Workspace**, click **Share**, and then enable **Shareable Playground**. +3. Click **Shareable Playground** again to open the **Playground** window. +This window's URL is the flow's **Sharable Playground** address, such as `https://3f7c-73-64-93-151.ngrok-free.app/playground/d764c4b8-5cec-4c0f-9de0-4b419b11901a`. +4. Send the URL to another user to give them access to the flow's **Playground**. \ No newline at end of file diff --git a/docs/sidebars.js b/docs/sidebars.js index 71e24dbea..49c4863d7 100644 --- a/docs/sidebars.js +++ b/docs/sidebars.js @@ -154,6 +154,11 @@ module.exports = { id: "Deployment/deployment-docker", label: "Docker" }, + { + type: "doc", + id: "Deployment/deployment-public-server", + label: "Deploy a public Langflow server" + }, { type: "doc", id: "Deployment/deployment-caddyfile",