MCPJam Inspector：开发者的得力助手

在这个数字化飞速发展的时代，开发者们在测试和调试 MCP 服务器时，常常面临着诸多挑战。而 MCPJam Inspector 就如同一束光，照亮了开发者们的前行之路，成为了他们手中的一把利器。作为一个功能强大的开源工具，它不仅让 MCP 服务器的测试和调试变得更加轻松快捷，还为开发者们提供了丰富的功能和便捷的操作体验。

一、初识 MCPJam Inspector

MCPJam Inspector 是一个专为 MCP 服务器打造的测试和调试工具。它通过简洁的命令行和直观的用户界面，让开发者们能够迅速上手并高效完成各项工作任务。此外，它还提供了一系列强大的功能，如对多种协议的支持、服务器工具的执行、实时参数输入等，满足了开发者们在不同场景下的多样化需求。

从架构上看，MCPJam Inspector 采用了现代的 monorepo 模式，主要由三个部分构成：前端客户端、后端服务器和命令行界面。前端客户端基于 React 18 和 TypeScript 开发，为用户提供了良好的操作界面；后端服务器则采用了 Express.js，并支持 WebSocket，确保了数据传输的高效性和稳定性；命令行界面则为开发者们提供了一个便捷的入口，方便他们快速启动和管理 Inspector。

二、快速入门

对于初次接触 MCPJam Inspector 的开发者来说，快速上手是关键。以下是几种常见的启动方式及其操作步骤：

（一）使用 npx 启动

只需在终端输入以下命令，就能快速启动 MCPJam Inspector：

npx @mcpjam/inspector@latest

执行该命令后，Inspector 将自动在浏览器中打开，地址通常为 http://localhost:6274。

（二）使用 Docker 启动

如果您的系统中已安装 Docker，还可以通过 Docker 来运行 MCPJam Inspector。首先，从 Docker Hub 拉取最新镜像：

docker pull mcpjam/mcp-inspector:main

接着，运行以下命令启动容器：

docker run --rm -p 6274:6274 -p 6277:6277 mcpjam/mcp-inspector:main

此时，您可以在浏览器中访问 http://127.0.0.1:6274 来使用 MCPJam Inspector。

（三）本地开发环境搭建

如果您希望在本地进行开发和调试，可以按照以下步骤进行操作：

克隆 MCPJam Inspector 的代码仓库：

git clone https://github.com/mcpjam/inspector.git
cd inspector


  2. 安装项目依赖：

     ```bash
npm install

启动开发服务器：

npm run dev


    这将同时启动前端和后端的开发服务器，并在浏览器中打开 Inspector。

## 三、功能亮点

MCPJam Inspector 拥有众多出色的功能，以下是一些主要亮点：

### （一）多协议支持

MCPJam Inspector 支持 STDIO、SSE 和 Streamable HTTP 三种协议，能够连接各种 MCP 服务器。这意味着无论您使用的是哪种类型的 MCP 服务器，MCPJam Inspector 都能轻松与之对接，为您提供统一的操作体验。

  * STDIO 协议适用于本地 MCP 服务器进程，允许您通过标准输入和输出与服务器进行交互。
  * SSE（Server - Sent Events）协议则用于连接远程 MCP 服务器，使得客户端能够实时接收服务器发送的事件和消息。
  * Streamable HTTP 协议则为 HTTP 基础上的 MCP 服务器提供了支持，方便您在 HTTP 环境中使用 MCP 服务。

### （二）工具执行与调试

通过 MCPJam Inspector，您可以轻松执行 MCP 服务器上的工具，并进行实时参数输入。在执行过程中，它会提供详细的日志信息，帮助您快速定位和解决问题。例如，您可以使用以下命令连接到本地服务器并执行工具：

```bash
npx @mcpjam/inspector node build/index.js

或者，您可以通过命令传递自定义参数来满足特定需求：

npx @mcpjam/inspector node server.js --port 3000 --debug

（三）LLM 工具交互

MCPJam Inspector 新增了对 LLM 工具交互的支持，让您可以测试 MCP 服务器与实际的大型语言模型（LLM）之间的交互情况。这对于评估 MCP 服务器在处理 LLM 请求时的性能和表现具有重要意义，有助于您优化服务器的配置和功能，以更好地适应 LLM 应用场景。

（四）调试工具

为了提升调试效率，MCPJam Inspector 提供了增强型的调试工具，包括详细的日志记录和分析功能。这些工具可以帮助您深入了解服务器的运行状态，快速发现问题所在，并采取相应的解决措施。

（五）质量提升特性

MCPJam Inspector 还引入了一系列提升用户体验的特性，如保存请求、多服务器连接和保存连接等。这些特性使得开发者们在使用过程中更加便捷，能够高效地管理和切换不同的服务器连接，同时保留重要的请求信息以便后续查阅和分析。

四、开发与贡献

如果您对 MCPJam Inspector 的开发感兴趣，或者希望为项目贡献自己的力量，以下是一些相关的开发和贡献指南：

（一）本地开发流程

安装 Node.js 和 npm 等开发环境依赖。
克隆项目代码仓库并安装项目依赖：

npm install


  3. 使用以下命令启动开发服务器：

     ```bash
npm run dev

在开发过程中，您可以根据需要对代码进行修改和完善。为了确保代码风格的一致性，请在提交代码之前使用以下命令进行格式化：

npm run prettier-fix


  5. 运行测试用例以验证您的更改是否正确：

     ```bash
npm test

（二）贡献指南

叉仓库（Fork） ：在 GitHub 上找到 MCPJam Inspector 的官方仓库，点击 “Fork” 按钮将其叉到您的个人账户下。
克隆仓库（Clone） ：将叉后的仓库克隆到本地：

