Claude Code支持MCP已经一年了,但90%的开发者只用了Filesystem这一个Server。本文给你5个生产级MCP Server配置模板,从浏览器自动化到数据库查询,让Claude Code从"代码补全工具"变成"全栈开发Agent"。
为什么你的Claude Code还是"半自动"
如果你和我一样,最初用Claude Code就是让它改bug、写函数、重构代码。这没问题——但这不是Agent,这只是高级自动补全。
真正的AI Agent应该能:
- 打开浏览器验证自己写的代码能不能跑
- 查GitHub Issue找到相关上下文再改代码
- 直接操作数据库验证数据迁移脚本
- 搜索最新技术文档而不是凭记忆编造API
这些能力的关键不是模型本身,而是 MCP(Model Context Protocol) ——一个让AI模型安全访问外部工具的开放协议。
Claude Code原生支持MCP,你只需要配置JSON文件。但"配置什么、怎么配、配完怎么用"这三个问题,挡住了大多数人。
本文给你5个生产环境验证过的MCP Server配置,覆盖最常见的AI辅助开发场景。每个配置都可以直接复制粘贴。
一、快速回顾:MCP配置基础
Claude Code的MCP配置文件在:
# macOS/Linux
~/.claude/claude_desktop_config.json
# 或在项目根目录
.claude/mcp.json
基本结构:
{
"mcpServers": {
"server-name": {
"command": "npx",
"args": ["-y", "@org/mcp-server-name"],
"env": {
"API_KEY": "your-key-here"
}
}
}
}
配好后重启Claude Code,输入 /mcp 就能看到已连接的Server列表。
二、5个生产级MCP Server配置
Server 1:Playwright — 浏览器自动化(必装)
用途:让Claude Code打开浏览器,验证前端代码、截图调试、自动填表测试。
{
"mcpServers": {
"playwright": {
"command": "npx",
"args": [
"-y",
"@playwright/mcp@latest"
]
}
}
}
实战场景:写完一个登录页面,让Claude Code直接打开浏览器验证:
- "打开 localhost:3000/login,填表并截图"
- "检查这个页面的所有按钮是否有点击态样式"
- "模拟移动端375px宽度截图"
踩坑提醒:需要先 npx playwright install chromium 安装浏览器内核。如果遇到沙箱问题(Docker环境),加 --no-sandbox 启动参数。
Server 2:GitHub — 代码上下文 + Issue管理
用途:让Claude Code访问GitHub仓库、搜索Issue/PR、创建分支和提交。
{
"mcpServers": {
"github": {
"command": "npx",
"args": [
"-y",
"@modelcontextprotocol/server-github"
],
"env": {
"GITHUB_PERSONAL_ACCESS_TOKEN": "ghp_xxxxxxxxxxxx"
}
}
}
}
实战场景:
- "查看这个repo最近3天的Issue,按优先级总结"
- "找到修复bug #342的PR,告诉我具体改了什么"
- "根据这些Issue讨论,生成修复方案"
安全注意:Token权限建议用Fine-grained token,只给需要的repo读权限。生产环境不要用Classic token的全部权限。
Server 3:Postgres / SQLite — 数据库直连
用途:让Claude Code直接查询数据库结构、验证数据迁移、生成分析报表。
Postgres版:
{
"mcpServers": {
"postgres": {
"command": "npx",
"args": [
"-y",
"@modelcontextprotocol/server-postgres",
"postgresql://user:pass@localhost:5432/mydb"
]
}
}
}
SQLite版(更轻量,适合本地开发):
{
"mcpServers": {
"sqlite": {
"command": "npx",
"args": [
"-y",
"@modelcontextprotocol/server-sqlite",
"/path/to/database.db"
]
}
}
}
实战场景:
- "检查这个migration脚本会不会造成数据丢失"
- "统计上周新增用户的地域分布"
- "这个查询有没有N+1问题?帮我优化"
安全提醒:生产库务必用只读账号,不要给root权限。或者用副本库。
Server 4:Brave Search — 实时信息检索
用途:让Claude Code搜索最新文档、API变更、Stack Overflow答案。解决LLM"知识截止日期"问题。
{
"mcpServers": {
"brave-search": {
"command": "npx",
"args": [
"-y",
"@modelcontextprotocol/server-brave-search"
],
"env": {
"BRAVE_API_KEY": "BSA-xxxxxxxxxxxx"
}
}
}
}
Brave Search API Key免费额度:每月2000次查询,对个人开发者完全够用。申请地址:https://brave.com/search/api/
实战场景:
- "Next.js 15的middleware有什么breaking change?查最新文档"
- "这个npm包最近有安全漏洞吗?搜索CVE"
- "React 19的use() hook怎么用?找3个实际例子"
对比:比直接问Claude(可能给过时信息)准确得多,而且会给出来源链接方便验证。
Server 5:Filesystem — 安全文件操作(默认配置升级版)
用途:Claude Code默认就能读写文件,但加上Filesystem MCP Server可以:限定可访问目录(安全沙箱)、批量文件搜索、文件变更监听。
{
"mcpServers": {
"filesystem": {
"command": "npx",
"args": [
"-y",
"@modelcontextprotocol/server-filesystem",
"/Users/yourname/projects/myapp",
"/Users/yourname/projects/docs"
],
"env": {}
}
}
}
关键参数:args 数组里列出允许访问的目录。Claude Code只能在这些目录内操作,写不到其他地方。这是生产环境的安全基线。
三、完整配置模板(一键复制)
把下面5个Server合并到一个文件,覆盖90%的日常开发场景:
{
"mcpServers": {
"playwright": {
"command": "npx",
"args": ["-y", "@playwright/mcp@latest"]
},
"github": {
"command": "npx",
"args": ["-y", "@modelcontextprotocol/server-github"],
"env": {
"GITHUB_PERSONAL_ACCESS_TOKEN": "替换为你的token"
}
},
"sqlite": {
"command": "npx",
"args": [
"-y",
"@modelcontextprotocol/server-sqlite",
"/path/to/your/database.db"
]
},
"brave-search": {
"command": "npx",
"args": ["-y", "@modelcontextprotocol/server-brave-search"],
"env": {
"BRAVE_API_KEY": "替换为你的API Key"
}
},
"filesystem": {
"command": "npx",
"args": [
"-y",
"@modelcontextprotocol/server-filesystem",
"/path/to/your/project"
]
}
}
}
保存到 ~/.claude/claude_desktop_config.json,重启Claude Code,输入 /mcp 确认5个Server都是绿色connected状态。
四、进阶技巧:自定义MCP Server
如果官方Server不够用,你可以写自己的MCP Server。核心只需要实现3个方法:
# 最小MCP Server示例 (Python)
from mcp.server import Server, NotificationOptions
from mcp.server.models import InitializationCapabilities
server = Server("my-tool")
@server.list_tools()
async def list_tools():
return [
{
"name": "deploy_to_vercel",
"description": "部署当前项目到Vercel",
"inputSchema": {
"type": "object",
"properties": {
"project_name": {"type": "string"},
"env": {"type": "string"}
}
}
}
]
@server.call_tool()
async def call_tool(name: str, arguments: dict):
if name == "deploy_to_vercel":
# 执行部署逻辑
return {"result": f"部署成功: {arguments['project_name']}"}
if __name__ == "__main__":
server.run()
然后注册到Claude Code:
{
"mcpServers": {
"my-custom-tool": {
"command": "python3",
"args": ["/path/to/my_mcp_server.py"]
}
}
}
这样你就能让Claude Code调用你公司的内部API、部署工具、数据管道——任何有API的东西。
五、常见问题速查
Q1: /mcp 显示红色disconnected?
检查三个点:
1. npx 版本是否≥10(npx --version)
2. 网络是否能访问npm registry
3. 配置JSON语法是否正确(用 python3 -m json.tool 验证)
Q2: Playwright Server打开浏览器是白屏?
要用headful模式(有GUI显示),Docker/SSH环境需要X11转发或VNC。纯命令行环境用headless模式截图就够了。
Q3: 多个Server会冲突吗?
不会。MCP Server是独立进程,每个Server有自己独立的STDIO通道。可以放心装10个以上。
Q4: 安全方面需要注意什么?
- Filesystem Server 一定要限定目录范围,不要给 / 根路径
- GitHub Token用Fine-grained token,最小权限原则
- 数据库连接用只读账号
- 不要在生产服务器上给Claude Code写权限
Q5: 和Claude Code自带的工具有什么区别?
Claude Code自带文件读写、命令执行。MCP Server是扩展——浏览器、数据库、搜索、API调用这些是Claude Code原生没有的。两者互补。
总结:从"半自动"到"全自动"的最后一公里
| 场景 | 不用MCP | 用MCP |
|---|---|---|
| 修前端bug | 改代码 → 手动打开浏览器 → 手动验证 | 改代码 → 让Claude打开浏览器截图验证 |
| 写数据迁移 | 猜表结构 → 写SQL → 手动跑 | 直接查表结构 → 生成SQL → 验证数据 |
| 研究新API | 凭记忆(可能过时) | 实时搜索最新文档 |
| 排查Issue | 手动翻GitHub | 自动搜索相关Issue/PR |
一句话总结:Claude Code本身是一把瑞士军刀,MCP是给它装上了电钻、锯子和激光测距仪。配置只需要10分钟,效果是10倍效率提升。
下期预告:OpenClaw v2026.6新版本的Channel多路复用功能——一个Agent同时接入微信+飞书+Telegram,真正实现"一人公司的24小时AI值班"。
