Playwright#

一个基于 Playwright 提供浏览器自动化能力的模型上下文协议 (MCP) 服务器。该服务器使大型语言模型 (LLM) 能够通过结构化的无障碍快照与网页进行交互，无需使用截图或视觉调优模型

GitHub - microsoft/playwright-mcp: Playwright MCP server

配置方法：#

claude code ：

1
claude mcp add playwright npx @playwright/mcp@latest

codex :

1
[mcp_servers.playwright]
2
command = "npx"
3
args = ["@playwright/mcp@latest"]

验证使用：#

使用Playwright帮我打开一个空白的浏览器页面
检查浏览器状态
操作按钮
…

Chrome DevTools#

背景：在过去出现过Browser Tools MCP和Chrome MCP这类工具，不过这类工具其实都是社区维护的，配置起来也比较麻烦，而且需要在浏览器里面安装插件，好在谷歌官方下场推出了Chrome DevTools MCP，配置相对简单，只要安装过Chrome浏览器就可以直接使用

GitHub - ChromeDevTools/chrome-devtools-mcp: Chrome DevTools for coding agents

配置方法：#

claude code ：

在终端使用命令

1
claude mcp add chrome-devtools npx chrome-devtools-mcp@latest --scope user

使用了 --scope user 参数，这会将 MCP 添加到用户级别的全局配置，而不是项目级别

验证mcp是否状态正常：

1
claude
2
/mcp

NOTE
当claude成功添加完一个MCP之后，会有提示在.claude.json添加记录
File modified: C:\Users(你的用户名)\.claude.json

codex :

通过更新 C:\Users(你的用户名)目录下的.codex/config.toml 文件并添加以下 env 和 startup_timeout_ms 参数

1
[mcp_servers.chrome-devtools]
2
  command = "cmd"
3
  args = [
4
      "/c",
5
      "npx",
6
      "-y",
7
      "chrome-devtools-mcp@latest",
8
  ]
9
  env = { SystemRoot="C:\\Windows", PROGRAMFILES="C:\\Program Files" }
10
  startup_timeout_ms = 60_000

CAUTION
如果是在wsl，env的路径应该是？？？？

如果是mac，配置可以简化

1
[mcp_servers.chrome-devtools]
2
  command = "npx"
3
  args = [
4
      "-y",
5
      "chrome-devtools-mcp@latest"
6
  ]

验证mcp是否状态正常：

1
codex
2
/mcp

验证使用：#

使用Chrome DevTools帮我打开一个空白的浏览器页面
检查浏览器状态
操作按钮
…

高级应用：#

在 Windows WSL 中使用 chrome-devtools mcp

Context7#

让AI去查找文档，获取最新的文档知识辅助开发

GitHub - upstash/context7: Context7 MCP Server — Up-to-date code documentation for LLMs and AI code editors

配置方法：#

claude code ：

在终端使用命令

1
claude mcp add --transport http context7 https://mcp.context7.com/mcp

codex :

windows :

1
[mcp_servers.context7]
2
  command = "cmd"
3
  args = [
4
    "/c",
5
    "npx",
6
    "-y",
7
    "@upstash/context7-mcp",
8
    "--api-key",
9
    "YOUR_API_KEY"
10
  ]
11
  env = { SystemRoot="C:\\Windows" }
12
  startup_timeout_ms = 20_000

mac :

1
[mcp_servers.context7]
2
  args = ["-y", "@upstash/context7-mcp", "--api-key", "YOUR_API_KEY"]
3
  command = "npx"

NOTE
api-key的配置不是必须的，如果有，肯定更好

Codex#

codex支持本身作为MCP去使用，这样的话与不同LLM协同提供了可能性，比如codex + claude协同，一方负责审查，一方负责执行，分工合作

配置方法#

claude code:

1
claude mcp add --transport stdio codex codex mcp-server --scope user

验证使用#

你可以调用codex mcp，询问“1+1=？”

sequential-thinking#

结构化思维MCP，让提出的问题更有条理

配置方法#

claude code :

1
claude mcp add sequential-thinking --scope user -- cmd /c npx @modelcontextprotocol/server-sequential-thinking

codex :

1
[mcp_servers.sequential-thinking]
2
command = "npx"
3
args = ["-y", "@modelcontextprotocol/server-sequential-thinking"]

验证使用#

你可以调用sequential-thinking mcp，询问“如何规划AI辅助开发？”