零基础搭建远程MCP：串联3个Server实现AI自动化工作流

MCP 远程调用（HTTP）完全解析：串联多个 MCP Server 打造 AI 工作流

上一篇文章我们聊了本地 MCP Server 的搭建，Agent 通过 command + args 启动子进程，走 stdio 管道通信。这次咱们更进一步——用 url 连接远程 MCP Server，用 npx 一键启动本地 npm 包，把三个 Server 串起来，让 Agent 自动完成“查地图 → 打开浏览器 → 写文件”的完整工作流。这不再是理论，而是可以直接跑起来的实战。

一、从 stdio 到 HTTP：同一种协议，不同传输方式

1.1 核心不变

协议内容还是那些老面孔：tools/list、tools/call、resources/read……LLM 和工具之间说的话完全一样。唯一变化的是传输介质——从本地管道变成了网络请求。

简单来说，stdio 就像两个人在同一房间直接说话，用管道传声；HTTP 则是一个在北京，一个在上海打电话，通过网络传数据。本质都是通信，方式不同而已。

1.2 Client 配置三种写法

配置方式也很直观，无非三种情况：

• 本地文件：用 command + args spawn 子进程
• npx 命令：自动下载 npm 包再 spawn 子进程
• 远程 HTTP：直接发网络请求

这三种写法，MultiServerMCPClient 都能统一管理，最后通过 getTools() 一把拿回所有工具。底层细节被完全封装，开发者只需要关心配置。

二、npx 是什么

npx 是 Node 自带命令，用来运行 npm 包。参数 -y 表示跳过“是否下载？”的确认步骤，直接执行。后面的包名就是在 npm 上注册的包，比如 @modelcontextprotocol/server-filesystem。

和 npm install 的区别在于：npx 自动下载、运行、用完即走（或缓存），完全不需要先全局安装。一行命令搞定所有事情，这在 MCP 场景里价值巨大——工具开发者把 MCP Server 发布到 npm，你用 npx 一行就能用，不需要自己写任何工具代码。

三、三个 MCP Server 的配置解析

来看实际配置：

三个 Server 的名字可以自己随便取，amap-server、file-system、chrome-devtools 都只是标识，框架只认后面的配置结构。配置字段只有三个固定项：url 表示远程 HTTP 地址，command 表示用什么启动子进程，args 是传给 command 的参数数组。

3.1 amap-server — 远程 HTTP

这个 Server 不启动任何子进程。Agent 直接通过 HTTP POST 请求和高德服务器通信，工具全部跑在远程服务器上。提供的工具包括 maps_geo（地址→坐标）、maps_around_search（周边搜索）、maps_search_detail（地点详情）、maps_distance（距离计算）等。

3.2 file-system — 本地 npx，有安全边界

这是通过 npx 启动的本地 Server，最后一个参数是安全边界——这个 MCP Server 只能操作指定目录，越界就会报 Access denied。提供的工具包括 read_file、write_file、search_files、get_file_info、list_allowed_directories 等。这是 file-system MCP 内置的安全机制，防止误操作。

3.3 chrome-devtools — 浏览器控制

同样是 npx 启动，提供的工具极其丰富：na vigate_page、new_page、close_page、click、fill、fill_form、take_screenshot、take_snapshot、list_pages、evaluate_script、wait_for 等几十个浏览器操作工具。相当于一个能自动操控浏览器的机器人。

3.4 一句话总结

远程用 url，本地用 command + args，npx 省得自己装。一个 MultiServerMCPClient 同时管三种，getTools() 一把全拿回来。

四、获取工具

工具代码不在你的文件里——amap-server 的工具在高德服务器上，file-system 的工具在 npx 下载的 npm 包里，chrome-devtools 的工具也在 npx 下载的 npm 包里。你一行工具代码都没写，但拿到了几十个工具。这就是 MCP 的复用价值。

五、SystemMessage — 告诉 LLM 工作目录

这是踩坑后的经验。file-system 只允许写指定目录，但 LLM 不知道——它可能编一个 Linux 路径（比如 /home/user/...），结果报 Access denied。在 SystemMessage 里明确告知工作目录，LLM 就不会乱猜了。

