From 5ea064b99b65342f7e3e39e7bb90561d728834d0 Mon Sep 17 00:00:00 2001 From: Felarof Date: Tue, 13 Jan 2026 14:49:13 -0800 Subject: [PATCH] docs: update docs for n8n --- docs/docs.json | 7 ++- docs/integrations/n8n.mdx | 105 ++++++++++++++------------------------ 2 files changed, 43 insertions(+), 69 deletions(-) diff --git a/docs/docs.json b/docs/docs.json index 49fa24d96..ad262d230 100644 --- a/docs/docs.json +++ b/docs/docs.json @@ -47,7 +47,12 @@ "features/llm-chat-hub", "features/scheduled-tasks", "features/ad-blocking", - "features/use-with-claude-code", + "features/use-with-claude-code" + ] + }, + { + "group": "Integrations", + "pages": [ "integrations/n8n" ] }, diff --git a/docs/integrations/n8n.mdx b/docs/integrations/n8n.mdx index 7465d8507..9113c0a6f 100644 --- a/docs/integrations/n8n.mdx +++ b/docs/integrations/n8n.mdx @@ -1,101 +1,70 @@ --- title: "n8n Integration" -description: "Connect BrowserOS MCP to n8n for AI-powered browser automation workflows" -icon: "workflow" +description: "Build AI workflows that control your browser" --- -Build AI workflows that automate browser tasks using n8n and BrowserOS MCP. +Connect BrowserOS to n8n to build automated workflows. Your n8n AI agents can control the browser—open pages, click buttons, extract data, and fill forms. + +## What You Can Build + +- **Lead enrichment** — Pull a list of LinkedIn URLs from a spreadsheet and scrape each profile +- **Price monitoring** — Check product prices hourly and send a Slack alert when they drop +- **Form automation** — Auto-fill job applications using data from your CRM +- **Data extraction** — Scrape authenticated pages that require login ## Prerequisites -- Node.js and npm installed ([nodejs.org](https://nodejs.org)) -- BrowserOS running with MCP server enabled -- LLM API key (OpenAI, Claude, etc.) +Before you start: +- BrowserOS running with MCP server enabled (Settings → BrowserOS as MCP) +- n8n running locally (`npx n8n` or install globally with `npm install -g n8n`) ## Setup -### Step 1: Install and Run n8n +### 1. Install the MCP community node -Run n8n locally: +In n8n, go to **Settings → Community Nodes** and install `n8n-nodes-mcp`: -```bash -npx n8n -``` +Installing n8n-nodes-mcp community node -Access n8n at `http://localhost:5678` and complete the initial setup by creating an account. +### 2. Create a workflow - - For global installation: `npm install n8n -g`, then run `n8n` anytime. - +Build a workflow with these nodes: -### Step 2: Install MCP Community Node - -Go to **Settings → Community Nodes** and install `n8n-nodes-mcp`: - - - ![Install n8n-nodes-mcp community node](/images/n8n-node.png) - - -### Step 3: Create Workflow - -Create a new workflow with: - -1. Add a **Chat Trigger** node (this receives user messages) +1. Add a **Chat Trigger** node (receives your messages) 2. Add an **AI Agent** node and connect it to the trigger -3. Under the AI Agent, click **Chat Model** and add your LLM (e.g., OpenAI Chat Model) -4. Under the AI Agent, click **Tool** → search "mcp" → select **MCP Client Tool** +3. Add a **Chat Model** under the AI Agent (e.g., OpenAI, Claude) +4. Add an **MCP Client Tool** under the AI Agent - - ![Workflow with AI Agent and MCP Client](/images/n8n-step3-workflow.png) - +n8n workflow with AI Agent and MCP Client -### Step 4: Configure AI Agent Prompt +### 3. Configure the AI Agent -In the AI Agent node, set **Source for Prompt (User Message)** to **Connected Chat Trigger Node**. +In the AI Agent node, set **Source for Prompt** to **Connected Chat Trigger Node**. - - ![Configure AI Agent prompt](/images/n8n-step4-agent-prompt.png) - +AI Agent prompt configuration -### Step 5: Configure MCP Client +### 4. Connect to BrowserOS -Click on the **MCP Client** node and configure: +Click on the MCP Client node and configure: -1. **Endpoint**: Copy your MCP URL from BrowserOS (e.g., `http://127.0.0.1:9228/mcp`) -2. **Server Transport**: `HTTP Streamable` +- **Endpoint**: Your BrowserOS MCP URL (find it in Settings → BrowserOS as MCP) +- **Server Transport**: `HTTP Streamable` - - Find your MCP URL in BrowserOS under **Settings → MCP**. - +MCP Client configuration with BrowserOS URL - - ![Configure MCP Client node](/images/n8n-step5-mcp-client.png) - +### 5. Test it -### Step 6: Test Workflow - -Save the workflow, click **Open chat**, and send a message: +Save the workflow, click **Open chat**, and try: ``` -open google.com on browserOS +open google.com in BrowserOS ``` - - ![Test the workflow](/images/n8n-step6-test.png) - +Testing the workflow ## Troubleshooting - - Connection issues? Verify: - - - BrowserOS is running - - MCP server is enabled in BrowserOS settings - - Port number matches your BrowserOS MCP configuration - - -## Resources - - - Learn more about BrowserOS MCP - \ No newline at end of file +If the connection fails: +- Make sure BrowserOS is running +- Check that MCP server is enabled in BrowserOS settings +- Verify the port number matches your BrowserOS MCP URL