MCP运输说明
通过在浏览器的“网络”选项卡中查看MCP传输来了解它们
此存储库探讨了如何 模型上下文协议(MCP) 运输工具在实际操作中表现良好。此存储库适用于希望在传输级别而不是通过SDK抽象来理解MCP的工程师。
这里的示例不是仅依赖于规范或SDK抽象,而是设计为:
- 直接在浏览器中运行
- 通过浏览器DevTools网络选项卡检查
- 与真实的HTTP请求、响应和流相关联
目标是建立一个 正确的心理模型 通过观察真实的网络流量来分析MCP传输。
建议阅读顺序:
- README.md(此文件)
- 可流式传输的http自述文件
- 遗留sse自述文件
- 心智模型
______________________________________________________________________
为什么存在此存储库
MCP引入了一种干净、结构化的方式,使用JSON-RPC与工具进行交互。 然而,许多工程师在以下问题上遇到了困惑:
- 流媒体实际上在哪里发生?
- 为什么POST请求流式响应而不是GET?
- 为什么SSE在浏览器中的行为不符合我的预期?
- MCP是有状态的还是无状态的?
- 旧的基于SSE的方法和可流式HTTP之间有什么变化?
此存储库的存在是为了通过以下方式回答这些问题:
- 实现多种MCP传输方式
- 根据MCP规范验证行为
- 根据实际服务器实现验证行为
- 在HTTP级别观察一切
这是一个 学习和参考库,而不是生产SDK。
______________________________________________________________________
如何使用此存储库
📸 前方截图 此存储库有意先使用浏览器。网络选项卡的屏幕截图用于显示 *确切地* 流媒体、响应和事件出现的地方。 您将看到像下面这样的占位符——在跟随的同时可以随意打开图像。
浏览器网络选项卡显示可流式传输http的完整生命周期。
Streamable HTTP POST streaming
SSE响应(仅接受SSE GET请求中的帖子和实际响应)
______________________________________________________________________
核心心智模型
这里有两种根本不同的MCP传输模型:
1.流式HTTP(当前MCP规范)
- 来自客户端的每条JSON-RPC消息都通过以下方式发送 HTTP POST
- 服务器可能会响应:
- application/json (单一响应),或 - text/event-stream (请求范围的流媒体)
- 流媒体是 与发起它的POST请求相关联
- 进度通知和最终结果显示在同一HTTP响应上
- 基于GET的SSE保留用于 未经请求的服务器消息,不是工具执行
关键要点
在流式HTTP中,流式传输是一种 *响应格式*不是全球运输。
这种设计能够:
- 无状态缩放
- 干净重试
- 负载均衡器友好性
- 更简单的服务器实现
______________________________________________________________________
2.基于苏格兰和南方能源公司的传统MCP(历史/教育)
早期的MCP实现使用了不同的模型:
- 客户端打开一个长期 获取SSE连接
- 所有服务器消息(响应、进度、通知)都流过该流
- 客户端使用JSON-RPC ID将请求和响应关联起来
- 请求通过POST单独发送
此模型:
- 感觉直观
- 与浏览器和
EventSource - 使流媒体非常可见
但它也:
- 将复杂性推给客户
- 使重试和恢复变得复杂
- 使无状态扩展更加困难
该存储库包括一个可用的遗留SSE客户端,以说明这些权衡。
______________________________________________________________________
浏览器现实(重要)
浏览器施加了严重影响MCP传输的硬约束:
EventSource不支持自定义标头- 授权标头不能附加到SSE连接
- 基于会话或经过身份验证的SSE需要使用
fetch()与溪流 - CORS和凭据直接影响观察到的行为
由于这些原因,许多MCP示例在浏览器和服务器端客户端中的行为不同。 这个存储库使这些差异变得清晰可见。
______________________________________________________________________
存储库布局
mcp-transports-explained/
├── streamable-http/
│ ├── browser-client.js
│ ├── stateless_tool_call.js
│ └── README.md
│
├── legacy-sse/
│ ├── legacy-sse-client.js
│ └── README.md
│
├── docs/
│ ├── mental-model.md
│
└── diagrams/streamable-http/
使用浏览器友好的JavaScript演示当前的MCP Streamable HTTP传输。
重点领域:
- 请求范围流媒体
- 无状态工具调用
- 在“网络”选项卡中观察POST响应
深入了解可流式传输的http 在本自述文件中.
legacy-sse/
演示了一个基于SSE的旧式会话范围MCP客户端。
重点领域:
- 单SSE流
- 客户端请求关联
- 进度通知路由
深入了解传统sse 在本自述文件中.
docs/
构建心智模型 在本自述文件中.
______________________________________________________________________
如何使用此存储库
- 运行MCP服务器(本地或远程)
- 在浏览器控制台中打开JavaScript文件
- 打开DevTools→ 网络选项卡
- 执行示例
- 观察:
- 哪个请求流 - 响应出现的位置 - 如何实现进展 - 不同运输方式的表现
重点在于 观察不是抽象。
______________________________________________________________________
这是给谁的
- 实施MCP客户端或服务器的工程师
- 平台和基础设施工程师评估MCP的采用情况
- 工程师在浏览器中调试MCP行为
- 技术负责人审查传输和可扩展性的权衡
______________________________________________________________________
非目标
此存储库有意这样做 不:
- 提供生产就绪的客户端SDK
- 将MCP行为隐藏在抽象后面
- 优化以最小化代码大小
清晰度和正确性优先。
______________________________________________________________________
闭幕词
MCP的运输设计反映了以下两者之间的现实权衡:
- 简洁
- 可扩展性
- 可观测性
- 浏览器约束
了解这些权衡使MCP更容易推理。
这个存储库试图让这些权衡变得可见。
