這是一篇為你準備的 BrowserMCP 上手普及教程。



🚀 讓 AI 長出“眼睛”和“手”:BrowserMCP 新手指南

你是否想過,如果你常用的 AI 助手(比如 Cursor 或 Claude Desktop)不僅能寫代碼、陪聊天,還能直接控制你的瀏覽器去查資料、填表格、或者抓取網頁數據,那該多方便?

BrowserMCP 就是為此而生的工具。它像一座橋樑,連接了你的 AI 助手和 Chrome 瀏覽器,讓 AI 能夠通過瀏覽器去“看”世界並執行操作。

🛠️ 準備工作

在開始之前,請確保你已經安裝了以下軟體:

Node.js:這是運行服務的基礎(必須安裝)。
支持 MCP 的 AI 工具:目前支持 Cursor、Claude Desktop、Windsurf 或 VS Code。
Chrome 瀏覽器(或 Chromium 核心瀏覽器)。

⚡️ 三步快速上手

第一步:配置“大腦” (MCP Server)

首先,我們需要告訴你的 AI 工具如何連接到 BrowserMCP 服務。這裡以 Cursor 為例(Claude Desktop 同理):
打開 Cursor 設定面板。
找到 "Tools" (工具) 標籤頁。
點擊 "New MCP server" (新建 MCP 服務)。
在配置框中填入以下資訊:

{
"mcpServers": {
"browsermcp": {
"command": "npx",
"args": ["@browsermcp/mcp@latest"]
}
}
}

點擊保存/刷新。AI 現在已經準備好發送指令了。

第二步:安裝“雙手” (瀏覽器插件)

接下來,我們需要在瀏覽器裡裝一個“接收器”,執行 AI 發來的命令。

前往 BrowserMCP 官網或插件商店,安裝 Browser MCP 擴展。

📌 关键一步:安裝後,建議將插件圖示固定 (Pin) 在瀏覽器工具列上,方便操作。

點擊瀏覽器右上角的 Browser MCP 圖示。
點擊 “Connect” (連接) 按鈕。
注意:這一步是將當前標籤頁與 AI 連接。之後所有的操作都會在這個標籤頁進行。

第三步:見證魔法 (開始自動化)
一切就緒!現在回到你的 AI 工具(比如 Cursor 的 Chat 界面),像平常說話一樣下達指令:

用戶:打開 Google,搜尋“Browser MCP”並告訴我搜尋結果的第一條是什麼。

幕後發生了什麼?

Cursor 透過 MCP 協議把你的話傳給本地運行的 Server。

Server 將指令翻譯給瀏覽器插件。

瀏覽器插件自動跳轉 Google,輸入文字,點擊搜尋。
插件讀取網頁內容,傳回給 Cursor。
Cursor 總結內容回覆你。

💡 使用小貼士

能做什麼?

“幫我總結一下這個網頁的內容。”

“去 GitHub 看看這個專案的最新 Issue 是什麼。”

“幫我填好這個測試表單(需提供資料)。”

現在,你的 AI 已經不再被困在聊天框裡了,快去試試讓它去互聯網上衝浪吧!🌊

影片展示
NODE-1.72%
PIN1.39%
查看原文
此頁面可能包含第三方內容,僅供參考(非陳述或保證),不應被視為 Gate 認可其觀點表述,也不得被視為財務或專業建議。詳見聲明
  • 讚賞
  • 留言
  • 轉發
  • 分享
留言
0/400
暫無留言
交易,隨時隨地
qrCode
掃碼下載 Gate App
社群列表
繁體中文
  • 简体中文
  • English
  • Tiếng Việt
  • 繁體中文
  • Español
  • Русский
  • Français (Afrique)
  • Português (Portugal)
  • Bahasa Indonesia
  • 日本語
  • بالعربية
  • Українська
  • Português (Brasil)