六、ReAct 循环

6.1 invoke

LLM 在云端完成决策。返回的 response 可能是直接回答，也可能是 tool_calls。

6.2 判断是否调工具

两个条件满足任意一个就退出：response.tool_calls 是 undefined（LLM 没想调工具），或者 tool_calls.length 等于 0（几乎不会发生，兜底用）。

6.3 打印工具名

从工具调用列表里只取名字，用逗号拼起来，蓝底打印给开发者看。纯调试信息，生产环境可以去掉。

6.4 遍历工具调用

for...of 串行遍历，一个工具执行完再跑下一个。find 按 LLM 给的名字在工具库里匹配真正的工具对象。

6.5 执行工具

tool_call.args 是 LLM 自动从用户自然语言里提取的参数。LLM 对照工具的 schema 描述，自动推理填入，不需要你手动传。

6.6 处理返回值（四层判断）

不同 MCP Server 返回格式不同，需要统一转成字符串才能放进 ToolMessage。四种判断只为一个目的：让 contentStr 无论怎样都是字符串，安全放进 ToolMessage。

6.7 塞回 messages

tool_call_id 绝对不能丢。LLM 可能同时调 3 个工具，每个结果必须标记对应哪个调用，就像给三个人发微信，回复必须标记是对谁说的。

6.8 兜底返回

maxIterations（默认 30 轮）到了还没结束，取最后一条消息当结果返回。防止 LLM 死循环。

七、实战工作流

来看一个具体任务：“抚州东华理工大学附近的酒店，最近的 3 个酒店，拿到酒店图片，打开浏览器，展示每个酒店的图片，每个 tab 一个 url 展示，并且把那个页面标题改为酒店名”。

Agent 的实际执行步骤大概是这样：

第 0 轮：maps_geo（地址→坐标）
第 1 轮：maps_around_search（搜附近酒店）
第 2 轮：maps_search_detail × 3（查每个酒店详情+图片）
第 3 轮：new_page（打开酒店图片链接）→ new_page → new_page → select_page → evaluate_script（改页面标题）
第 4 轮：回答用户

三个 MCP Server 被 Agent 自动编排串联，不需要你写任何编排逻辑。

八、常见踩坑

8.1 API 限流

高德免费 key 有 QPS 上限。Agent 并发 8 个 maps_search_detail 直接把额度打爆，返回 CUQPS_HAS_EXCEEDED_THE_LIMIT。解决方案是换付费 key，或者在 prompt 里让 LLM 分批查询。

8.2 参数格式错误

LLM 给 maps_distance 的坐标参数格式不符合高德要求，返回 INVALID_PARAMS。LLM 每次生成的参数不一样，重跑一次通常能解决，或者在 SystemMessage 里加参数格式约束。

8.3 路径越权

LLM 编了个 C:\home\user\...（Linux 习惯），超出 file-system 允许的目录范围，返回 Access denied。在 SystemMessage 里明确告诉 LLM 工作目录即可解决。

九、完整流程串讲

流程可以总结为七步：

① 创建 model（ChatOpenAI）
② 创建 mcpClient（MultiServerMCPClient），配置 3 个 MCP Server（amap 远程 HTTP、file-system npx 本地指定安全目录、chrome-devtools npx 本地控制浏览器）
③ mcpClient.getTools() 自动拿回所有工具
④ model.bindTools(tools) 绑定工具
⑤ runAgentWithTools(query)：消息 = [SystemMessage(工作目录约束), HumanMessage(用户任务)] → for 循环（最多 30 轮）→ invoke → 判断是否调工具 → 不需要则结束，需要则遍历 tool_calls → find 匹配 → invoke 执行 → 四层判断处理返回值 → ToolMessage 带 tool_call_id 塞回 → 到了上限→ 返回最后一条消息
⑥ mcpClient.close() 释放资源

十、两种 MCP 完整对比

核心不变的是：McpServer 接口固定，工具注册方式不变，Agent 端 bindTools + ReAct 循环不变。变得只是 Transport 和配置方式。