游乐游手机版
首页/AI教程/文章详情

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

时间:2026-07-12 15:00
MCP远程调用通过HTTP替代stdio,支持npx一键启动本地包。串联高德地图、文件系统、浏览器控制三个MCPServer,实现“查地图→打开浏览器→写文件”的自动化工作流。Agent自动编排工具调用,无需手动编写编排逻辑,复用已有工具,降低开发成本。

MCP 远程调用(HTTP)完全解析:串联多个 MCP Server 打造 AI 工作流

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

从零理解远程 MCP:串联三个 MCP Server 打造 AI 自动化工作流

一、从 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 完整对比

本地 stdio(mcp-demo) 远程 HTTP(remote-mcp)
Server 在哪 你的文件 高德服务器 / npx 缓存的包
连法 command + args url / command + args
传输 stdin/stdout 管道 HTTP 网络 / 管道
跨机器 不能 能(url 方式)
工具代码 你自己写的 别人写的,你直接用
Server 数量 1 个 可串联多个

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

来源:https://juejin.cn/post/7661085673139568667
上一篇从零理解MCP:手写本地服务器接入LangChain Agent的完整教程 下一篇Vide Coding的基础知识详解:LLM大模型核心概念与学习路径
本站内容用于信息整理与展示,如有侵权或内容问题请及时联系处理。

相关推荐

补充同频道和同主题内容,方便继续浏览更多相关内容。

同类最新

继续查看同栏目最近更新的文章。

更多
天学会AI应用开发上下文与RAG阶段性总结
AI教程 · 2026-07-12

天学会AI应用开发上下文与RAG阶段性总结

系统梳理了AI应用开发中的上下文与RAG核心概念。搭建Python3 10开发环境后,通过提示词工程管理历史对话,利用截断、摘要提取及离线大模型压缩上下文。RAG采用加载文档、分块、向量化、存入FAISS或Chroma库、检索五个步骤,中文场景推荐BGE-small嵌入模型,实战证明离线检索有效。

Yank Note系列14:如何与AI协作写文章
AI教程 · 2026-07-12

Yank Note系列14:如何与AI协作写文章

YankNote3 92 1发布,新增“审阅批注”和“编辑装订线”扩展,聚焦AI写作的人机协作循环。审阅批注将反馈绑定到选中文本,编辑装订线高亮显示修改行,帮助人看清AI改动。同时升级Markdown-it至14 3 0,优化中日韩文本渲染。

一文读懂MCP:让AI大模型万能插拔协议
AI教程 · 2026-07-12

一文读懂MCP:让AI大模型万能插拔协议

MCP(模型上下文协议)由Anthropic提出,为AI大模型提供通用接口标准,解决工具调用碎片化问题。采用Host Client Server架构,支持动态发现工具,通过stdio或HTTP通信,实现工具即插即用、跨语言调用和统一对接规范。

BeeWeave开源:为AI Agent打造越用越懂你的知识创作台
AI教程 · 2026-07-12

BeeWeave开源:为AI Agent打造越用越懂你的知识创作台

BeeWeave是一个Agent原生的知识创作台,通过workbench和vault双层结构实现素材获取、内容创作、知识沉淀与上下文复用的持续闭环。它支持多Agent共用同一套知识库,内置41个Skills,采用MIT开源协议,旨在解决跨会话知识丢失问题。

AI闭环工程师自动推进工程任务
AI教程 · 2026-07-12

AI闭环工程师自动推进工程任务

LoopEngineer是一种将AI嵌入可执行、可验证、可持续迭代的工作循环中的工程协作方式。通过触发器、上下文、工具和验证机制,AI在循环中自动分析、执行、验证并调整,直至任务完成或需人工介入,实现复杂任务的可观察、可审计、可批准的分段自动化。