MCP Inspector Vscode

MCP检查器VSCode扩展

中文文档

MCP Inspector是一个VSCode扩展，专为MCP（模型控制协议）服务器的可视化测试和调试而设计。此扩展提供了一个用户友好的界面，帮助开发人员更有效地测试、调试和监控MCP服务器行为。

此扩展的WebView UI部分基于 模型上下文协议检查器 project，它是模型上下文协议的官方调试和测试工具。

特性

• 视觉界面：通过直观的WebView界面显示MCP服务器请求和响应
• 实时监控：实时监控MCP服务器活动和状态
• 请求测试：为构建和向MCP服务器发送测试请求提供接口
• 响应分析：格式化和显示响应数据，便于分析和调试
• 服务器管理：内置服务器管理功能，可直接从VSCode启动和停止MCP服务器
• 自动端口分配：自动查找可用端口以避免端口冲突

MCP Inspector Interface

需求

• Visual Studio代码1.97.0或更高版本
• Node.js和npm（用于运行内置服务器）

安装

1. 从VSCode扩展市场安装，或
2. 下载 .vsix 通过VSCode的“从VSIX安装…”选项进行文件和安装，或
3. 克隆存储库并手动构建：

git clone https://github.com/kshern/mcp-inspector-vsocde.git
cd mcp-inspector-vsocde
npm install
npm run package

用法

1. 单击VSCode活动栏中的MCP检查器图标打开扩展
2. 单击“启动MCP检查器服务器”命令以启动服务器
3. 使用WebView界面构建请求并将其发送到MCP服务器
4. 分析响应结果和服务器行为
5. 完成后，单击“停止MCP检查器服务器”命令停止服务器

可用命令

• MCP Inspector: Open MCP Inspector -打开主界面
• MCP Inspector: Start MCP Inspector Server -启动代理服务器
• MCP Inspector: Stop MCP Inspector Server -停止代理服务器
• MCP Inspector: Clean NPM Cache and Dependencies -出现安装问题时清理npm缓存和依赖项

扩展设置

此扩展有助于以下设置：

• mcp-inspector.serverPort：MCP检查器服务器使用的端口号（默认值：3000）。如果不可用，它将自动找到另一个端口。
• mcp-inspector.autoStartServer：是否在扩展激活时自动启动MCP Inspector服务器（默认值：true）。
• mcp-inspector.installDependencies：首次启动服务器时是否自动安装缺少的依赖项（默认值：true）。
• mcp-inspector.preInitializeOnActivation：是否在扩展激活时自动安装依赖项并在后台构建服务器（默认值：true）。这加快了第一台服务器的启动速度。
• mcp-inspector.serverStartTimeout：服务器启动超时（毫秒）（默认值：30000）。

故障排除

如果您遇到服务器无法启动的问题：

1. 尝试使用命令面板中的“清理NPM缓存和依赖关系”命令
2. 检查MCP检查器输出通道是否有详细的错误消息
3. 确保Node.js和npm已正确安装且可访问
4. 如果出现权限问题，请尝试以管理员权限运行VSCode

项目结构

mcp-inspector-vsocde/
├── src/                 # Extension source code
├── webview-ui/          # WebView UI code (based on github.com/modelcontextprotocol/inspector)
│   ├── client/          # Frontend client code
│   └── server/          # Proxy server code
├── resources/           # Resource files
└── dist/                # Compiled code

技术实现

此扩展由两部分组成：

1. VSCode扩展部分：负责在VSCode中创建WebView、管理服务器进程和处理用户界面交互
2. WebView UI部分：基于 模型上下文协议检查器 项目，为测试和调试MCP服务器提供直观的用户界面

通过将官方的MCP Inspector工具集成到VSCode中，此扩展为开发人员提供了更方便的MCP服务器开发和测试体验。

开发指南

构建和调试

1. 克隆存储库
2. 安装依赖项： npm install
3. 在VSCode中打开项目
4. 按F5开始调试会话

构建扩展

npm run package

这将在 dist 目录。

贡献

欢迎提供代码、问题报告或改进建议。请按照以下步骤操作：

1. 分叉存储库
2. 创建要素分支： git checkout -b feature/your-feature-name
3. 提交您的更改： git commit -m 'Add some feature'
4. 推到分支： git push origin feature/your-feature-name
5. 提交拉取请求

致谢

已知问题

• 在某些环境中，可能需要手动重新启动服务器才能正常工作
• 当前不支持多MCP服务器调试

发布说明

0.0.1

• 初始版本
• 基本MCP服务器测试功能
• WebView UI界面
• 服务器启动和停止功能

许可证

麻省理工学院

______________________________________________________________________

享受使用MCP检查器！