ต้นแบบ · เว็บนี้เป็นต้นแบบ แสดงข้อมูลจริง 100 ตัวจากทะเบียนทางการ ยังไม่ครบทุกตัว
PopNx MCPที่รวม MCP สำหรับคนใช้ AI · อธิบายเป็นภาษาคน

MCP Server Browser

โดย bytedanceรุ่น 1.0.0i★ 39,550iรันบนเครื่อง
ชื่อใน registryio.github.bytedance/mcp-server-browser

ภาพรวม

คำอธิบายจากผู้ทำ (ภาษาอังกฤษตามต้นฉบับ)

MCP server for browser use access

สามเสาของ PopNx MCP

สามเรื่องนี้ไม่รวมเป็นคะแนนเดียว เพราะความเห็น การวัด และความนิยม เป็นคนละเรื่องกัน

ใช้ทำอะไรได้

ตัวนี้ยังไม่ได้เรียบเรียงเป็นภาษาไทย ด้านล่างคือข้อเท็จจริงที่เราอ่านจาก registry

  • การเชื่อมต่อ: รันบนเครื่อง
  • ช่องทาง (transport): stdio, SSE, Streamable HTTP
  • หมวด: เว็บและเบราว์เซอร์

ติดตั้ง

เลือกโปรแกรม AI ที่คุณใช้ แล้วคัดลอกค่าตั้งไปวาง

ต้องเตรียมก่อน

  • npmติดตั้ง Node.js (มีคำสั่ง npx) ในเครื่อง

เปิด Claude Desktop → Settings → Developer → Edit Config แล้ววางค่านี้ในไฟล์ claude_desktop_config.json

{
  "mcpServers": {
    "browser": {
      "command": "npx",
      "args": [
        "-y",
        "@agent-infra/mcp-server-browser"
      ],
      "env": {
        "DISPLAY": "ใส่ค่าของคุณ"
      }
    }
  }
}

พิมพ์คำสั่งนี้ใน Terminal

claude mcp add browser --env DISPLAY='ใส่ค่าของคุณ' -- npx -y @agent-infra/mcp-server-browser

วางในไฟล์ .cursor/mcp.json ของโปรเจกต์ หรือ ~/.cursor/mcp.json

{
  "mcpServers": {
    "browser": {
      "command": "npx",
      "args": [
        "-y",
        "@agent-infra/mcp-server-browser"
      ],
      "env": {
        "DISPLAY": "ใส่ค่าของคุณ"
      }
    }
  }
}

วางในไฟล์ .vscode/mcp.json ของโปรเจกต์

{
  "servers": {
    "browser": {
      "type": "stdio",
      "command": "npx",
      "args": [
        "-y",
        "@agent-infra/mcp-server-browser"
      ],
      "env": {
        "DISPLAY": "ใส่ค่าของคุณ"
      }
    }
  }
}

ค่าที่ต้องใส่เอง

  • DISPLAY env
    DISPLAY environment variable for browser rendering

ค่าตั้งนี้สร้างจากข้อมูลใน registry ของผู้ทำ ถ้าไม่ตรงกับ README ให้เชื่อ README

ผลตรวจเบื้องต้นi

เราตรวจจากข้อมูลที่ใครก็เปิดดูได้ ยังไม่ได้อ่านโค้ด ข้อที่ไม่เกี่ยวกับตัวนี้ไม่นับในตัวหาร · ตรวจเมื่อ 5 พ.ย. 2569

  • ✓ ผ่าน

    ตัวตนผู้ทำตรงกับ repo

    ชื่อใน registry ยืนยันด้วยบัญชี GitHub bytedance ซึ่งเป็นเจ้าของ repo

  • ✓ ผ่าน

    ยังมีคนดูแล

    มีการแก้โค้ดล่าสุด 27 วันที่ผ่านมา

  • ✓ ผ่าน

    มีสัญญาอนุญาต (license)

    ใช้ Apache-2.0

  • – ไม่เกี่ยว

    endpoint ตอบ

    ตัวนี้รันบนเครื่องคุณ ไม่มี endpoint บนอินเทอร์เน็ต

  • – ไม่เกี่ยว

    ล็อกอินแบบ OAuth

    ตัวนี้รันบนเครื่อง ใช้ค่าที่ตั้งในเครื่องแทน

  • … ยังไม่ตรวจ

    คำอธิบายเครื่องมือไม่มีคำสั่งแอบแฝง

    ต้องอ่านรายการเครื่องมือของ server ก่อน จะเริ่มตรวจในขั้นถัดไป

