drio
Open app

Cloudflare Browser Rendering Experiments & MCP Server

Source

This project demonstrates how to use Cloudflare Browser Rendering to extract web content for LLM context. It includes experiments with the REST API and Workers Binding API, as well as an MCP server implementation that can be used to provide web context to LLMs.

Catalog onlyCatalog onlySTDIO

Overview

Cloudflare Browser Rendering is a project that demonstrates how to extract web content for LLM context using Cloudflare's Browser Rendering capabilities. It includes experiments with the REST API and Workers Binding API, along with an MCP server implementation.

To use this project, clone the repository, install the necessary dependencies, and set up a Cloudflare Worker with the provided examples. You can run various experiments to fetch and process web content.

  • Integration with Cloudflare's Browser Rendering for web content extraction. - Support for REST API and Workers Binding API. - MCP server for processing web content for LLMs. - Example implementations and utilities for easy setup.
  1. Extracting web content for use in language models.
  2. Automating web scraping tasks using Cloudflare's infrastructure.
  3. Providing web context to LLMs for enhanced responses.

Add to your AI client

Use these steps to connect Cloudflare Browser Rendering Experiments & MCP Server in Cursor, Claude, VS Code, and other MCP-compatible apps. The same JSON appears in the Use with menu above for one-click copy.

Cursor

Add this to your .cursor/mcp.json file in your project root, then restart Cursor.

.cursor/mcp.json

{
  "mcpServers": {
    "cloudflare-browser-rendering-amotivv": {
      "command": "npx",
      "args": [
        "-y",
        "@modelcontextprotocol/server-cloudflare-browser-rendering-amotivv"
      ]
    }
  }
}

Claude Desktop

Add this server entry to the mcpServers object in your Claude Desktop config, then restart the app.

~/Library/Application Support/Claude/claude_desktop_config.json (macOS) or %APPDATA%\Claude\claude_desktop_config.json (Windows)

{
  "mcpServers": {
    "cloudflare-browser-rendering-amotivv": {
      "command": "npx",
      "args": [
        "-y",
        "@modelcontextprotocol/server-cloudflare-browser-rendering-amotivv"
      ]
    }
  }
}

Claude Code

Add this to your project's .mcp.json file. Claude Code will detect it automatically.

.mcp.json (project root)

{
  "mcpServers": {
    "cloudflare-browser-rendering-amotivv": {
      "command": "npx",
      "args": [
        "-y",
        "@modelcontextprotocol/server-cloudflare-browser-rendering-amotivv"
      ]
    }
  }
}

VS Code (Copilot)

Add this to your .vscode/mcp.json file. Requires the GitHub Copilot extension with MCP support enabled.

.vscode/mcp.json

{
  "servers": {
    "cloudflare-browser-rendering-amotivv": {
      "type": "stdio",
      "command": "npx",
      "args": [
        "-y",
        "@modelcontextprotocol/server-cloudflare-browser-rendering-amotivv"
      ]
    }
  }
}

Windsurf

Add this to your Windsurf MCP config file, then restart Windsurf.

~/.codeium/windsurf/mcp_config.json

{
  "mcpServers": {
    "cloudflare-browser-rendering-amotivv": {
      "command": "npx",
      "args": [
        "-y",
        "@modelcontextprotocol/server-cloudflare-browser-rendering-amotivv"
      ]
    }
  }
}

Cline

Open Cline settings, navigate to MCP Servers, and add this server configuration.

Cline MCP Settings (via UI)

{
  "mcpServers": {
    "cloudflare-browser-rendering-amotivv": {
      "command": "npx",
      "args": [
        "-y",
        "@modelcontextprotocol/server-cloudflare-browser-rendering-amotivv"
      ]
    }
  }
}

FAQ

What are the prerequisites for using this project?

You need Node.js (v16 or later), a Cloudflare account with Browser Rendering enabled, TypeScript, and Wrangler CLI for deployment.

Is there a license for this project?

Yes, this project is licensed under the MIT License.

How can I run the experiments?

You can run the experiments by executing the provided npm scripts for each experiment type.