ARTICLE DETAIL

资讯详情

深耕网站视觉设计与运营推广的一线实战洞察。

MCP 协议从原理到实战:Playwright、MySQL 与远程部署全解析

MCP 协议从原理到实战:Playwright、MySQL 与远程部署全解析 1. MCP 是什么先搞清楚它想解决什么问题我最初接触 MCPModel Context Protocol模型上下文协议的时候其实有点懵。因为网上资料要么讲得太底层一上来就是 JSON-RPC、SSE、工具调用把新手直接劝退要么讲得太玄乎把 MCP 吹成“AI 的 USB-C 接口”之后就没了下文。真正让我搞懂 MCP 的是我自己在把 AI 接入各种工具时被一个个孤立的插件方案折腾得够呛之后。先说结论MCP 是 Anthropic 在 2024 年 11 月开源的一个协议目标是规范 AI 模型与外部工具、数据源之间的通信方式。你可以把它理解成一套“AI 调用工具”的通用语言。以前每个 AI 应用接一个工具都要单独写一套集成代码互相之间还不通用MCP 出现之后工具方只需要按这套协议暴露能力任何支持 MCP 的 AI 应用都能直接对接不用再重复造轮子。举个例子。以前我想让 AI 帮我操作浏览器得用 Playwright 写脚本想让 AI 查数据库得自己写 SQL 执行接口想让 AI 读设计稿信息得调用 Figma 的 API 再自己解析。每个都是独立项目每个都要维护一套鉴权、调用、返回的格式。MCP 把这些统一了工具方实现一个 MCP ServerAI 应用作为 MCP Client 去连接两边都按协议说话剩下的事情就简单多了。这套东西适合谁我的经验是三类人最需要AI 应用开发者尤其是做 Agent、智能助手、自动化工作流的MCP 能帮你省掉大量工具集成的重复工作。测试与安全工程师现在 Playwright MCP、Burp Suite MCP 这一套已经非常成熟用自然语言就能驱动自动化测试和接口安全验证。凡是觉得“AI 只会聊天、不会干活”的人MCP 就是让 AI 真正“上手干活”的那一层连接。还有一个高频问题我直接回答掉MCP 到底是软件协议还是硬件协议答案是软件协议。它跑在应用层走的是 JSON-RPC 2.0 消息格式跟物理层的硬件协议完全不是一回事。如果你在工业软件里看到“MCP”三个字母那大概率是别的缩写比如 Xilinx 的 MicroBlaze 处理器相关的 MCS、或者某些领域里的专有名词跟这个 AI 领域的 MCP 别混淆了。2. MCP 的核心架构与工作原理解读2.1 三个角色Host、Client、Server要理解 MCP先记住这张“人物关系图”一个完整的 MCP 会话里有三个角色。Host 是宿主程序也就是你正在用的那个 AI 应用比如 Claude Desktop、Cursor、VS Code、Trae IDE甚至是你自己写的 Python 脚本。Host 负责承载整个会话管理用户交互决定调用哪个工具。Client 是协议客户端它跑在 Host 里面每个 MCP Server 的连接对应一个 Client 实例。你可以把 Client 理解成“翻译官”它负责把 Host 的意图翻译成符合 MCP 协议的消息发给 Server再把 Server 的返回翻译回来。Server 是服务端它是真正干活的程序。Server 负责暴露工具、资源和提示模板。比如一个 MySQL MCP Server 会暴露query这样的工具一个 Playwright MCP Server 会暴露browser_navigate、browser_click这样的浏览器操作工具。实际使用的时候这套结构是“一对多”的。我一个 Cursor 里面可以同时挂着浏览器 MCP、数据库 MCP、文件操作 MCP每个都是独立的 Client-Server 连接。这有一个直接好处某个 Server 挂了不会影响其他工具我在实际开发时深有体会一个不稳定的插件不会拖垮整个 IDE。2.2 三种核心原语Tools、Resources、PromptsMCP 协议定义了三种核心原语这是区分它跟普通 API 封装的关键。**Tools工具**是最常用的它代表“让 AI 执行一个动作”。比如navigate_to_url、execute_sql、create_image。Tool 有输入参数的定义AI 会根据用户意图自己决定调用哪个 Tool、传什么参数。它本质上是一个“可被 AI 动态调用的函数”。**Resources资源**代表“可读取的数据”。比如一个配置文件的路径、一个数据库的 schema、一个知识文档。Resources 是给 AI 提供上下文的比如我连了一个代码库 MCPAI 就能通过读取 Resource 来了解项目的目录结构和关键文件内容。**Prompts提示模板**代表“预设的交互流程”。比如一个“代码审查”模板里面定义了角色、步骤、输出格式。AI 应用启动时可以通过 list_prompts 发现这些模板用户触发后 AI 就按模板执行。合理设计 Prompts 能把一些复杂的重复性工作固化下来。这三个原语不是并列关系而是互补的Resources 负责“看”Tools 负责“做”Prompts 负责“套路”。我在设计自己的 MCP Server 时优先把数据读取类能力做成 Resources把操作类能力做成 Tools把多步流程做成 Prompts后期维护起来特别清晰。2.3 传输方式stdio 与 Streamable HTTPMCP 的传输层有两种主流方式这个直接影响你怎么部署。stdio 模式Server 和 Client 在同一个进程里通过标准输入输出流通信。适合本地工具配置简单、性能好。比如 Claude Desktop 把你本地的配置文件的路径传给子进程子进程启动一个 MCP Server两者通过 stdio 交换 JSON-RPC 消息。Streamable HTTP 模式Server 是一个独立的 HTTP 服务Client 通过网络远程连接。适合部署在服务器上或者给多人共享。热词里出现的wss://形式的地址就是这种模式的远程端点通过 WebSocket 保持长连接交互时延更低。选哪种我的个人建议本机工具用 stdio跨机器共享用 Streamable HTTP。别一上来就追求远程部署本地 stdio 没有网络层的问题排错容易得多。远程模式虽然灵活但你要额外处理鉴权、TLS、跨域这些事对于学习阶段性价比不高。3. MCP 生态全景那些我实测过的典型应用3.1 开发调试类Playwright MCP 与 Chrome DevTools MCP热词里 Playwright MCP 和 Chrome DevTools MCP 出现频率最高这俩是“AI 操作浏览器”的主力方案但我必须提醒一句它俩不是一个东西别混用。Playwright MCP是基于 Playwright 自动化库实现的。它暴露的接口是“高语义”的比如browser_navigate跳到某个 URL、browser_click点击元素、browser_type输入文字。AI 通过这些工具就可以像人一样操作浏览器完成端到端测试。它的优势是抽象层次高AI 调用起来非常直观而且自带无头浏览器能力。Chrome DevTools MCP则是直接对接 Chrome 的 DevTools 协议CDP暴露的是偏“底层”的能力。比如console消息监听、网络请求捕获、DOM 断点、Performance 分析等。它适合做调试和性能分析比如 AI 帮你打开开发者工具、读取网络时序、分析 JS 报错。我实测下来的场景分得很清楚做 E2E 测试任务时用 Playwright MCP做前端调试和性能排查时用 Chrome DevTools MCP。有的项目两者会同时挂上像 Cursor 里可以同时加载这两个 ServerAI 自己判断当前任务更适合用哪一套。如果你在对比 Browser Use MCP 和 Playwright MCP关键差异也在这里Playwright MCP 更偏“浏览器自动化测试”Browser Use 更偏“让 AI 自主完成网页交互任务”选型时看你最终目标是什么。3.2 安全测试类Burp Suite MCP、Yakit MCP 与 Cheat Engine MCP热词里安全方向的 MCP 浓度极高这块我多说几句。Burp Suite MCP让我印象深刻。Burp Suite 是 Web 安全测试的标配工具MCP Server 把它的接口暴露给 AI意味着 AI 可以直接操作 Burp 的代理、扫描、重放等功能。Trae IDE 搭载 Burp Suite MCP Server 的玩法等于让 AI 读取请求包、修改参数、重放攻击这在接口安全验证里非常省事。我实际用它做过一个登录接口的越权测试AI 自动提取请求、替换 token、比对响应码整个流程比手工快了好几倍。Yakit MCP是国产安全工具的典型代表。Yakit 本身就是一套集成化的安全测试平台MCP 化之后AI 可以调用它的端口扫描、漏洞检测、MITM 抓包能力。跟 Burp MCP 相比Yakit 更偏“极客工具链”灵活度更高但上手难度也大一点。Cheat Engine 桥接 MCP是游戏安全方向的。Cheat Engine 常用于游戏内的内存扫描和数值修改桥接 MCP 后AI 可以协助分析游戏进程的数值地址这在 CTF 逆向题和游戏安全研究中很实用。不过我要提醒一句这类能力只能用于合法的安全研究和单人游戏测试别拿去搞任何在线游戏作弊这个边界不能越。安全这一块的共同点是这些 Server 都具有高危险性、高破坏性的操作能力。我的经验是凡是连安全工具的 MCP一律本地起、用完关、不给远程访问权限。远程暴露一个可以操控 Burp 或 Cheat Engine 的接口等于把攻击武器送出去千万谨慎。3.3 设计与建模类Figma MCP、Blender MCP、Unity MCP设计软件这几年也快速补上了 MCP 支持。Figma MCP是我在 UI 设计流程里最常用的。它让 AI 能读取 Figma 画布里的图层结构、组件属性、文本内容还可以操作设计稿。VS Code 里配置 Figma MCP 之后AI 可以直接“看”设计稿来生成前端代码这比人肉切图对样式要准确得多。蓝湖 MCP 的定位也类似偏国内设计协作的交付流程。Blender MCP让 AI 操作 3D 建模软件成为可能。你可以让 AI 创建对象、修改材质、调整灯光甚至批量建模。Blender 本身有 Python APIMCP Server 其实就是把这些接口包装成协议化工具。实测下来AI 建模的质量取决于你对需求的描述精度越具体越可控。Unity MCP的方向是游戏开发辅助。不同于 Blender 偏建模与渲染Unity MCP 更关注场景节点操作、Prefab 管理、C# 脚本生成。Vivado 的 MCP 则完全是另一个领域了——硬件开发里的概念跟 AI 无关遇到这个词你得看上下文才能判断是不是同一回事。我的体会是设计类工具的 MCP 化本质上是放大人的意图而不是替代人的设计能力。AI 可以帮你快速打草稿、批量改参数但审美和创意决策还是得有你把关。3.4 数据与业务类MySQL MCP、QGIS MCP 与同花顺 MCP数据接入类的 MCP是很多人入门的第一个 Server因为关系最直接、价值最明确。MySQL MCP让 AI 可以直接对数据库执行查询、修改、建表。我本地装过 Node.js 版和 Python 版。一个典型的场景是我在 Claude Code CLI 里跟 AI 描述需求AI 自动生成 SQL、执行查询、把结果整理成报告。这种体验比在终端里手敲 SQL 舒服太多了。配套的还有 PostgreSQL MCP、SQLite MCP原理都一样只是适配不同数据库。QGIS MCP是我最近才注意到的。QGIS 是开源 GIS 软件MCP 化之后 AI 能读取图层信息、执行空间查询、处理地理数据。做地图数据分析和地理可视化的人会很爱它。同花顺 MCP属于垂直行业数据接入。让 AI 拉取行情数据、执行选股逻辑、分析财务指标。不过这类型 Server 通常对数据权限有严格限制只能接公开接口别想着绕过任何付费数据服务合规红线不能碰。如果后续要做“手机怎么获取 MCP 服务”这类需求数据传输层就得走 Streamable HTTP手机上的 AI 应用通过 wss:// 远程地址连接 Server。这跟本地 stdio 的体验完全不同移动端场景基本都依赖远程部署。4. 实操从零配置一个 MCP Server 并跑通对话4.1 环境准备与工具选型看完上面的案例你应该已经意识到MCP 这东西不是“装一个就万事大吉”而是“按需装配”。下面我以一次完整的实操为例带你跑通“让 AI 连上本地 MySQL 数据库”这条路。准备清单一个支持 MCP 的 AI 应用我用的是 Claude Desktop 和 Cursor 两个环境分别测过你也可以用 Trae IDE、VS Code 等。Node.js 16 环境因为很多 MCP Server 是 Node 实现的。本地一个可用的 MySQL 实例如果没有用 Docker 起一个也行docker run -d -p 3306:3306 -e MYSQL_ROOT_PASSWORD123456 mysql:8。一个文本编辑器后面你大概率会改配置。这里要解释一下选型逻辑。MCP Server 有官方实现也有社区实现我建议优先用“官方维护 Star 数高”的仓库。MySQL MCP Server 在 npm 上有多个版本我选的是benborla29/mcp-server-mysql这个库因为它的参数定义清晰、文档完善而且支持配置自定义查询白名单安全性可控一点。我的第一个建议是别一上来就自己写 MCP Server先用现成的跑通流程建立起“资源/工具/提示”的直觉后再自己动手。就跟写代码先读别人项目一样理解了调用链再动手会少走很多弯路。4.2 配置步骤以 Claude Desktop 为例Claude Desktop 的配置文件在 macOS 的~/Library/Application Support/Claude/claude_desktop_config.jsonWindows 在%APPDATA%\Claude\claude_desktop_config.json。首次配置 MCP Server就是往这个 JSON 里加一段配置。我用过的配置长这样{ mcpServers: { mysql-local: { command: npx, args: [ -y, benborla29/mcp-server-mysql ], env: { MYSQL_HOST: 127.0.0.1, MYSQL_PORT: 3306, MYSQL_USER: root, MYSQL_PASSWORD: 123456, MYSQL_DB: test } } } }保存后重启 Claude Desktop然后在界面里找到工具调用入口正常来说会看到mysql-local这个工具集。你可以直接对 AI 说“查询 test 库里的所有表”AI 就会自动调用这个 MCP 工具来执行 SQL。这里有几个关键点都是我踩过的command那行用npx是直接拉取远程包如果网络不稳定建议先npm install -g benborla29/mcp-server-mysql再配置成你本地的绝对路径。env里的参数取决于具体 Server 的约定不同实现变量名可能不一样一定要先看对应仓库的 README。配置文件里如果有多个 ServermcpServers下面并列写就行每个 Server 的 key 是唯一的。Cursor 的配置方式略有不同它是在 Settings 里的 MCP 面板里添加可以直接填command和args。VS Code 则通过 Copilot 的 MCP 配置入口。核心思路都一样就不过度展开了。4.3 自定义一个简单的 MCP ServerPython 版跑通现成 Server 之后我强烈建议你动手写一个自己的。这是理解协议最有效的方式。下面我用 Python 官方 SDK 写一个最小可用的 MCP Server。先装依赖pip install mcp然后创建my_server.pyfrom mcp.server.fastmcp import FastMCP mcp FastMCP(my-tools) mcp.tool() def add(a: int, b: int) - int: 两数相加供 AI 调用 return a b mcp.tool() def get_project_root() - str: 返回一个预设的项目根目录路径 return /Users/me/work/demo-project if __name__ __main__: mcp.run()这个 Server 只有两个工具一个加法一个返回路径。运行方式如果把它配置到 Claude Desktop用command: python、args: [绝对路径/my_server.py]的方式如果临时测试直接终端里跑python my_server.pySDK 默认走 stdio。再用一个几千行的 Python 脚本测一下也行但最直观的方式是把它接入 AI 应用。接入后你可以问“3 加 5 等于几”注意观察 AI 的响应逻辑它会先意识到有add工具可用然后自动传a3, b5拿到结果 8 之后再把答案告诉你。这个链路就是 MCP 调用的经典过程。自己实现一遍之后你会对协议有直觉理解Server 是纯被动的它不自己发起调用只等 Client 请求工具参数由 AI 自主决定所以你写的函数签名越清晰、docstring 越明确AI 的调用成功率越高。这跟写普通函数完全不同普通函数是给人看的MCP 的工具是给 AI 看的文档质量直接影响效果。4.4 远程 MCP Server 的部署与鉴权本地 stdio 模式玩熟之后你可能会遇到“手机怎么获取 MCP 服务”或者“多台机器共用”。这时候就需要把 Server 部署成 Streamable HTTP 模式。SDK 里的改动很小mcp.run()改成from mcp.server.sse import SseServerTransport from starlette.applications import Starlette from starlette.routing import Route import uvicorn # 用官方 SDK 的 Streamable HTTP 示例说白了就是把 stdio 换成 HTTP/SSE 的入口层。部署之后你的 AI 应用里就不是配置command了而是填一个url字段加上用于鉴权的token。热词里出现的wss://...地址就是这么用的。这里有一个安全提醒我放在实操第一部分讲远程模式的鉴权非常重要。理论上 Server 暴露在网络上之后任何知道地址的人都有机会尝试连接。合法做法是配置 token 校验、IP 白名单、TLS 加密而不是图省事裸奔。MCP Server 的能力通常很强裸奔等于把自家数据库或工具链暴露在公网这个后果很严重。5. 踩坑记录与排查技巧实录5.1 连接不上先查这三样MCP 配置最常遇到的问题就是“怎么加都连不上”。我的排查顺序是固定的第一确认命令能手动跑起来。直接在终端执行配置文件里的commandargs看有没有报错。如果你手动运行都要报错或者秒退那指望 AI 应用连上是不可能的。第二检查配置文件格式。JSON 一个逗号错了都会导致整个文件解析失败AI 应用会直接忽略。建议在改完配置后用 VS Code 或 Python 的json.load校验一下格式。第三看日志。Claude Desktop 的日志在~/Library/Logs/Claude/mcp-server-xxx.log。Cursor 等工具的日志也类似。很多新手连不上一查日志就明白了——缺环境变量、端口占用、路径错误日志里都会写。Server 端日志的管理这块你要是想自定义可以在自己 Server 代码里接入 logging 库写文件或者走结构化日志关键是先能看见错误。5.2 工具交互异常问题往往出在描述与权限有时候 Server 连上了但 AI 就是不调用工具或者调用出错。遇到这种问题我的优先级判断是工具描述不清晰AI 选择工具靠的是 name 和 description如果你的 description 写得含糊它可能根本不知道这个工具能干什么。重写 description说清楚“这个工具做什么、什么时候用、参数是什么含义”。参数 schema 不对如果工具声明接收strAI 传了intSDK 有的会做类型转换有的不会。最好在函数签名里写清楚类型并在 docstring 里补充取值范围。执行权限受限一些 Server 默认是只读模式比如 MySQL MCP 默认可能禁更新操作。你要是需要改数据得去 Server 配置里开启对应权限。务必注意开只读是有意为之的安全设计别为了方便全放开。5.3 我踩过的几个具体坑端口冲突远程部署 MySQL MCP 时我把 HTTP 服务挂到了 8080结果和本地另一个服务冲突白白排查了一下午。后来所有 MCP 服务都用 8090 以上的端口并在配置里注释用途。npx 网络依赖同一台机器装了多个 MCP Server全走 npx每次启动都要现拉包体验极差。现在凡是要长期用的我都本地安装并把路径写成绝对路径。父子进程环境不一致用 stdio 模式时AI 应用启动 Server 的环境变量和你终端里的不一定一致。我在 MySQL MCP 上踩过这个坑终端能连Claude Desktop 里连不上最后发现是 Homebrew 的 MySQL socket 路径差异解决方式是在 env 里显式配置 host 和端口不要依赖默认 socket。5.4 常见问题速查表现象可能原因解决思路配置后工具列表为空Server 启动失败或配置 JSON 语法错误手动运行命令看报错校验 JSONAI 不调用已加载的工具工具描述不清晰或参数 schema 不合理重写 description检查类型定义远程地址连不上鉴权缺失、端口未开放、TLS 问题检查 token、防火墙、证书stdio 模式下工具偶发超时Server 执行了长任务且未给进度回执在 Server 端实现进度回调或拆分任务多 Server 场景相互干扰共享了同一个 stdio 通道或同名工具给每个 Server 独立命名空间检查冲突排查问题的底层思路其实一句话MCP 链路是“AI 应用 → Client → 传输层 → Server → 工具”每一层都能用日志和手动测试来定位问题别只在 AI 对话框里反复试错。把链路拆开逐段验证绝大部分问题十分钟内能定位。6. 最后分享一点我个人的体会我从第一次听说 MCP 到自己写 Server、部署远程服务整个学习周期大约用了两周。最大的感受是MCP 并不是什么高深莫测的技术它本质上是一套“接口约定 成熟 SDK”的组合真正复杂的是你对接的那个工具领域本身。比如你接 Playwright前提是你得懂浏览器自动化你接 MySQL前提是你得懂 SQL。MCP 只是把 AI 和这些工具之间的最后一公里打通了。如果你现在正准备入门 MCP我的建议路径是这样的先玩熟一个现成的本地 Server比如 Playwright MCP 或 MySQL MCP然后自己写一个最简单的工具 Server最后再考虑远程部署和多工具协同。不要一上来就追热词里那些花哨的组合把基础链路吃透后面自然能举一反三。另外技术之外一定要记住安全边界。MCP 赋予了 AI 极强“动真格”的能力读文件、写数据库、发请求、跑扫描这些操作一旦脱离管控后果是不可控的。我自己的原则是本地工具按需开启远程服务一律加鉴权安全相关工具绝不暴露到公网。能力越大越要谨慎。
返回列表