เทียบกับตัวอื่นในหมวด เว็บและเบราว์เซอร์i

  • ดาวมากกว่า 78% ของอีก 9 ตัวในหมวดนี้
  • ส่งรุ่นใหม่เข้า registry ล่าสุดกว่า 0% ของอีก 9 ตัวในหมวดนี้
  • ผลตรวจเบื้องต้นดีกว่าหรือเท่ากับ 100% ของอีก 9 ตัวในหมวดนี้

เทียบเฉพาะ server ที่อยู่ในต้นแบบนี้ ไม่ใช่ทั้ง registry

คำถามที่พบบ่อย

MCP Server Browser ปลอดภัยไหม?

จากการตรวจเบื้องต้นของเรา ผ่าน 3 จาก 3 ข้อที่ตรวจได้ เรายังไม่ได้อ่านโค้ด ก่อนใส่กุญแจหรือ token ให้ดูว่า server ขอสิทธิ์อะไร และเลือกกุญแจที่ทำได้เท่าที่จำเป็น

ต้องใช้กุญแจหรือรหัสอะไรบ้าง?

registry ไม่ได้ระบุว่าต้องใช้กุญแจ แต่บางตัวจะขอให้ล็อกอินตอนใช้ครั้งแรก

ตัวนี้รันบนเครื่องหรือบนคลาวด์?

รันบนเครื่องของคุณ โปรแกรม AI จะเปิด server ขึ้นมาเองเมื่อใช้ ข้อมูลไม่ต้องผ่านเซิร์ฟเวอร์ของผู้ทำ (ยกเว้นตัวที่ไปเรียกบริการออนไลน์ต่อ)

ยังมีคนดูแลอยู่ไหม?

repo บน GitHub มีการแก้โค้ดล่าสุด 27 วันที่ผ่านมา และส่งรุ่นล่าสุด (1.0.0) เข้า registry 14 เดือนที่ผ่านมา

ใช้กับโปรแกรมไหนได้บ้าง?

โปรแกรมที่รองรับ MCP เช่น Claude Desktop, Claude Code, Cursor และ VS Code ตัวนี้ต้องมี Node.js ในเครื่องด้วย

มีตัวไหนใช้แทนได้บ้าง?

ในหมวดเดียวกันมี Browser Use, Chrome DevTools MCP, Playwright MCP

ตัวที่ใช้แทนได้

server หมวดเดียวกันจากผู้ทำคนอื่น เรียงตามดาว

อ่านการ์ด:★ ดาว GitHubiสามเสา: รีวิว · ผลตรวจ · การใช้งานiอัปเดต = วันที่ส่งรุ่นล่าสุดเข้า registryi

Browser Use

โดย browser-use

ให้ AI ทำงานบนเว็บแทนคุณ เช่น กรอกฟอร์ม ค้นหา และดึงข้อมูล ใช้เบราว์เซอร์บนคลาวด์ของผู้ทำหรือรันในเครื่องก็ได้

บนเครื่องหรือคลาวด์★ 120,087MITอัปเดต 15 วันที่ผ่านมา

Chrome DevTools MCP

โดย ChromeDevTools

ให้ AI ใช้เครื่องมือนักพัฒนาของ Chrome ตรวจหน้าเว็บ ดูว่าโหลดช้าตรงไหน และหาข้อผิดพลาด ทำโดยทีม Chrome DevTools

รันบนเครื่อง★ 54,821Apache-2.0อัปเดต 14 วันที่ผ่านมา

Playwright MCP

โดย microsoft

ให้ AI เปิดเบราว์เซอร์ในเครื่องคุณ แล้วกด พิมพ์ และอ่านหน้าเว็บเหมือนคน ทำโดย Microsoft ทีมเดียวกับ Playwright

รันบนเครื่อง★ 39,198Apache-2.0อัปเดต 5 วันที่ผ่านมา

README จากผู้ทำ

เปิดอ่าน README

ส่วนนี้คัดจาก repo ของผู้ทำตามต้นฉบับ PopNx MCP ไม่ได้ตรวจหรือรับรองเนื้อหา ตัด HTML รูปภาพ และสคริปต์ออกแล้ว ลิงก์จะพาออกนอกเว็บ

