无需复杂代码,用自然语言让AI帮你自动填表、抓数据、点按钮
你是否想过让AI不仅能回答问题,还能直接操作浏览器帮你做事?比如自动填写网页表单、抓取特定数据、或者点击按钮?现在,通过Dify和Chrome MCP的结合,你可以在3分钟内搭建一个能真正"动手"操作网页的AI助手。
本文将手把手教你如何在本地部署Dify并配置Chrome MCP服务器,打造你的私人网页自动化助手。
测试开发全景图:人工智能测试、智能驱动、自动化、测试开发、左移右移与DevOps的持续交付
准备工作:确保你的环境就绪
在开始前,请确保你的系统已安装:
- Docker 和 Docker Compose(用于快速部署Dify)
- Node.js 18+(用于运行Chrome MCP服务器)
- Git(用于克隆项目仓库)
第一步:快速部署Dify(仅需1分钟)
Dify是一个强大的LLM应用开发平台,我们通过Docker快速部署:
# 创建项目目录
mkdir dify-chrome-mcp && cd dify-chrome-mcp
# 下载Docker部署配置
curl -o docker-compose.yml https://raw.githubusercontent.com/langgenius/dify/main/docker/docker-compose.yml
# 启动Dify服务
docker-compose up -d
等待1分钟左右,访问 http://localhost:80 就能看到Dify管理界面。首次使用需要创建账号并完成初始化设置。
第二步:安装Chrome MCP服务器(1分钟)
打开新的终端窗口,安装并启动Chrome MCP服务器:
# 安装Chrome MCP服务器
npm install -g @modelcontextprotocol/server-chrome
# 启动Chrome MCP服务(会自动打开Chrome浏览器)
server-chrome
服务启动后,你会看到类似下面的输出,表示MCP服务器正在9999端口监听:
Server running on http://localhost:9999
Chrome browser launched and connected successfully
第三步:在Dify中配置Chrome MCP(1分钟)
现在回到Dify管理界面,进行关键配置:
- 进入设置 > 模型供应商 > MCP服务器
- 点击添加MCP服务器
- 填写配置信息:
- 服务器名称: Chrome-Automation
- 服务器URL: http://localhost:9999
- 点击验证并保存,看到绿色成功提示
效果验证:让AI帮你操作网页
配置完成后,你就可以在Dify的Playground中测试你的网页自动化AI助手了。
试试这些实用场景:
场景1:自动网页搜索
请打开百度首页,在搜索框中输入"最新AI技术发展",点击搜索按钮,然后告诉我第一页的搜索结果标题。
场景2:自动填写表单
请打开https://example.com/contact页面,在姓名栏填写"张三",邮箱栏填写"zhangsan@email.com",在留言区填写"咨询产品信息",然后点击提交按钮。
场景3:数据抓取与分析
请打开https://news.example.com/technology页面,抓取所有新闻标题和发布时间,然后分析今天最热门的技术话题是什么。
工作原理:为什么这很厉害?
这个组合的厉害之处在于分工明确:
- Dify:负责与LLM对话,理解你的自然语言指令,并将其分解成具体的浏览器操作步骤
- Chrome MCP服务器:负责实际控制Chrome浏览器,执行具体的网页操作命令
- LLM(大语言模型):作为大脑,理解你的意图并规划操作流程
常见问题排查
-
Chrome无法启动:确保系统已安装Chrome浏览器,或者指定Chrome路径:
CHROME_PATH=/path/to/chrome server-chrome
-
连接失败:检查Dify和Chrome MCP服务器是否在同一个网络环境下,防火墙是否允许9999端口通信
-
操作超时:复杂网页加载需要时间,可以增加超时设置:
server-chrome --timeout=60000
-
权限问题:在MacOS/Linux上可能需要权限:
sudo npm install -g @modelcontextprotocol/server-chrome
进阶使用技巧
掌握了基础用法后,你还可以尝试这些高级功能:
- 多页面管理:同时控制多个浏览器标签页,完成更复杂的任务
- 用户身份保存:让AI记住登录状态,下次直接操作无需重新登录
- 定时任务:结合Dify的工作流功能,设置定时自动化任务
- 异常处理:教会AI识别操作失败的情况并自动尝试替代方案
总结:你现在拥有了什么?
通过这个3分钟搭建的系统,你获得了一个能够:
- ✅ 用自然语言指挥的网页自动化助手
- ✅ 自动完成重复性的网页操作任务
- ✅ 抓取和分析网页数据的智能代理
- ✅ 7×24小时待命的数字员工
无论是自动填表、数据监控、内容抓取还是网页测试,这个Dify+Chrome MCP组合都能帮你自动化完成。最重要的是,这一切都不需要你编写复杂的代码——只需要用自然语言告诉AI你想要做什么。
现在就开始你的网页自动化之旅吧!