MCP2浏览器
一种通过HTTP提供浏览器自动化功能的模型上下文协议（MCP）服务器。该服务器通过MCP协议公开浏览器检查工具，允许AI助手与网页交互。
特性
- 打开网页：使用Playwright导航到任何URL
- 获取页面标题：检索当前打开页面的标题
- 基于HTTP的MCP服务器在Express上运行
先决条件
- Node.js（v16或更高版本）
- npm或纱线
安装
- 克隆存储库：
git clone
cd mcp2browser- 安装依赖项：
npm install- 构建项目：
npm run build- 启动服务器：
npm start服务器将在上开始运行 http://localhost:3000/mcp
与VS代码一起使用
要在VS Code中将此MCP服务器与GitHub Copilot一起使用，您需要在MCP设置中对其进行配置。
配置步骤
选项1：使用MCP：添加服务器命令
- 按
Cmd+Shift+P（macOS）或Ctrl+Shift+P（Windows/Linux）打开命令面板 - 键入并选择“MCP:添加服务器”
- 输入服务器名称：
browser-mcp - 选择运输类型：
HTTP (streamable-http) - 输入服务器URL:
http://localhost:3000/mcp
选项2：手动配置
- 按打开VS代码设置（JSON）
Cmd+Shift+P（macOS）或Ctrl+Shift+P（Windows/Linux）并搜索“首选项：打开用户设置（JSON）”
- 将MCP服务器配置添加到您的设置中：
{
"github.copilot.chat.mcp.servers": {
"browser-mcp": {
"type": "http",
"url": "http://localhost:3000/mcp",
"transport": "streamable-http"
}
}
}- 确保MCP服务器正在运行（请参阅上面的安装步骤）
- 重新启动VS Code或重新加载窗口(
Cmd+R在macOS上，Ctrl+R在Windows/Linux上）
示例用法
配置后，您可以通过VS Code中的GitHub Copilot Chat与浏览器工具进行交互：
示例1：打开网页
User: Open the page https://github.com
Copilot: [Uses the openPage tool to navigate to GitHub]示例2：获取页面标题
User: What's the title of the current page?
Copilot: [Uses the getPageTitle tool to retrieve the title]示例3：组合工作流
User: Open https://example.com and tell me what the page title is
Copilot: [Opens the page and then retrieves the title]可用工具
openPage
在无头浏览器中打开网页。
输入：
url（string）：要导航到的URL
输出：
status（string）：表示成功的状态消息
getPageTitle
检索当前打开的网页的标题。
输入： 无
输出：
title（string）：当前页面的标题
发展
# Install dependencies
npm install
# Build the project
npm run build
# Run in development mode (with nodemon auto-reload)
npm run dev
# Start the server (production)
npm start这 dev 该脚本使用nodemon来监视TypeScript文件的更改，并使用ts节点自动重启服务器，使开发更加高效。
建筑
- index.ts：主Express服务器设置
- mcp-route.ts：MCP协议实施和工具定义
- 使用Playwright实现浏览器自动化
- 通过HTTP为MCP实现StreamableHTTPServerTransport
故障排除
问题：服务器未在VS代码中连接
- 确保服务器正在上运行
http://localhost:3000/mcp - 检查VS代码设置是否配置正确
- 更改MCP设置后重新启动VS Code
问题：工具未出现在Copilot中
- 验证VS代码设置中的MCP服务器配置
- 检查服务器日志是否有任何错误
- 确保GitHub Copilot扩展是最新的
许可证
麻省理工学院