Browser Use MCP Server

A fast, lightweight Model Context Protocol (MCP) server that empowers LLMs with browser automation via Puppeteer’s structured accessibility data, featuring optional vision mode for complex visual understanding and flexible, cross-platform configuration.

Key Features
  • ⚡ Fast & lightweight. Utilizes Puppeteer's label index, not pixel-based input and accessibility DOM tree.
  • 👁️ Vision Mode Support. Optional visual understanding capabilities for complex layouts and visual elements when structured data isn't sufficient.
  • 🤖 LLM-optimized. No vision models needed, operates purely on structured data, less context reducing context token usage.
  • 🧩 Flexible Runtime Configuration. Customize viewport size, coordinate system factors, and User-Agent at runtime via HTTP headers.
  • 🌐 Cross-Platform & Extensible. Support for remote and local browsers, the use of a custom browser engine.
Requirements
  • Node.js 18 or newer
  • VS Code, Cursor, Windsurf, Claude Desktop or any other MCP client
Getting started
Local (Stdio)

First, install the Browser MCP server with your client. A typical configuration looks like this:

{

"mcpServers": { "browser": { "command": "npx", "args": [ "@agent-infra/mcp-server-browser@latest" ] } } }

Install in VS Code

You can also install the Browser MCP server using the VS Code CLI:

# For VS Code

code --add-mcp '{"name":"browser","command":"npx","args":["@agent-infra/mcp-server-browser@latest"]}'

After installation, the Browser MCP server will be available for use with your GitHub Copilot agent in VS Code.

Install in Cursor

Go to Cursor Settings -> MCP -> Add new MCP Server. Name to your liking, use command type with the command npx @agent-infra/mcp-server-browser. You can also verify config or add command like arguments via clicking Edit.

{

"mcpServers": { "browser": { "command": "npx", "args": [ "@agent-infra/mcp-server-browser@latest" ] } } }

</details>

Install in Windsurf

Follow Windsuff MCP documentation. Use following configuration:

{

"mcpServers": { "browser": { "command": "npx", "args": [ "@agent-infra/mcp-server-browser@latest" ] } } }

</details>

Install in Claude Desktop

Follow the MCP install guide, use following configuration:

{

"mcpServers": { "browser": { "command": "npx", "args": [ "@agent-infra/mcp-server-browser@latest" ] } } }

</details>
Remote (SSE / Streamable HTTP)

At the same time, use --port $your_port arg to start the browser mcp can be converted into SSE and Streamable HTTP Server.

# normal run remote mcp server

npx @agent-infra/mcp-server-browser --port 8089

run with DISPLAY environment for VNC or other virtual display

DISPLAY=:0 npx @agent-infra/mcp-server-browser --port 8089

You can use one of the two MCP Server remote endpoint:

  • Streamable HTTP(Recommended): http://127.0.0.1::8089/mcp
  • SSE: http://127.0.0.1::8089/sse

And then in MCP client config, set the url to the SSE endpoint:

{

"mcpServers": { "browser": { "url": "http://127.0.0.1::8089/sse" } } }

url to the Streamable HTTP:

