CDP上的浏览器MCP
使用Chrome DevTools协议(CDP)管理Chrome浏览器的MCP服务器
此项目公开了用于导航、交互和访问浏览器选项卡的工具。浏览器是使用CDP的控制器,因此:
- 页面导出为全高屏幕截图、可访问性树和丰富的深度DOM
1. 屏幕截图捕捉了整个页面,而不仅仅是可见的滚动部分 1. 可访问性树包含大多数相关部分 1. 丰富的深度DOM包含 1. 嵌套iframe、影子DOM、伪元素等。 1. 每个元素附加的监听器(例如onClick、onKeyDown等),包括回调函数代码(无论好坏) 1. 每个元素相关的解析样式
- 该页面可通过点击、按键和输入值更新功能进行交互
- 该页面可通过基本的打开URL、后退、前进和重新加载功能进行导航
Page visual snapshot enhanced with boxes for interactible elemenents Page text snapshot enhanced with event listeners for interactible elemenents Page text snapshot footer that contains page links
Prereq
- NodeJS 的
使用本地Chrome
- npm安装
- 将config-example.json配置放在Cloude、VS Code、Cursor中的任何位置。
1. 关于Cloude,请参见https://modelcontextprotocol.io/quickstart/user 1. 有关游标,请参见https://docs.cursor.com/context/model-context-protocol#configuring-mcp服务器
与远程Chrome一起使用
- 通过在“Selenoid”目录中运行以下命令来运行Selenoid Selenium Hub:
docker pull selenoid/vnc_chrome:128.0
docker pull selenoid/hub
docker pull aerokube/selenoid-ui
docker-compose up -d- 通过在config-exampl.json/mcpServers/browser中添加以下内容,通过Selenium_HUB_URL环境变量指定Selenium HUB地址:
"env": {
"SELENIUM_HUB_URL": "http://localhost:4444/wd/hub"
}- 要查看实时浏览器,请转到http://localhost:8080/
警告
Selenoid Selenium Hub配置使用主机上的docker.sock,因此它可以完全控制docker。
故障排除
npx@modelcontextprotocol/检查器npx-tsx/Users/bogdan/devel/browser-mcp over cdp/src/mcp.ts
