1 必要的运行条件
(1)MCP Server 基本都是使用Node.js或者python来启动的,所以电脑必须安装Node.js 和 python,本文这里只演示一些基于Node.js的MCP Server的配置示例。至于Node.js 和 python的安装教程,网上一搜有很多,这里就不说明了。
(2)如果你需要使用Cursor的MCP功能,那么建议将Cursor版本升级到0.46.x版本,在这个版本中MCP被单独抽离出来,并且新增了通过配置文件的方式创建MCP Server。
(3)如果你使用VsCode,你需要安装Cline插件,目前已支持MCP Server,并且也是通过配置文件的方式。
(4)Cline插件和Cursor 0.46.x的配置文件是可以相互使用的,本文只演示在Cursor中的配置。
2 配置实战
2.1 创建MCP Server的配置文件
在项目的根目录下创建一个.cursor
的文件夹,里面新建一个 mcp.json
文件
2.2 实战-配置sequential-thinking
sequential-thinking是一个可以把普通的AI大模型转换为一个推理模型的MCP Server
访问下面的sequential-thinking的github地址,找到npx命令的配置
https://github.com/smithery-ai/reference-servers/tree/main/src/sequentialthinking
复制上面的npx命令,如果你是windows用户,需要做如下的修改:command修改为cmd ,下面的args数组增加 "/c"和 "npx",注意顺序不要乱。
{
"mcpServers": {
"sequential-thinking": {
"command": "cmd",
"args": [
"/c",
"npx",
"-y",
"@modelcontextprotocol/server-sequential-thinking"
]
}
}
}
保存文件后,回到MCP设置页面,此时,默认的MCP Server是Disabled状态的,我们需要点击一下Disabled按钮,让这个MCP Server变为 Enabled的
变为Enabled的同时,windows会弹出一个黑色的cmd窗口。注意:不要关闭这个窗口,否则这个MCP Server不会启动成功。
稍等一会就可以看到这个MCP Server前面有一个绿色的圆点,表示这个MCP Server已经成功启动。注意:在使用这个MCP Server过程中也不要关闭这个窗口,否则这个MCP Server会自己关闭。
Disabled和Enabled就是控制是否需要这个MCP Server,不需要的时候,改为Disabled就行。
现在你就可以使用这个MCP Server了。注意,必须要在Agent模式下使用!!!
2.2 实战-配置filesystem
filesystem这个MCP Server可以让Cursor读取电脑上的文件/文件夹
同理,访问下面的filesystem的github地址,找到npx命令的配置
https://github.com/modelcontextprotocol/servers/tree/main/src/filesystem
复制上面的npx命令,如果你是windows用户,需要做如下的修改:command修改为cmd ,下面的args数组增加 "/c"和 "npx",注意顺序不要乱。注意,多个MCP Server之间使用逗号隔开。还需要配置你想让MCP Server读取的文件路径 "C:\\Users\\{用户名}\\Desktop\\test"
(这里我只是举个例子,具体的换成你自己的文件路径)
{
"mcpServers": {
"sequential-thinking": {
"command": "cmd",
"args": [
"/c",
"npx",
"-y",
"@modelcontextprotocol/server-sequential-thinking"
]
},
"filesystem": {
"command": "cmd",
"args": [
"/c",
"npx",
"-y",
"@modelcontextprotocol/server-filesystem",
"C:\\Users\\{用户名}\\Desktop\\test"
]
}
}
}
配置完成后Enabled这个MCP Server,并且等待MCP Server准备好。不要关闭打开的黑色cmd窗口!!!
现在你就可以使用这个MCP Server了。注意,必须要在Agent模式下使用!!!
我现在使用agent模式,询问它C:\\Users\\{用户名}\\Desktop\\test文件夹下有什么,他就可以给我列出来。
2.2 实战-配置BrowserTools MCP
BrowserTools 可以直接获取和分析浏览器的数据,包括日志,网络请求,页面DOM节点等,是前端开发人员的有利工具。
BrowserTools的giuhub地址
https://github.com/AgentDeskAI/browser-tools-mcp
(1)安装浏览器扩展程序
使用BrowserTools 要先安装一个浏览器扩展程序
v1.2.0 BrowserToolsMCP Chrome Extension
这里演示使用chrome浏览器,因此需要将这个扩展程序安装到chrome浏览器中。链接下载的是一个压缩包,需要解压出来,使用“加载已解压的扩展程序”的方式安装,具体步骤请自行搜索。
(2)配置MCP Server文件。同样的,command修改为cmd ,下面的args数组增加 "/c"和 "npx",注意顺序不要乱。
{
"mcpServers": {
"sequential-thinking": {
"command": "cmd",
"args": [
"/c",
"npx",
"-y",
"@modelcontextprotocol/server-sequential-thinking"
]
},
"browser-tools-mcp" : {
"command": "cmd",
"args": [
"/c",
"npx",
"-y",
"@agentdeskai/browser-tools-mcp@1.2.0"
]
},
"filesystem": {
"command": "cmd",
"args": [
"/c",
"npx",
"-y",
"@modelcontextprotocol/server-filesystem",
"C:\\Users\\xxx\\Desktop\\test"
]
}
}
}
配置完成后Enabled这个MCP Server,并且等待MCP Server准备好。不要关闭打开的黑色cmd窗口!!!
(3)启用BrowserTools的Server端(必须)
新开一个cmd窗口,输入下面的命令。
npx @agentdeskai/browser-tools-server@1.2.0
注意,这个cmd窗口也不要关闭!!!首次执行上面的命令,需要让你安装对应的npm包,安装即可。
(4)判断BrowserToolsMCP
是否安装成功
打开浏览器的调试面板(F12),可以看到左上角显示BrowserToolsMCP已开始调试比浏览器
并且在浏览器调试工具栏打开 BrowserToolsMCP
,显示 Connected tobrowser-tools-server v1.2.0 at
localhost:3025
,这时候说明我们的配置的没有问题的。
(5)使用示例
A. 询问我在页面中选中的元素是什么
B. 捕获浏览器的错误日志,分析并修复代码
3 MCP Server相关站点推荐
https://smithery.ai/
https://github.com/modelcontextprotocol/servers
https://www.pulsemcp.com/servers
https://github.com/punkpeye/awesome-mcp-servers
https://mcp.so/
https://glama.ai/mcp/servers
https://mcpservers.org/
还可以利用VS Code中的Cline插件的MCP Server市场查看
4 其它建议
目前MCP的安全性无法保证,因为个人是可以自己开发MCP Server并上线发布,建议使用star多的MCP或者知名团队开发的MCP