{

"mcpServers": { "browser": { "type": "streamable-http", // If there is MCP Client support "url": "http://127.0.0.1::8089/mcp" } } }

In-memory call

If your MCP Client is developed based on JavaScript / TypeScript, you can directly use in-process calls to avoid requiring your users to install the command-line interface to use Browser MCP.

import { Client } from '@modelcontextprotocol/sdk/client/index.js';

import { InMemoryTransport } from '@modelcontextprotocol/sdk/inMemory.js';

// type: module project usage import { createServer } from '@agent-infra/mcp-server-browser'; // commonjs project usage // const { createServer } = await import('@agent-infra/mcp-server-browser')

const client = new Client( { name: 'test browser client', version: '1.0', }, { capabilities: {}, }, );

const server = createServer(); const [clientTransport, serverTransport] = InMemoryTransport.createLinkedPair();

await Promise.all([ client.connect(clientTransport), server.connect(serverTransport), ]);

// list tools const result = await client.listTools(); console.log(result);

// call tool const toolResult = await client.callTool({ name: 'browser_navigate', arguments: { url: 'https://www.google.com', }, }); console.log(toolResult);

Configuration

Browser MCP server supports following arguments. They can be provided in the JSON configuration above, as a part of the "args" list:

> npx @agent-infra/mcp-server-browser@latest -h

-V, --version output the version number --browser browser or chrome channel to use, possible values: chrome, edge, firefox. --cdp-endpoint CDP endpoint to connect to, for example "http://127.0.0.1:9222/json/version" --ws-endpoint WebSocket endpoint to connect to, for example "ws://127.0.0.1:9222/devtools/browser/{id}" --executable-path path to the browser executable. --headless run browser in headless mode, headed by default --host host to bind server to. Default is localhost. Use 0.0.0.0 to bind to all interfaces. --port port to listen on for SSE and HTTP transport. --proxy-bypass comma-separated domains to bypass proxy, for example ".com,chromium.org,.domain.com" --proxy-server specify proxy server, for example "http://myproxy:3128" or "socks5://myproxy:8080" --user-agent specify user agent string --user-data-dir path to the user data directory. --viewport-size specify browser viewport size in pixels, for example "1280, 720" --output-dir path to the directory for output files --vision Run server that uses screenshots (Aria snapshots are used by default) -h, --help display help for command

Runtime Configuration

The browser runtime requires configuration for Viewport Size, Vision Model Coordinate Factors, and User Agent. These can be passed through corresponding HTTP headers:

HeaderDescription
x-viewport-sizeBrowser viewport size, format: width,height separated by comma
x-vision-factorsVision model coordinate system factors, format: x_factor,y_factor separated by comma
x-user-agentUser Agent string, defaults to system User Agent if not specified

Note: Header names are case-insensitive.

Example:

x-viewport-size: 1920,1080

x-vision-factors: 1.0,1.0 x-user-agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36

Docker

We have unified the deployment of VNC and MCP under a single URL endpoint, The Dockerfile and DockerHub image will be published together! video

API
Tools
Tool NameDescriptionParameters
browser_clickClick an element on the page, before using the tool, use browser_get_clickable_elements to get the index of the element, but not call browser_get_clickable_elements multiple timesindex (number, optional): Index of the element to click
browser_closeClose the browser when the task is done and the browser is not needed anymore
browser_close_tabClose the current tab
browser_evaluateExecute JavaScript in the browser consolescript (string, required): JavaScript code to execute, () => { /* code */ }

| browser_form_input_fill | Fill out an input field, before using the tool, Either 'index' or 'selector' must be provided | selector (string, optional): CSS selector for input field, priority use index, if index is not provided, use selector index (number, optional): Index of the element to fill value (string, required): Value to fill clear (boolean, optional): Whether to clear existing text before filling | | browser_get_clickable_elements | Get the clickable or hoverable or selectable elements on the current page, don't call this tool multiple times | | | browser_get_download_list | Get the list of downloaded files | | | browser_get_markdown | Get the markdown content of the current page | | | browser_get_text | Get the text content of the current page | | | browser_go_back | Go back to the previous page | | | browser_go_forward | Go forward to the next page | | | browser_hover | Hover an element on the page, Either 'index' or 'selector' must be provided | index (number, optional): Index of the element to hover selector (string, optional): CSS selector for element to hover | | browser_navigate | Navigate to a URL | url (string, required): | | browser_new_tab | Open a new tab | url (string, required): URL to open in the new tab | | browser_press_key | Press a key on the keyboard | key (string, required): Name of the key to press or a character to generate, such as Enter, Tab, Escape, Backspace, Delete, Insert, F1, F2, F3, F4, F5, F6, F7, F8, F9, F10, F11, F12, ArrowLeft, ArrowRight, ArrowUp, ArrowDown, PageUp, PageDown, Home, End, ShiftLeft, ShiftRight, ControlLeft, ControlRight, AltLeft, AltRight, MetaLeft, MetaRight, CapsLock, PrintScreen, ScrollLock, Pause, ContextMenu | | browser_read_links | Get all links on the current page | | | browser_screenshot | Take a screenshot of the current page or a specific element | name (string, optional): Name for the screenshot selector (string, optional): CSS selector for element to screenshot index (number, optional): index of the element to screenshot width (number, optional): Width in pixels (default: viewport width) **

ตัดมาแค่ช่วงต้น อ่านต่อใน repo

ถาม PopNx