git clone https://github.com/YOUR_USERNAME/inspector.git
cd inspector


  3. **创建分支（Branch）** ：创建一个新的分支来存放您的更改：

     ```bash
git checkout -b my-feature-branch

提交更改（Commit） ：在分支中进行代码修改后，使用以下命令提交更改：

git add .
git commit -m “Your commit message”


     请遵循约定式提交（Conventional Commits）规范来书写提交信息，以便更好地描述您的更改内容和类型。

  5. **推送分支（Push）** ：将您的分支推送到远程仓库：

     ```bash
git push origin my-feature-branch

创建拉取请求（Pull Request） ：在 GitHub 上，向 MCPJam Inspector 的原始仓库（通常是 main 分支）提交一个拉取请求（PR）。在 PR 描述中，详细说明您所做的更改，并关联相关的问题（如果有）。

（三）代码规范与测试

代码风格 ：项目使用 Prettier 来维护代码风格的一致性。您可以通过运行 npm run prettier-fix 命令来自动格式化代码。
测试：测试是确保项目质量和稳定性的重要环节。在提交更改之前，请务必运行 npm test 命令来执行测试用例，确保您的更改不会引入新的问题。

五、项目架构与技术栈

深入了解 MCPJam Inspector 的架构和技术栈，有助于您更好地理解和使用该工具，同时也为开发者们提供了参考和借鉴。

（一）架构结构

MCPJam Inspector 采用 monorepo 架构，主要包含三个部分：

客户端（client） ：位于 /client 目录下，基于 React 18 和 TypeScript 开发的前端应用程序。它使用 Vite 进行构建和打包，并采用了 Tailwind CSS 和 Radix UI 等技术来构建用户界面。客户端负责与用户进行交互，提供直观的操作界面，让用户能够方便地与 MCP 服务器进行交流和管理。
服务器（server） ：位于 /server 目录下，基于 Express.js 构建的后端服务。它支持 WebSocket，作为前端客户端和 MCP 服务器之间的代理，负责处理不同传输协议之间的转换和数据传输。服务器管理与 MCP 服务器的连接，并确保数据的准确传输和高效处理。
命令行界面（CLI） ：位于 /cli 目录下，是 MCPJam Inspector 的启动入口。它负责处理用户的命令行指令，管理客户端和服务器的启动与配置，并支持连接到现有的 MCP 服务器。通过 CLI，用户可以方便地控制和管理 MCPJam Inspector 的运行。

（二）技术栈

前端技术栈 ：React 18 提供了高效的组件化开发模式和良好的性能表现；TypeScript 为前端代码添加了类型检查，提高了代码的可靠性和可维护性；Tailwind CSS 作为一种实用主义的 CSS 框架，能够快速构建美观的用户界面；Radix UI 则提供了一系列高质量的 UI 组件，丰富了前端的交互体验。
后端技术栈 ：Express.js 作为 Node.js 的一个轻量级框架，为构建服务器提供了简单而强大的接口；WebSocket（ws）实现了服务器与客户端之间的实时双向通信，确保了数据的及时传输和交互；CORS 支持则使得不同域名之间的数据请求能够顺利进行。
构建与工具 ：Vite 作为前端构建工具，具有快速的冷启动和热更新能力，大大提高了开发效率；TSC（TypeScript Compiler）负责将 TypeScript 代码编译为 JavaScript 代码；Concurrently 工具可以同时运行多个命令，方便开发者同时启动多个服务或任务。

六、未来展望与计划

MCPJam Inspector 的开发团队一直在努力提升产品的功能和用户体验，并规划了一系列的未来改进计划：

（一）UI/UX 改进

修复暗黑模式下的样式问题，如提高运行工具按钮在暗黑模式下的视觉效果，让用户在不同主题下都能获得良好的视觉体验。
增强日志记录的用户体验，解决 INFO 日志显示为误导性的红色的问题，使日志信息更加清晰准确地传达给用户。

（二）核心功能增强

引入 AI 参数填充功能，利用人工智能技术为用户提供一个智能的参数补全建议，提高工具使用的便捷性和效率。
开发集合功能，允许用户组织和管理 MCP 服务器和工具的分组，便于对大量资源进行分类和管理。
支持多供应商，扩展对其他大型语言模型（如 ChatGPT）的支持，让用户有更多选择来满足不同场景下的需求。

（三）技术改进

集成安全扫描功能，内置漏洞扫描工具，帮助用户及时发现和修复 MCP 服务器中的安全漏洞，提高系统的安全性。
开发 Electron 应用程序，打造桌面应用版本，为用户提供高质量的桌面端体验，提升应用的性能和易用性。

（四）生态系统建设

优化 MCP Jam 网站的着陆页面，提供更吸引人的内容和更好的用户体验，吸引更多的开发者关注和使用 MCPJam Inspector。
扩展文档内容，增加更详细的指南和教程，帮助用户更好地理解和使用 MCPJam Inspector 的各项功能，降低学习成本。

七、结语

MCPJam Inspector 作为一款开源的 MCP 服务器测试和调试工具，凭借其丰富的功能、便捷的操作和强大的性能，成为了开发者们在 MCP 服务器开发过程中的得力助手。无论您是初学者还是经验丰富的开发者，都能从 MCPJam Inspector 中受益，提高工作效率，优化服务器性能。随着项目的不断发展和完善，MCPJam Inspector 将为开发者们带来更多惊喜和价值，助力 MCP 技术的广泛应用和发展。

希望本文能够帮助您深入了解 MCPJam Inspector 的各个方面，如果您对 MCPJam Inspector 感兴趣，不妨亲自体验一下，开启您的 MCP 服务器开发之旅！

MCP服务器测试调试难？MCPJam Inspector一键解决三大痛点！