lobe-chat安装mcp插件调用mcp服务(playwright)

之前已经介绍过完整的lobe-chat-database数据库版最新本地部署指南(含知识库)

lobe-chat提供了mcp的支持，mcp提供调用计算机中各种程序执行相关操作的能力，lobe-chat作为mcp的客户端，我们需要部署mcp服务端。

 
见上图，在lobe的mcp插件安装的界面可以看到两种接入方式：

• 它支持Steamable HTTP 流式通信来连接MCP服务（我们以这种方式为例来部署一个MCP服务并来连接），
• 还有一种STDIO是桌面版lobe-chat应用使用的，如果你安装了桌面lobe-chat那么可以直接安装lobe-chat mcp插件市场的插件，自动启动mcp服务，不过这不是我想要的，这种傻瓜式的部署你甚至无法对mcp服务做个性化配置，不过它也有优点，就是快，毕竟lobe-chat和mcp不经过网络传输，没有协议的开销，所以最终还是根据自己需求来决定采用哪种方式调用MCP服务。

一、在任意主机部署一款MCP服务

前提是你要找一个mcp服务，我找了一款比较知名的服务，项目叫playwright-mcp，它具备自动调用浏览器对网站进行自动操作的能力(输入，点击，搜索等)，官网网址： https://github.com/microsoft/playwright-mcp

阅读上面的部署文档：

 
要部署一个带配置的本地playwright-mcp服务，只要执行：

npx @playwright/mcp@latest --config path/to/config.json

这个config.json没有提供示例，不过它提供了Configuration file schema 配置约束文档，我将这个约束配置文档丢给AI，让它生成了一份默认的配置文件，然后我根据需要自己做了修改。

config.json

{
  "browser": {
    "browserName": "chromium",
    "isolated": false,
    "userDataDir": "./user-data",
    "launchOptions": {
      "channel": "chrome",
      "headless": false,
      "executablePath": "/Applications/Google Chrome.app/Contents/MacOS/Google Chrome"
    },
    "contextOptions": {
      "viewport": { "width": 1280, "height": 720 }
    },
    "cdpEndpoint": "",
    "remoteEndpoint": ""
  },
  "server": {
    "port": 8931,
    "host": "192.168.0.40"
  },
  "capabilities": [
    "tabs",
    "install",
    "pdf",
    "vision"
  ],
  "outputDir": "./output",
  "network": {
    "allowedOrigins": ["*"],
    "blockedOrigins": []
  },
  "imageResponses": "allow"
}

我修改了headless为false，executablePath调用我主机上的chrome浏览器，如果不修改你看不到浏览器执行的画面，你可以根据自己需要配置，“host”: “192.168.0.40” ，这个改成你自己的主机ip地址，或者"0.0.0.0"也可以，不要写成localhost，不然只能本机调用。

#将config.json放入一个文件夹比如~/Downloads
#安装的前提是你电脑上已经安装了node,版本>=18
cd ~/Downloads
npx @playwright/mcp@latest --config ./config.json

 
执行完成可以看到服务已经启动。

二、在Lobe-Chat中添加MCP服务

在lobe-chat中打开添加自定义插件界面 可以选择快速导入JSON配置，就是上面服务启动后给出的客户端配置：

{
  "mcpServers": {
    "playwright": {
      "url": "http://192.168.0.40:8931/mcp"
    }
  }
}

导入后，点击测试，右侧会显示这个mcp服务提供的api列表，后面大模型会直接调用api来来访问你部署的mcp服务。

 
下面在插件中启动你的插件

三、使用MCP

在聊天框中和ai对话，让它调用mcp，当然模型要选择有函数调用能力的，我这里选择了硅基流动的DeepSeek-V3.1模型

我向大模型发送了下面这句话：

使用mcp帮我打开https://zh.1lib.sk/ ，搜索一本小说，小说名称仙逆，帮我下载一本，保存在mcp服务器即可不需要传过来

我看到大模型打开了我的浏览器，访问了https://zh.1lib.sk/

接着它执行了搜索，找到了仙逆这本小说
 

不过由于我限额用完了，下载没能完成，但不可思议的事情发生了

它居然要尝试创建账户，或使用其他下载方式，此时token已经消耗了10万，我立马终止了测试。

 
这种网站操作的mcp服务对token的消耗是巨大的，一个不小心，你的api的余额就见底了，所以谨慎使用，除非你本地部署的模型，这样可以肆无忌惮的使用了。

最后，你可以部署任何你自己想要的mcp服务，通过lobe-chat的调用能力来实现你自己的需求。