Chrome DevTools MCP
ChromeDevTools/chrome-devtools-mcp
Google 官方 MCP 伺服器，讓編碼 agent 控制真實 Chrome：看 console、抓網路請求、跑效能分析、截圖。
為什麼選它agent 改完前端可以自己開瀏覽器驗證與除錯，比只靠截圖的瀏覽器工具多了 DevTools 層級的資訊。
安裝
- 星數
- ★ 54.1k
- 授權
- Apache-2.0
- 語言
- TypeScript
- 最近更新
- 2026年10月23日
適合用來
- 讓編碼 agent 開啟真實 Chrome，檢查 console 訊息與錯誤
- 分析網路請求、擷取網頁截圖
- 錄製效能追蹤並取得效能分析建議
- 用 puppeteer 自動操作頁面並等待結果
怎麼開始
- 確認已安裝 Node.js LTS、npm 與最新穩定版 Chrome
- 執行 claude mcp add chrome-devtools -- npx chrome-devtools-mcp@latest
- 在 Claude Code 輸入「Check the performance of https://developers.chrome.com」測試是否正常
使用前須知
MCP 用戶端可讀取與修改瀏覽器中的任何資料，請避免處理敏感資訊。Google 預設收集使用統計，可加 --no-usage-statistics 關閉；效能工具可能把網址送到 CrUX API，可用 --no-performance-crux 關閉。
以上由 AI 依據專案說明整理，實際用法請以官方文件為準。
同類工具
- Agent-ReachMCP 與 Agent · ★ 102k
讓 AI 代理讀取網際網路內容，支援 Twitter、Reddit、Bilibili 等平台
- worldmonitorMCP 與 Agent · ★ 89.4k
實時全球智能儀表板，AI新聞聚合與地緣政治監測
- career-opsMCP 與 Agent · ★ 76.6k
AI求職助手，掃描職位板，評分並優化求職文件
- SuperpowersMCP 與 Agent · ★ 305k
一套給 Claude Code 等 agent 的技能（skills）與開發流程：先腦力激盪、寫計畫、TDD，再派子 agent 實作與審查。
- Context7MCP 與 Agent · ★ 63.6k
MCP 伺服器，讓 Claude Code、Cursor 等工具即時抓取函式庫最新版本的官方文件與範例，減少 AI 寫出過時 API。
出處 GitHub · 更新於 2026年10月24日 · 版權屬原作者