Model Context Protocol(MCP)是一个用于定义和交互 AI 模型上下文的协议,而 @modelcontextprotocol/inspector 是一个强大的开发工具,提供了直观的 Web 界面(MCP Inspector Client,MCPI)和代理服务器(MCP Proxy,MCPP),用于测试和调试 MCP 服务器。本文将以最简洁的方式介绍如何快速上手使用 MCP Inspector,适合初学者快速入门。
什么是 MCP Inspector?
MCP Inspector 是一个基于 React 的 Web 界面和 Node.js 代理服务器的工具,用于:
- 测试 MCP 服务器的功能(如资源、工具和提示)。
- 支持多种传输方式(stdio、SSE、streamable-http)。
- 无需本地安装,通过 npx 即可运行。
- 提供 CLI 和 Web 界面两种交互方式,适合开发和调试。
快速开始
安装与运行
无需手动安装,直接使用 npx 运行 Inspector,连接到你的 MCP 服务器(假设服务器代码在 McpServer.ts,McpServer.ts在执行命令的当前目录下面,文件的路径是以当前代码的执行目录开始的):
bash
npx @modelcontextprotocol/inspector npx tsx McpServer.ts
-
执行效果:
-
默认行为:
- 启动 Web 界面:http://localhost:6274
- 启动代理服务器:端口 6277
-
自定义端口:
iniCLIENT_PORT=8080 SERVER_PORT=9000 npx @modelcontextprotocol/inspector npx tsx McpServer.ts
连接远程服务器
若要调试远程 MCP 服务器(如部署在 my-mcp-server.example.com):
bash
npx @modelcontextprotocol/inspector --cli https://my-mcp-server.example.com
使用 Web 界面
-
访问界面 :运行命令后,打开浏览器访问 http://localhost:6274/?MCP_PROXY_AUTH_TOKEN=ce0e0c97d3e4a6b8946a3581b9dd604d92b92c1c371bf6d5dc9373599e82a33d。需要完整的路径,填入token,否则无法连接。
连接失败的页面:
-
连接服务器:点击左侧"Connect"按钮,选择或输入服务器地址。
-
核心功能:
-
Resources:查看服务器提供的资源,点击"List Resources"与"List Templates"显示列表,点击具体资源查看内容。
-
Rsources的使用:
代码:
javascriptserver.registerResource( 'greeting', new ResourceTemplate('greeting://{name}', { list: undefined }), { title: 'Greeting Resource', // Display name for UI description: 'Dynamic greeting generator' }, async (uri, { name }) => ({ contents: [ { uri: uri.href, text: `Hello, ${name}!` } ] }) )
-
Tools:列出可用工具,输入参数后调用测试。
-
Tools的调用:
代码:
cssserver.registerTool( 'add', { title: 'Addition Tool', description: 'Add two numbers', inputSchema: { a: z.number(), b: z.number() } }, async ({ a, b }) => ({ content: [{ type: 'text', text: String(a + b) }] }) )
调用方式与即结果:
-
Prompts:查看和测试服务器的提示模板。
-
Prompts调用:
代码:
javascriptserver.registerPrompt( 'team-greeting', { title: 'Team Greeting', description: 'Generate a greeting for team members', argsSchema: { department: completable(z.string(), (value) => { // Department suggestions return ['engineering', 'sales', 'marketing', 'support'].filter((d) => d.startsWith(value)) }), name: completable(z.string(), (value, context) => { // Name suggestions based on selected department const department = context?.arguments?.['department'] if (department === 'engineering') { return ['Alice', 'Bob', 'Charlie'].filter((n) => n.startsWith(value)) } else if (department === 'sales') { return ['David', 'Eve', 'Frank'].filter((n) => n.startsWith(value)) } else if (department === 'marketing') { return ['Grace', 'Henry', 'Iris'].filter((n) => n.startsWith(value)) } return ['Guest'].filter((n) => n.startsWith(value)) }) } }, ({ department, name }) => ({ messages: [ { role: 'assistant', content: { type: 'text', text: `Hello ${name}, welcome to the ${department} team!` } } ] }) )
-
-
导出配置:通过"Server Entry"或"Servers File"生成配置文件,方便复用。下面是复制Servers File的样例,可以添加到自己的mcp的json配置中。
json{ "mcpServers": { "default-server": { "command": "npx", "args": [ "tsx", "McpServer.ts" ], "env": { "APPDATA": "C:\Users\XXX\AppData\Roaming", "HOMEDRIVE": "C:", "HOMEPATH": "\Users\XXX", "LOCALAPPDATA": "C:\Users\hf\AppData\Local", "PATH": "", "PROCESSOR_ARCHITECTURE": "AMD64", "SYSTEMDRIVE": "C:", "SYSTEMROOT": "C:\Windows", "TEMP": "C:\Users\XXX\AppData\Local\Temp", "USERNAME": "XXX", "USERPROFILE": "C:\Users\XXX", "PROGRAMFILES": "C:\Program Files" } } } }
使用 CLI 模式
CLI 模式适合自动化测试或脚本化操作,需指定 --cli 和方法。
示例
-
列出资源:
bashnpx @modelcontextprotocol/inspector --cli npx tsx McpServer.ts --method resources/list
-
调用工具:
bashnpx @modelcontextprotocol/inspector --cli npx tsx McpServer.ts --method tools/call --tool-name add --tool-arg a=8 b=7
-
远程服务器调用:
bashnpx @modelcontextprotocol/inspector --cli https://my-mcp-server.example.com --method tools/list
-
配置多个服务器
通过 JSON 配置文件管理多个 MCP 服务器:
json
{
"mcpServers": {
"myserver": {
"command": "npx",
"args": [
"tsx",
"McpServer.ts"
],
"env": { "key": "value" }
}
}
}
启动并指定服务器:
arduino
npx @modelcontextprotocol/inspector --config config.json --server myserver
实用技巧
-
传输方式:本地用 stdio,远程用 SSE 或 streamable-http。可通过 URL 参数设置:
bashhttp://localhost:6274/?transport=sse&serverUrl=http://localhost:8787/sse
-
环境变量:传递环境变量给服务器:
bashnpx @modelcontextprotocol/inspector -e key=value node build/index.js
-
调试日志:确保服务器日志输出到 stderr,避免干扰 stdout 的 MCP 协议通信。
-
依赖支持:如需额外包(如 pandas),用:
vbscriptuv run mcp dev server.py --with pandas
注意事项
- 端口冲突:通过 CLIENT_PORT 和 SERVER_PORT 自定义端口。
- web地址要带token:没有token会无法正常连接;
- 远程调试:确保远程服务器支持 SSE 或 streamable-http,并检查 SDK 版本兼容性。
- 更多帮助:访问 Model Context Protocol 官网 查看详细文档。
总结
MCP Inspector 是一个简单而强大的工具,通过 Web 界面或 CLI 即可快速测试和调试 MCP 服务器。无论是本地开发还是远程部署,只需几行命令即可上手。开始你的 MCP 之旅吧!