MCP在线-SSE流测试仪
用于测试服务器发送事件(SSE)流的Next.js应用程序,特别适用于测试MCP(模型上下文协议)端点。
特性
- 实时SSE流测试:连接到任何SSE端点,并在事件到达时查看事件
- 自定义头:添加、编辑和删除请求的HTTP标头
- 高级JSON-RPC编辑器:增强的请求正文编辑器,具有语法突出显示、验证和模板
- 增强的JSON显示:JSON-RPC响应的漂亮语法突出显示和格式化
- 会话管理:在浏览器会话中自动保存和恢复您的设置
- 事件分类:不同事件类型(连接、数据、错误、信息)的视觉指示器
- 导出功能:将包括事件和设置在内的完整会话数据导出为JSON
- 显示器定制:切换JSON格式、时间戳和自动滚动行为
- 复制和导出:复制单个事件、格式化的JSON或整个流输出
- 连接控制:使用中止功能启动和停止流
入门指南
首先,安装依赖项并运行开发服务器:
npm install
npm run dev打开 http://localhost:3000 使用浏览器查看应用程序。
用法
- 输入地址:输入您的SSE端点URL(必须以https://开头)
- 配置标头:添加必要的标头,如身份验证令牌
- 设置请求正文:对于POST请求,配置JSON有效负载
- 自定义显示:在“显示设置”中切换JSON格式、时间戳和自动滚动
- 连接:单击“连接”启动SSE流
- 监视器:通过精美的格式和语法高亮显示观看实时事件
- 出口:使用“导出”下载会话数据,或使用“复制全部”访问剪贴板
- 控制:使用“停止”中止连接,使用“清除”重置事件
会话管理
应用程序会自动保存您的设置,包括:
- 端点URL和HTTP方法
- 自定义标头配置
- 请求正文内容
- 显示首选项(JSON格式、时间戳、自动滚动)
设置在浏览器会话中保持不变,并在重新加载页面时恢复。
JSON-RPC编辑器功能
内置模板
- 工具/列表:列出可用的MCP工具
- 工具/调用:调用特定的MCP工具
- 资源/列表:列出可用资源
- 资源/读取:阅读特定资源
- 提示/列表:列出可用提示
- 提示/获取:获取特定提示
- 定制:自定义JSON-RPC模板
编辑能力
- 行号:可视化行号,便于编辑
- 语法验证:实时JSON验证,错误突出显示
- 自动格式化:一键JSON格式化和美化
- 压缩:压缩JSON以获得更小的有效载荷
- 字符计数:实时字符计数显示
- 自动ID增量:自动JSON-RPC ID管理
- 复制/粘贴支持:易于剪贴板集成
默认配置
该应用程序预先配置了:
- 内容类型:应用程序/json
- 接受:文本/事件流
- 标准JSON-RPC 2.0工具/列表请求体
- JSON格式已启用
- 启用时间戳和自动滚动
增强功能
JSON-RPC响应格式
- JSON内容的自动检测和解析
- 使用颜色编码类型(字符串、数字、布尔值等)突出显示语法
- 可折叠对象和数组结构
- 原始和格式化内容的复制按钮
事件分类
- 连接事件:连接状态和HTTP响应的蓝色指示器
- 数据事件:实际上证指数的绿色指标
- 错误事件:错误和失败的红色指示器
- 信息事件:黄色指示灯用于显示信息信息
导出功能
- 将完整的会话数据导出为JSON,包括:
- 时间戳和配置 - 所有带有元数据的事件 - 原始内容和格式化内容
- 单击按钮复制单个事件
技术细节
- 使用Next.js 16和React 19构建
- 使用带有ReadableStream的本机Fetch API进行SSE处理
- 根据规范实现正确的SSE解析
- 包括用于干净连接管理的中止控制器
- 基于本地存储的会话持久性
- 采用Tailwind CSS风格,打造响应式设计
- 自定义JSON语法高亮显示组件
