1. 项目概述一个连接浏览器与AI的“智能副驾”最近在折腾AI应用开发特别是想让大语言模型LLM能像真人一样操作网页、获取实时信息而不是只能对着训练时“冻结”的知识库空谈。这让我找到了一个非常有意思的项目koaung8629/mcp-browser。简单来说它就是一个模型上下文协议Model Context Protocol, MCP的服务器实现专门为浏览器操作而生。你可以把它想象成一个给AI模型配的“浏览器遥控器”。通常像ChatGPT、Claude这类模型它们自身是无法直接打开网页、点击按钮或填写表单的。而MCP协议正是为解决这类“模型如何安全、可控地使用外部工具”的问题而生的一个开放标准。mcp-browser这个服务器就扮演了“工具提供者”的角色。它启动后会通过MCP协议向连接的AI客户端比如Claude Desktop、Cursor等暴露一系列“工具函数”例如“导航到某个网址”、“点击页面上的某个元素”、“获取页面文本内容”等等。这样一来当你在AI客户端里提出“帮我查一下今天北京的天气”时AI模型不再需要凭空编造而是可以调用mcp-browser提供的navigate工具让真正的浏览器打开天气网站然后再调用extract_text工具获取网页上的温度信息最后组织成一段准确的回答告诉你。这个项目的核心价值就是为AI模型赋予了实时、动态的网页交互能力极大地扩展了其应用场景从简单的问答升级为能执行具体网页任务的智能体。它非常适合两类人一是AI应用开发者想为自己的产品增加网页自动化能力二是效率追求者或研究者希望探索AI如何替代一些重复性的网页操作比如自动填写报表、监控商品价格、聚合多源信息等。接下来我会深入拆解它的设计思路、如何一步步搭建起来以及在实际使用中会遇到哪些“坑”和技巧。2. 核心架构与MCP协议解析要玩转mcp-browser首先得理解它赖以生存的土壤——MCP协议。这不是一个凭空造出来的轮子而是有着清晰设计哲学的技术规范。2.1 MCP协议AI的“工具调用”标准化接口你可以把MCP类比成电脑的USB协议。电脑AI模型需要通过USB接口MCP协议来连接和使用外部的键盘、鼠标、U盘各种工具服务器。在没有MCP之前每个AI平台如OpenAI的Function Calling、Anthropic的Tool Use都有自己定义工具调用的方式这导致开发者想做一个通用工具需要为每个平台适配一遍非常麻烦。MCP协议的核心目标就是标准化。它定义了一套简单的、基于JSON-RPC的通信规范。一个MCP服务器比如我们的mcp-browser启动后会向客户端宣告“我这里有这些工具可用tools/list”。客户端如Claude Desktop收到列表后当模型需要时就会发起一个工具调用请求tools/call服务器执行对应的操作如打开浏览器并将结果content返回给客户端最终呈现给用户。mcp-browser项目的巧妙之处在于它严格遵循了MCP协议使得它能够无缝接入任何支持MCP的客户端具备了天生的通用性。它的架构可以理解为三层协议层基于MCP的JSON-RPC通信处理连接、鉴权如果配置了、工具列表的注册与调用分发。控制层这是项目的核心逻辑。它接收来自协议的“点击元素”、“输入文本”等抽象指令并将其翻译成浏览器自动化框架如Playwright或Puppeteer能理解的具体命令。执行层利用Playwright这类无头浏览器框架真正地启动一个浏览器实例如Chromium加载页面并执行DOM操作、网络请求拦截等底层任务。这种分层设计使得项目非常清晰也便于扩展。如果你想增加一个新的工具比如“截取整个网页为PDF”你只需要在控制层添加对应的指令翻译逻辑并在协议层注册这个新工具即可。2.2 为什么选择Playwright作为底层驱动在浏览器自动化领域有几个知名的选择Selenium、Puppeteer和Playwright。mcp-browser选择了Playwright这是一个非常明智且现代的选择。这里简单对比一下特性SeleniumPuppeteerPlaywright主要支持跨浏览器Chrome, Firefox, Safari等主要Chrome/Chromium原生支持Chrome, Firefox, Safari, Edge执行速度较慢快快且并行处理能力强API设计较老有时冗长现代但仅限Chrome生态现代且统一不同浏览器API一致自动等待需要手动配置等待有但不如Playwright智能内置智能等待减少“元素未找到”错误移动端模拟支持但配置复杂支持支持且体验更好社区与维护非常成熟但创新慢由Google维护活跃由微软维护非常活跃迭代快从对比可以看出Playwright在跨浏览器支持、开发体验、稳定性和功能完整性上取得了很好的平衡。对于mcp-browser这样一个需要高度可靠性地执行复杂网页操作的服务器来说Playwright的“内置智能等待”特性至关重要。这意味着当AI模型发出“点击登录按钮”的指令时mcp-browser内部的Playwright驱动会自动等待该按钮在DOM中加载完成、变得可见且可点击然后再执行点击操作极大提高了指令执行的成功率减少了需要AI模型或上层逻辑去处理“等待”这种底层细节的负担。注意虽然项目可能也支持Puppeteer但从其依赖和代码倾向来看Playwright是首选和主要支持的引擎。在后续的安装和配置中我们也会围绕Playwright展开。3. 环境准备与项目部署实战理论清楚了我们动手把它跑起来。整个过程可以分为几个步骤环境准备、获取代码、安装依赖、配置客户端连接。3.1 基础环境搭建首先你需要一个可以运行Node.js的环境。mcp-browser是一个基于Node.js的服务器因此Node.js是必须的。安装Node.js建议安装最新的LTS长期支持版本比如Node.js 18.x或20.x。你可以从Node.js官网下载安装包或者使用版本管理工具如nvmmacOS/Linux或nvm-windows。安装后在终端运行node --version和npm --version确认安装成功。安装Git用于克隆项目代码。同样从Git官网下载安装即可。安装Python可选但推荐Playwright的安装可能需要Python环境。虽然Node.js版的Playwright会自带浏览器但系统有一个Python环境能避免一些潜在的构建问题。安装Python 3.7即可。3.2 获取与初始化项目打开终端执行以下命令克隆项目并进入目录git clone https://github.com/koaung8629/mcp-browser.git cd mcp-browser接下来安装依赖。项目根目录下应该有package.json文件。使用npm或yarn安装npm install # 或者如果你习惯用yarn # yarn install这个npm install会安装项目声明的所有依赖其中最重要的就是modelcontextprotocol/sdkMCP协议的Node.js SDK和playwright浏览器自动化框架。安装完成后关键的一步来了安装Playwright所需的浏览器内核。Playwright不会在npm install时自动下载浏览器需要单独运行命令npx playwright install这个命令会下载Chromium、Firefox和WebKitSafari内核的二进制文件到本地缓存。这个过程可能会花费几分钟取决于你的网络速度。请务必确保这一步成功完成否则后续启动服务器时会报错找不到浏览器。实操心得在某些网络环境下尤其是国内直接安装Playwright浏览器可能会非常慢甚至失败。这时可以尝试设置镜像源# 设置Playwright的下载镜像以淘宝镜像为例请确认其当前是否支持Playwright PLAYWRIGHT_DOWNLOAD_HOSThttps://npmmirror.com/mirrors/playwright npx playwright install如果镜像不行最稳妥的方式是使用科学的上网环境。另外npx playwright install chromium可以只安装Chromium加快速度因为大部分时候我们只用到它。3.3 配置AI客户端以Claude Desktop为例服务器准备好了我们还需要一个能连接它的AI客户端。这里以目前对MCP支持最友好的Claude Desktop为例。其他客户端如Cursor的配置原理类似。启动MCP服务器在mcp-browser项目目录下运行启动命令。通常查看项目的package.json中的scripts字段会有启动命令比如npm start # 或 node index.js服务器启动后默认会在某个本地端口例如3000监听并输出日志表明它已准备好接受MCP客户端的连接。配置Claude Desktop找到Claude Desktop的配置文件位置。不同系统不同macOS:~/Library/Application Support/Claude/claude_desktop_config.jsonWindows:%APPDATA%\Claude\claude_desktop_config.jsonLinux:~/.config/Claude/claude_desktop_config.json如果文件不存在就创建一个。在配置文件中添加MCP服务器的配置。一个典型的配置如下{ mcpServers: { browser: { command: node, args: [ /ABSOLUTE/PATH/TO/YOUR/mcp-browser/index.js ], env: { NODE_OPTIONS: --no-deprecation } } } }关键点browser是你给这个服务器起的名字可以自定义。command必须是node。args中的路径必须使用绝对路径指向你克隆的mcp-browser项目中的主入口文件通常是index.js或src/index.js。env部分是可选的--no-deprecation可以避免一些旧的Node.js API警告刷屏。重启与验证保存配置文件并完全重启Claude Desktop应用。重启后当你新建一个对话时如果配置正确Claude的输入框上方或系统提示里可能会显示已连接的工具。你可以直接问Claude“你现在可以使用哪些工具”或者“你能用浏览器帮我做点什么吗”它应该会列出mcp-browser提供的工具如navigate,click,extract_text等。常见问题1Claude Desktop没有发现工具检查路径配置文件中的路径一定是绝对路径且指向正确的文件。检查服务器日志启动Claude时它会在后台运行你配置的命令。查看系统控制台如macOS的控制台AppWindows的事件查看器或终端是否有Node.js的错误输出。更直接的方法是在终端手动运行node /path/to/mcp-browser/index.js看服务器能否独立启动。检查Claude版本确保你的Claude Desktop是最新版本旧版本可能不支持MCP。查看官方文档MCP和客户端的配置方式可能更新参考koaung8629/mcp-browser项目的README和Claude官方文档是最准确的。4. 核心工具详解与使用范例当你的mcp-browser服务器成功连接后AI客户端就能调用一系列工具了。这些工具是AI与浏览器交互的“词汇表”。理解每个工具的用途、参数和返回结果是有效使用它的关键。4.1 导航与内容获取工具这是最基础也是最常用的功能组。navigate(导航): 让浏览器打开一个指定的URL。参数:{ url: string }。url必须是完整的URL包含协议http://或https://。AI调用示例: “请导航到百度首页。”背后逻辑: 服务器收到指令后会通过Playwright创建一个新的浏览器页面或复用现有页面然后执行page.goto(url)。这里会用到Playwright的智能等待等待页面load事件触发。返回结果: 通常是一个简单的成功消息如“Navigated to https://www.baidu.com”。有时也会包含页面标题。extract_text(提取文本): 获取当前页面的主要文本内容。参数: 可能包含选择器selector用于指定提取页面的某个区域如果不提供则提取整个body的文本。AI调用示例: “提取当前页面中所有关于‘天气’的段落。” (这需要AI结合页面结构进行更复杂的指令分解或者工具本身支持CSS选择器参数)。背后逻辑: 执行page.textContent(selector)或类似方法获取指定DOM元素的文本内容并过滤掉过多的空白字符和脚本样式内容。返回结果: 纯文本字符串。这是AI模型进行总结、分析或回答问题的直接材料。screenshot(截图): 对当前页面或特定元素进行截图。参数: 可能包含selector元素选择器和fullPage是否截取完整长图等。AI调用示例: “给这个产品详情页的规格参数部分截个图。”背后逻辑: 调用Playwright的page.screenshot()或elementHandle.screenshot()方法。返回结果: 图片的二进制数据或Base64编码。AI客户端如Claude通常能以附件或内联图片的形式展示。4.2 页面交互工具让AI能够模拟人类在页面上的操作。click(点击): 点击页面上的某个元素。参数:{ selector: string }。selector是一个CSS选择器如#login-btn、.submit-button、text“登录”。Playwright支持非常强大的选择器包括文本选择器text。AI调用示例: “点击那个蓝色的‘提交’按钮。”背后逻辑: 这是最体现Playwright价值的地方。服务器会执行page.click(selector)。Playwright会自动执行一系列操作等待该选择器对应的元素出现、滚动到该元素可视区域、检查元素是否可点击未被禁用、未被遮挡然后才模拟鼠标点击事件。这大大简化了指令。返回结果: 点击成功或失败的消息。type(输入): 在输入框、文本框等元素中输入文本。参数:{ selector: string, text: string }。AI调用示例: “在用户名输入框里输入‘testuser’。”背后逻辑: 先通过page.click(selector)或page.focus(selector)聚焦到目标元素然后执行page.type(selector, text)或page.fill(selector, text)。fill会先清空内容再输入而type是模拟按键。mcp-browser的实现通常会选择更稳健的fill。返回结果: 输入完成的消息。scroll(滚动): 滚动页面。参数: 可能是{ direction: ‘down’ | ‘up’, pixels: number }或{ selector: string }滚动到某个元素。AI调用示例: “向下滚动两屏。” 或 “滚动到页面底部。”背后逻辑: 执行page.evaluate()注入JavaScript代码如window.scrollBy(0, pixels)或document.querySelector(selector).scrollIntoView()。返回结果: 滚动完成的消息。4.3 高级与组合工具一些更复杂或组合性的操作能完成多步骤任务。evaluate(执行脚本): 在浏览器页面上下文中执行一段JavaScript代码。这是最强大的工具几乎可以实现任何自定义操作。参数:{ script: string }。script是要执行的JS代码字符串。AI调用示例: “获取当前页面所有的链接地址。” (AI可能会生成类似Array.from(document.querySelectorAll(‘a’)).map(a a.href)的脚本)。背后逻辑: 直接调用Playwright的page.evaluate(script)。代码在浏览器环境中运行可以访问document,window等全局对象。返回结果: JavaScript代码的执行结果需可序列化为JSON。例如返回链接数组。注意事项: 这是高风险高收益的工具。需要确保AI生成的脚本是安全且符合预期的。服务器端可能会对脚本内容做基本的安全过滤。get_page_state(获取页面状态): 获取当前页面的元信息如URL、标题、可交互元素列表等。这有助于AI了解当前处于什么页面以及下一步可以操作什么。参数: 可能无参数或包含一个include参数指定需要的信息维度。背后逻辑: 通过evaluate工具执行一个复杂的脚本收集页面标题、URL、所有按钮/输入框/链接的标签和选择器等。返回结果: 一个结构化的JSON对象包含了页面的“快照”信息。这对于实现“自主导航”的AI智能体至关重要。组合使用范例假设我们想让AI帮我们登录一个网站。AI首先调用navigate({url: ‘https://example.com/login’})。然后调用get_page_state()了解页面上有哪些输入框和按钮。根据返回的信息AI决定调用type({selector: ‘#username’, text: ‘myuser’})和type({selector: ‘#password’, text: ‘mypass’})。最后调用click({selector: ‘#login-btn’})。登录后可以调用extract_text({selector: ‘.welcome-message’})来验证是否登录成功。这个过程完全由AI模型根据目标“登录”和实时获取的页面状态来规划和执行展现了mcp-browser作为AI“手和眼”的核心能力。5. 实战应用场景与进阶技巧理解了工具怎么用我们来看看它能做什么以及如何用得更好。5.1 典型应用场景实时信息查询与聚合这是最直接的应用。让AI直接操作浏览器搜索、打开新闻网站、查看股票行情或天气获取最新信息后为你总结。避免了AI因知识截止日期而提供过时信息的问题。自动化表单填写与提交对于需要定期重复填写的线上表格、申请系统可以编写提示词或结合简单的脚本让AI按步骤完成。例如每周的工时填报、简单的问卷填写等。网页内容监控与通知让AI定时需结合外部调度访问特定页面检查内容是否有更新如商品价格变动、新公告发布、预约名额释放并通过extract_text或evaluate工具提取关键信息再通过其他方式如邮件、消息通知你。辅助研究与学习让AI同时打开多个相关网页学术论文、技术文档、竞品网站提取关键内容进行对比分析帮你快速生成文献综述或竞品分析报告。测试与调试助手前端开发者可以口述一个用户操作流程如“在搜索框输入‘手机’点击搜索按钮然后筛选品牌为‘Apple’”让AI驱动浏览器自动执行辅助进行简单的冒烟测试或复现用户反馈的bug路径。5.2 提升稳定性的进阶配置默认配置可能不适合所有网站。以下是一些调整点可以让mcp-browser更稳定、更强大。用户代理User-Agent与视口Viewport有些网站会对无头浏览器或特定UA进行屏蔽。你可以在服务器启动时或创建页面时进行配置// 在项目代码中例如创建浏览器上下文时 const browserContext await browser.newContext({ userAgent: ‘Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 …’, // 一个常见的桌面浏览器UA viewport: { width: 1920, height: 1080 } });这能让你的浏览器实例看起来更像一个真实的用户。超时与等待策略网络状况和网站响应速度不一。适当调整超时时间可以避免长时间卡住。导航超时page.goto(url, { timeout: 60000 })// 设置为60秒元素等待超时page.click(selector, { timeout: 30000 })// 设置为30秒 这些配置可以在mcp-browser处理工具调用的代码中找到并修改。原则是对于你已知加载慢的网站调大超时对于需要快速响应的自动化任务调小超时以便快速失败重试。处理Cookie、登录态与本地存储很多操作需要保持登录状态。Playwright的browserContext可以持久化存储如Cookie、LocalStorage。// 启动时尝试从文件加载之前保存的登录状态 const browserContext await browser.newContext({ storageState: ‘./auth/storage_state.json’ }); // 在成功登录后保存状态 await browserContext.storageState({ path: ‘./auth/storage_state.json’ });你需要修改mcp-browser增加工具来主动保存和加载上下文状态或者将登录流程固化在初始化脚本中。这是一个高级但非常有用的功能。代理设置如果需要通过代理访问某些资源可以在启动浏览器时配置const browser await playwright.chromium.launch({ proxy: { server: ‘http://your-proxy-server:port’ // 可选的 username, password } });5.3 编写高效的提示词Prompt工具再好也需要AI模型理解你的意图并正确调用。与mcp-browser配合时提示词需要更具体、更具操作性。明确指令与上下文不要只说“查天气”。要说“请使用浏览器工具导航到中国天气网www.weather.com.cn的北京页面然后提取今天的最高和最低气温。”分步引导对于复杂任务可以引导AI分步思考。“第一步导航到购物网站首页。第二步在搜索框输入‘无线耳机’。第三步点击搜索按钮。第四步提取第一页所有商品的名字和价格。”提供选择器线索虽然AI能自己分析页面结构但如果你知道关键元素的选择器可以直接告诉它提高成功率。“点击那个ID为‘submitOrder’的按钮。”处理动态内容对于大量Ajax加载的页面指令后可以加上等待条件。“点击‘加载更多’按钮然后等待2秒钟让新内容加载出来再提取所有条目。”错误处理与重试在提示词中告诉AI如果某个操作失败比如元素没找到可以尝试其他选择器或刷新页面。“如果找不到‘登录’按钮试试看有没有‘Sign In’链接。”实操心得与mcp-browser协作的最佳实践是把它当作一个“能力受限但精确执行”的助手。AI负责高级规划、理解和决策mcp-browser负责低级的、确定性的操作。你的提示词就是连接两者的“工作说明书”写得越清晰合作效率越高。6. 常见问题排查与性能优化在实际使用中你肯定会遇到各种问题。这里整理了一些典型问题和解决思路。6.1 连接与启动问题问题现象可能原因排查步骤与解决方案Claude Desktop提示找不到工具或连接失败。1. 配置文件路径错误。2. Node.js或项目依赖未正确安装。3. 服务器启动脚本有误或端口冲突。1.检查路径确认args中的绝对路径无误且文件存在。2.手动启动测试在终端用node /path/to/index.js手动运行服务器看是否有报错如缺少模块。3.查看日志检查Claude Desktop的运行日志或系统控制台看是否有Node.js进程的错误输出。4.简化测试先写一个最简单的MCP服务器测试文件确认Claude能连接再排查mcp-browser项目本身的问题。启动服务器时报错提示找不到Playwright浏览器。Playwright浏览器未安装或安装不完整。1. 运行npx playwright install或npx playwright install chromium。2. 检查网络或按前述方法设置下载镜像。3. 检查node_modules目录下playwright-core是否存在。服务器启动后立即退出。代码中存在未捕获的异常或依赖的某个服务如浏览器无法启动。1. 在启动命令前加NODE_DEBUGmodule环境变量查看模块加载问题。2. 在代码入口添加try-catch或使用process.on(‘uncaughtException’, …)捕获全局错误并打印到控制台。3. 检查是否有其他进程占用了Playwright需要的端口或资源。6.2 页面操作执行失败问题现象可能原因排查步骤与解决方案click或type失败提示“Element not found”或“Timeout”。1. 页面尚未加载完成。2. 元素选择器不正确或元素在iframe内。3. 页面有弹窗、动态内容遮挡。1.增加等待在操作前让AI先调用一个等待工具如果项目提供了或让navigate操作等待到networkidle状态。2.优化选择器使用更稳定、唯一的属性如>extract_text返回内容为空或杂乱。1. 选择器定位到了不可见元素或脚本标签。2. 页面内容是JavaScript动态渲染的初始HTML中不存在。1.检查选择器确保选择器指向包含文本的实际可见元素如div,p,span。2.等待动态加载在提取前让AI执行一个简单的等待如page.waitForSelector(‘.loaded-indicator’)或滚动操作触发内容加载。3.使用evaluate自定义提取对于复杂页面直接让AI生成JS脚本来精确提取目标文本比通用extract_text更有效。操作速度很慢。1. 网络延迟。2. 默认超时设置过长失败前等待太久。3. 页面本身资源多加载慢。1.调整超时适当减少非关键操作的超时时间如从30秒减到10秒让失败更快暴露。2.禁用非必要资源在浏览器上下文中设置路由browserContext.route拦截并中止图片、样式表、字体等资源的加载可以极大加快页面加载速度适用于只关心文本和结构的场景。3.并行化考虑对于独立任务可以考虑启动多个浏览器页面并行处理但这需要修改服务器架构。6.3 安全与资源管理安全边界mcp-browser本质上赋予了AI在你的本地环境中操作浏览器的能力。这意味着AI可以访问你浏览器能访问的任何网站包括内网并能进行点击、输入等操作。切勿将此类服务器暴露在公网或不信任的环境中。确保只在可信的本地AI客户端上使用。资源泄漏每个浏览器实例和页面都会消耗内存和CPU。如果AI频繁地创建新页面而不关闭会导致内存占用越来越高。需要在服务器代码中实现良好的资源生命周期管理例如在一段时间不活动后自动关闭页面或者限制最大并发页面数。会话隔离考虑为不同的对话或用户创建独立的浏览器上下文browserContext以实现Cookie、本地存储的隔离避免操作互相干扰。性能优化小技巧复用浏览器实例确保服务器在整个生命周期内只启动一个浏览器实例通过创建新的上下文和页面来处理不同请求这比反复启动退出浏览器快得多。懒加载页面不要提前创建大量空白页面。当收到navigate请求时再从页面池中取用或新建一个页面。监控与日志为服务器的工具调用添加详细的日志记录URL、选择器、执行时间等。这不仅是排查问题的依据也能帮你分析性能瓶颈在哪里。7. 扩展思路与未来展望koaung8629/mcp-browser项目提供了一个坚实的起点。基于此我们可以进行很多有趣的扩展让它变得更强大、更智能。工具扩展文件上传增加upload_file工具允许AI通过选择文件路径来模拟网页中的文件上传操作。鼠标拖拽增加drag_and_drop工具用于处理更复杂的交互。地理位置模拟增加工具来修改浏览器的地理位置信息用于测试基于位置的服务。网络请求拦截与Mock增加工具允许AI动态修改或Mock页面的网络请求和响应用于测试或屏蔽广告。状态管理与多页面协作让服务器能够管理多个标签页并提供switch_tab、new_tab、close_tab等工具使AI能在多个页面间协同工作。实现更强大的get_page_state不仅返回元素列表还能通过视觉模型或更复杂的DOM分析生成页面的语义化描述如“这是一个包含商品列表、搜索框和购物车的电商页面”帮助AI更好地理解当前场景。与工作流自动化平台集成将mcp-browser服务器封装成一个可被n8n、Zapier、Make等自动化平台调用的节点。这样你可以用图形化界面来设计“AI浏览器”的自动化流程而不仅仅局限于对话式的AI客户端。自主智能体Agent的“眼睛和手”这是最激动人心的方向。mcp-browser可以作为更高级别自主智能体的底层执行器。智能体根据目标如“订购一本畅销书”自主规划步骤搜索、比价、加入购物车、结算并调用mcp-browser的工具来执行。这需要智能体具备强大的规划、记忆和从错误中学习的能力。这个项目的魅力在于它用相对简单的代码打开了一扇大门让大语言模型从“思想家”变成了能动手的“实干家”。虽然目前还有很多稳定性、安全性上的挑战但它清晰地指向了一个未来AI将能更自然、更直接地与数字世界交互成为我们工作中无处不在的智能副驾。从今天开始用它来帮你自动查资料、填表格、监控信息你会发现很多重复性的网页操作真的可以交给AI了。
基于MCP协议与Playwright的AI浏览器自动化实战指南
发布时间：2026/5/16 3:01:37
1. 项目概述一个连接浏览器与AI的“智能副驾”最近在折腾AI应用开发特别是想让大语言模型LLM能像真人一样操作网页、获取实时信息而不是只能对着训练时“冻结”的知识库空谈。这让我找到了一个非常有意思的项目koaung8629/mcp-browser。简单来说它就是一个模型上下文协议Model Context Protocol, MCP的服务器实现专门为浏览器操作而生。你可以把它想象成一个给AI模型配的“浏览器遥控器”。通常像ChatGPT、Claude这类模型它们自身是无法直接打开网页、点击按钮或填写表单的。而MCP协议正是为解决这类“模型如何安全、可控地使用外部工具”的问题而生的一个开放标准。mcp-browser这个服务器就扮演了“工具提供者”的角色。它启动后会通过MCP协议向连接的AI客户端比如Claude Desktop、Cursor等暴露一系列“工具函数”例如“导航到某个网址”、“点击页面上的某个元素”、“获取页面文本内容”等等。这样一来当你在AI客户端里提出“帮我查一下今天北京的天气”时AI模型不再需要凭空编造而是可以调用mcp-browser提供的navigate工具让真正的浏览器打开天气网站然后再调用extract_text工具获取网页上的温度信息最后组织成一段准确的回答告诉你。这个项目的核心价值就是为AI模型赋予了实时、动态的网页交互能力极大地扩展了其应用场景从简单的问答升级为能执行具体网页任务的智能体。它非常适合两类人一是AI应用开发者想为自己的产品增加网页自动化能力二是效率追求者或研究者希望探索AI如何替代一些重复性的网页操作比如自动填写报表、监控商品价格、聚合多源信息等。接下来我会深入拆解它的设计思路、如何一步步搭建起来以及在实际使用中会遇到哪些“坑”和技巧。2. 核心架构与MCP协议解析要玩转mcp-browser首先得理解它赖以生存的土壤——MCP协议。这不是一个凭空造出来的轮子而是有着清晰设计哲学的技术规范。2.1 MCP协议AI的“工具调用”标准化接口你可以把MCP类比成电脑的USB协议。电脑AI模型需要通过USB接口MCP协议来连接和使用外部的键盘、鼠标、U盘各种工具服务器。在没有MCP之前每个AI平台如OpenAI的Function Calling、Anthropic的Tool Use都有自己定义工具调用的方式这导致开发者想做一个通用工具需要为每个平台适配一遍非常麻烦。MCP协议的核心目标就是标准化。它定义了一套简单的、基于JSON-RPC的通信规范。一个MCP服务器比如我们的mcp-browser启动后会向客户端宣告“我这里有这些工具可用tools/list”。客户端如Claude Desktop收到列表后当模型需要时就会发起一个工具调用请求tools/call服务器执行对应的操作如打开浏览器并将结果content返回给客户端最终呈现给用户。mcp-browser项目的巧妙之处在于它严格遵循了MCP协议使得它能够无缝接入任何支持MCP的客户端具备了天生的通用性。它的架构可以理解为三层协议层基于MCP的JSON-RPC通信处理连接、鉴权如果配置了、工具列表的注册与调用分发。控制层这是项目的核心逻辑。它接收来自协议的“点击元素”、“输入文本”等抽象指令并将其翻译成浏览器自动化框架如Playwright或Puppeteer能理解的具体命令。执行层利用Playwright这类无头浏览器框架真正地启动一个浏览器实例如Chromium加载页面并执行DOM操作、网络请求拦截等底层任务。这种分层设计使得项目非常清晰也便于扩展。如果你想增加一个新的工具比如“截取整个网页为PDF”你只需要在控制层添加对应的指令翻译逻辑并在协议层注册这个新工具即可。2.2 为什么选择Playwright作为底层驱动在浏览器自动化领域有几个知名的选择Selenium、Puppeteer和Playwright。mcp-browser选择了Playwright这是一个非常明智且现代的选择。这里简单对比一下特性SeleniumPuppeteerPlaywright主要支持跨浏览器Chrome, Firefox, Safari等主要Chrome/Chromium原生支持Chrome, Firefox, Safari, Edge执行速度较慢快快且并行处理能力强API设计较老有时冗长现代但仅限Chrome生态现代且统一不同浏览器API一致自动等待需要手动配置等待有但不如Playwright智能内置智能等待减少“元素未找到”错误移动端模拟支持但配置复杂支持支持且体验更好社区与维护非常成熟但创新慢由Google维护活跃由微软维护非常活跃迭代快从对比可以看出Playwright在跨浏览器支持、开发体验、稳定性和功能完整性上取得了很好的平衡。对于mcp-browser这样一个需要高度可靠性地执行复杂网页操作的服务器来说Playwright的“内置智能等待”特性至关重要。这意味着当AI模型发出“点击登录按钮”的指令时mcp-browser内部的Playwright驱动会自动等待该按钮在DOM中加载完成、变得可见且可点击然后再执行点击操作极大提高了指令执行的成功率减少了需要AI模型或上层逻辑去处理“等待”这种底层细节的负担。注意虽然项目可能也支持Puppeteer但从其依赖和代码倾向来看Playwright是首选和主要支持的引擎。在后续的安装和配置中我们也会围绕Playwright展开。3. 环境准备与项目部署实战理论清楚了我们动手把它跑起来。整个过程可以分为几个步骤环境准备、获取代码、安装依赖、配置客户端连接。3.1 基础环境搭建首先你需要一个可以运行Node.js的环境。mcp-browser是一个基于Node.js的服务器因此Node.js是必须的。安装Node.js建议安装最新的LTS长期支持版本比如Node.js 18.x或20.x。你可以从Node.js官网下载安装包或者使用版本管理工具如nvmmacOS/Linux或nvm-windows。安装后在终端运行node --version和npm --version确认安装成功。安装Git用于克隆项目代码。同样从Git官网下载安装即可。安装Python可选但推荐Playwright的安装可能需要Python环境。虽然Node.js版的Playwright会自带浏览器但系统有一个Python环境能避免一些潜在的构建问题。安装Python 3.7即可。3.2 获取与初始化项目打开终端执行以下命令克隆项目并进入目录git clone https://github.com/koaung8629/mcp-browser.git cd mcp-browser接下来安装依赖。项目根目录下应该有package.json文件。使用npm或yarn安装npm install # 或者如果你习惯用yarn # yarn install这个npm install会安装项目声明的所有依赖其中最重要的就是modelcontextprotocol/sdkMCP协议的Node.js SDK和playwright浏览器自动化框架。安装完成后关键的一步来了安装Playwright所需的浏览器内核。Playwright不会在npm install时自动下载浏览器需要单独运行命令npx playwright install这个命令会下载Chromium、Firefox和WebKitSafari内核的二进制文件到本地缓存。这个过程可能会花费几分钟取决于你的网络速度。请务必确保这一步成功完成否则后续启动服务器时会报错找不到浏览器。实操心得在某些网络环境下尤其是国内直接安装Playwright浏览器可能会非常慢甚至失败。这时可以尝试设置镜像源# 设置Playwright的下载镜像以淘宝镜像为例请确认其当前是否支持Playwright PLAYWRIGHT_DOWNLOAD_HOSThttps://npmmirror.com/mirrors/playwright npx playwright install如果镜像不行最稳妥的方式是使用科学的上网环境。另外npx playwright install chromium可以只安装Chromium加快速度因为大部分时候我们只用到它。3.3 配置AI客户端以Claude Desktop为例服务器准备好了我们还需要一个能连接它的AI客户端。这里以目前对MCP支持最友好的Claude Desktop为例。其他客户端如Cursor的配置原理类似。启动MCP服务器在mcp-browser项目目录下运行启动命令。通常查看项目的package.json中的scripts字段会有启动命令比如npm start # 或 node index.js服务器启动后默认会在某个本地端口例如3000监听并输出日志表明它已准备好接受MCP客户端的连接。配置Claude Desktop找到Claude Desktop的配置文件位置。不同系统不同macOS:~/Library/Application Support/Claude/claude_desktop_config.jsonWindows:%APPDATA%\Claude\claude_desktop_config.jsonLinux:~/.config/Claude/claude_desktop_config.json如果文件不存在就创建一个。在配置文件中添加MCP服务器的配置。一个典型的配置如下{ mcpServers: { browser: { command: node, args: [ /ABSOLUTE/PATH/TO/YOUR/mcp-browser/index.js ], env: { NODE_OPTIONS: --no-deprecation } } } }关键点browser是你给这个服务器起的名字可以自定义。command必须是node。args中的路径必须使用绝对路径指向你克隆的mcp-browser项目中的主入口文件通常是index.js或src/index.js。env部分是可选的--no-deprecation可以避免一些旧的Node.js API警告刷屏。重启与验证保存配置文件并完全重启Claude Desktop应用。重启后当你新建一个对话时如果配置正确Claude的输入框上方或系统提示里可能会显示已连接的工具。你可以直接问Claude“你现在可以使用哪些工具”或者“你能用浏览器帮我做点什么吗”它应该会列出mcp-browser提供的工具如navigate,click,extract_text等。常见问题1Claude Desktop没有发现工具检查路径配置文件中的路径一定是绝对路径且指向正确的文件。检查服务器日志启动Claude时它会在后台运行你配置的命令。查看系统控制台如macOS的控制台AppWindows的事件查看器或终端是否有Node.js的错误输出。更直接的方法是在终端手动运行node /path/to/mcp-browser/index.js看服务器能否独立启动。检查Claude版本确保你的Claude Desktop是最新版本旧版本可能不支持MCP。查看官方文档MCP和客户端的配置方式可能更新参考koaung8629/mcp-browser项目的README和Claude官方文档是最准确的。4. 核心工具详解与使用范例当你的mcp-browser服务器成功连接后AI客户端就能调用一系列工具了。这些工具是AI与浏览器交互的“词汇表”。理解每个工具的用途、参数和返回结果是有效使用它的关键。4.1 导航与内容获取工具这是最基础也是最常用的功能组。navigate(导航): 让浏览器打开一个指定的URL。参数:{ url: string }。url必须是完整的URL包含协议http://或https://。AI调用示例: “请导航到百度首页。”背后逻辑: 服务器收到指令后会通过Playwright创建一个新的浏览器页面或复用现有页面然后执行page.goto(url)。这里会用到Playwright的智能等待等待页面load事件触发。返回结果: 通常是一个简单的成功消息如“Navigated to https://www.baidu.com”。有时也会包含页面标题。extract_text(提取文本): 获取当前页面的主要文本内容。参数: 可能包含选择器selector用于指定提取页面的某个区域如果不提供则提取整个body的文本。AI调用示例: “提取当前页面中所有关于‘天气’的段落。” (这需要AI结合页面结构进行更复杂的指令分解或者工具本身支持CSS选择器参数)。背后逻辑: 执行page.textContent(selector)或类似方法获取指定DOM元素的文本内容并过滤掉过多的空白字符和脚本样式内容。返回结果: 纯文本字符串。这是AI模型进行总结、分析或回答问题的直接材料。screenshot(截图): 对当前页面或特定元素进行截图。参数: 可能包含selector元素选择器和fullPage是否截取完整长图等。AI调用示例: “给这个产品详情页的规格参数部分截个图。”背后逻辑: 调用Playwright的page.screenshot()或elementHandle.screenshot()方法。返回结果: 图片的二进制数据或Base64编码。AI客户端如Claude通常能以附件或内联图片的形式展示。4.2 页面交互工具让AI能够模拟人类在页面上的操作。click(点击): 点击页面上的某个元素。参数:{ selector: string }。selector是一个CSS选择器如#login-btn、.submit-button、text“登录”。Playwright支持非常强大的选择器包括文本选择器text。AI调用示例: “点击那个蓝色的‘提交’按钮。”背后逻辑: 这是最体现Playwright价值的地方。服务器会执行page.click(selector)。Playwright会自动执行一系列操作等待该选择器对应的元素出现、滚动到该元素可视区域、检查元素是否可点击未被禁用、未被遮挡然后才模拟鼠标点击事件。这大大简化了指令。返回结果: 点击成功或失败的消息。type(输入): 在输入框、文本框等元素中输入文本。参数:{ selector: string, text: string }。AI调用示例: “在用户名输入框里输入‘testuser’。”背后逻辑: 先通过page.click(selector)或page.focus(selector)聚焦到目标元素然后执行page.type(selector, text)或page.fill(selector, text)。fill会先清空内容再输入而type是模拟按键。mcp-browser的实现通常会选择更稳健的fill。返回结果: 输入完成的消息。scroll(滚动): 滚动页面。参数: 可能是{ direction: ‘down’ | ‘up’, pixels: number }或{ selector: string }滚动到某个元素。AI调用示例: “向下滚动两屏。” 或 “滚动到页面底部。”背后逻辑: 执行page.evaluate()注入JavaScript代码如window.scrollBy(0, pixels)或document.querySelector(selector).scrollIntoView()。返回结果: 滚动完成的消息。4.3 高级与组合工具一些更复杂或组合性的操作能完成多步骤任务。evaluate(执行脚本): 在浏览器页面上下文中执行一段JavaScript代码。这是最强大的工具几乎可以实现任何自定义操作。参数:{ script: string }。script是要执行的JS代码字符串。AI调用示例: “获取当前页面所有的链接地址。” (AI可能会生成类似Array.from(document.querySelectorAll(‘a’)).map(a a.href)的脚本)。背后逻辑: 直接调用Playwright的page.evaluate(script)。代码在浏览器环境中运行可以访问document,window等全局对象。返回结果: JavaScript代码的执行结果需可序列化为JSON。例如返回链接数组。注意事项: 这是高风险高收益的工具。需要确保AI生成的脚本是安全且符合预期的。服务器端可能会对脚本内容做基本的安全过滤。get_page_state(获取页面状态): 获取当前页面的元信息如URL、标题、可交互元素列表等。这有助于AI了解当前处于什么页面以及下一步可以操作什么。参数: 可能无参数或包含一个include参数指定需要的信息维度。背后逻辑: 通过evaluate工具执行一个复杂的脚本收集页面标题、URL、所有按钮/输入框/链接的标签和选择器等。返回结果: 一个结构化的JSON对象包含了页面的“快照”信息。这对于实现“自主导航”的AI智能体至关重要。组合使用范例假设我们想让AI帮我们登录一个网站。AI首先调用navigate({url: ‘https://example.com/login’})。然后调用get_page_state()了解页面上有哪些输入框和按钮。根据返回的信息AI决定调用type({selector: ‘#username’, text: ‘myuser’})和type({selector: ‘#password’, text: ‘mypass’})。最后调用click({selector: ‘#login-btn’})。登录后可以调用extract_text({selector: ‘.welcome-message’})来验证是否登录成功。这个过程完全由AI模型根据目标“登录”和实时获取的页面状态来规划和执行展现了mcp-browser作为AI“手和眼”的核心能力。5. 实战应用场景与进阶技巧理解了工具怎么用我们来看看它能做什么以及如何用得更好。5.1 典型应用场景实时信息查询与聚合这是最直接的应用。让AI直接操作浏览器搜索、打开新闻网站、查看股票行情或天气获取最新信息后为你总结。避免了AI因知识截止日期而提供过时信息的问题。自动化表单填写与提交对于需要定期重复填写的线上表格、申请系统可以编写提示词或结合简单的脚本让AI按步骤完成。例如每周的工时填报、简单的问卷填写等。网页内容监控与通知让AI定时需结合外部调度访问特定页面检查内容是否有更新如商品价格变动、新公告发布、预约名额释放并通过extract_text或evaluate工具提取关键信息再通过其他方式如邮件、消息通知你。辅助研究与学习让AI同时打开多个相关网页学术论文、技术文档、竞品网站提取关键内容进行对比分析帮你快速生成文献综述或竞品分析报告。测试与调试助手前端开发者可以口述一个用户操作流程如“在搜索框输入‘手机’点击搜索按钮然后筛选品牌为‘Apple’”让AI驱动浏览器自动执行辅助进行简单的冒烟测试或复现用户反馈的bug路径。5.2 提升稳定性的进阶配置默认配置可能不适合所有网站。以下是一些调整点可以让mcp-browser更稳定、更强大。用户代理User-Agent与视口Viewport有些网站会对无头浏览器或特定UA进行屏蔽。你可以在服务器启动时或创建页面时进行配置// 在项目代码中例如创建浏览器上下文时 const browserContext await browser.newContext({ userAgent: ‘Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 …’, // 一个常见的桌面浏览器UA viewport: { width: 1920, height: 1080 } });这能让你的浏览器实例看起来更像一个真实的用户。超时与等待策略网络状况和网站响应速度不一。适当调整超时时间可以避免长时间卡住。导航超时page.goto(url, { timeout: 60000 })// 设置为60秒元素等待超时page.click(selector, { timeout: 30000 })// 设置为30秒 这些配置可以在mcp-browser处理工具调用的代码中找到并修改。原则是对于你已知加载慢的网站调大超时对于需要快速响应的自动化任务调小超时以便快速失败重试。处理Cookie、登录态与本地存储很多操作需要保持登录状态。Playwright的browserContext可以持久化存储如Cookie、LocalStorage。// 启动时尝试从文件加载之前保存的登录状态 const browserContext await browser.newContext({ storageState: ‘./auth/storage_state.json’ }); // 在成功登录后保存状态 await browserContext.storageState({ path: ‘./auth/storage_state.json’ });你需要修改mcp-browser增加工具来主动保存和加载上下文状态或者将登录流程固化在初始化脚本中。这是一个高级但非常有用的功能。代理设置如果需要通过代理访问某些资源可以在启动浏览器时配置const browser await playwright.chromium.launch({ proxy: { server: ‘http://your-proxy-server:port’ // 可选的 username, password } });5.3 编写高效的提示词Prompt工具再好也需要AI模型理解你的意图并正确调用。与mcp-browser配合时提示词需要更具体、更具操作性。明确指令与上下文不要只说“查天气”。要说“请使用浏览器工具导航到中国天气网www.weather.com.cn的北京页面然后提取今天的最高和最低气温。”分步引导对于复杂任务可以引导AI分步思考。“第一步导航到购物网站首页。第二步在搜索框输入‘无线耳机’。第三步点击搜索按钮。第四步提取第一页所有商品的名字和价格。”提供选择器线索虽然AI能自己分析页面结构但如果你知道关键元素的选择器可以直接告诉它提高成功率。“点击那个ID为‘submitOrder’的按钮。”处理动态内容对于大量Ajax加载的页面指令后可以加上等待条件。“点击‘加载更多’按钮然后等待2秒钟让新内容加载出来再提取所有条目。”错误处理与重试在提示词中告诉AI如果某个操作失败比如元素没找到可以尝试其他选择器或刷新页面。“如果找不到‘登录’按钮试试看有没有‘Sign In’链接。”实操心得与mcp-browser协作的最佳实践是把它当作一个“能力受限但精确执行”的助手。AI负责高级规划、理解和决策mcp-browser负责低级的、确定性的操作。你的提示词就是连接两者的“工作说明书”写得越清晰合作效率越高。6. 常见问题排查与性能优化在实际使用中你肯定会遇到各种问题。这里整理了一些典型问题和解决思路。6.1 连接与启动问题问题现象可能原因排查步骤与解决方案Claude Desktop提示找不到工具或连接失败。1. 配置文件路径错误。2. Node.js或项目依赖未正确安装。3. 服务器启动脚本有误或端口冲突。1.检查路径确认args中的绝对路径无误且文件存在。2.手动启动测试在终端用node /path/to/index.js手动运行服务器看是否有报错如缺少模块。3.查看日志检查Claude Desktop的运行日志或系统控制台看是否有Node.js进程的错误输出。4.简化测试先写一个最简单的MCP服务器测试文件确认Claude能连接再排查mcp-browser项目本身的问题。启动服务器时报错提示找不到Playwright浏览器。Playwright浏览器未安装或安装不完整。1. 运行npx playwright install或npx playwright install chromium。2. 检查网络或按前述方法设置下载镜像。3. 检查node_modules目录下playwright-core是否存在。服务器启动后立即退出。代码中存在未捕获的异常或依赖的某个服务如浏览器无法启动。1. 在启动命令前加NODE_DEBUGmodule环境变量查看模块加载问题。2. 在代码入口添加try-catch或使用process.on(‘uncaughtException’, …)捕获全局错误并打印到控制台。3. 检查是否有其他进程占用了Playwright需要的端口或资源。6.2 页面操作执行失败问题现象可能原因排查步骤与解决方案click或type失败提示“Element not found”或“Timeout”。1. 页面尚未加载完成。2. 元素选择器不正确或元素在iframe内。3. 页面有弹窗、动态内容遮挡。1.增加等待在操作前让AI先调用一个等待工具如果项目提供了或让navigate操作等待到networkidle状态。2.优化选择器使用更稳定、唯一的属性如>extract_text返回内容为空或杂乱。1. 选择器定位到了不可见元素或脚本标签。2. 页面内容是JavaScript动态渲染的初始HTML中不存在。1.检查选择器确保选择器指向包含文本的实际可见元素如div,p,span。2.等待动态加载在提取前让AI执行一个简单的等待如page.waitForSelector(‘.loaded-indicator’)或滚动操作触发内容加载。3.使用evaluate自定义提取对于复杂页面直接让AI生成JS脚本来精确提取目标文本比通用extract_text更有效。操作速度很慢。1. 网络延迟。2. 默认超时设置过长失败前等待太久。3. 页面本身资源多加载慢。1.调整超时适当减少非关键操作的超时时间如从30秒减到10秒让失败更快暴露。2.禁用非必要资源在浏览器上下文中设置路由browserContext.route拦截并中止图片、样式表、字体等资源的加载可以极大加快页面加载速度适用于只关心文本和结构的场景。3.并行化考虑对于独立任务可以考虑启动多个浏览器页面并行处理但这需要修改服务器架构。6.3 安全与资源管理安全边界mcp-browser本质上赋予了AI在你的本地环境中操作浏览器的能力。这意味着AI可以访问你浏览器能访问的任何网站包括内网并能进行点击、输入等操作。切勿将此类服务器暴露在公网或不信任的环境中。确保只在可信的本地AI客户端上使用。资源泄漏每个浏览器实例和页面都会消耗内存和CPU。如果AI频繁地创建新页面而不关闭会导致内存占用越来越高。需要在服务器代码中实现良好的资源生命周期管理例如在一段时间不活动后自动关闭页面或者限制最大并发页面数。会话隔离考虑为不同的对话或用户创建独立的浏览器上下文browserContext以实现Cookie、本地存储的隔离避免操作互相干扰。性能优化小技巧复用浏览器实例确保服务器在整个生命周期内只启动一个浏览器实例通过创建新的上下文和页面来处理不同请求这比反复启动退出浏览器快得多。懒加载页面不要提前创建大量空白页面。当收到navigate请求时再从页面池中取用或新建一个页面。监控与日志为服务器的工具调用添加详细的日志记录URL、选择器、执行时间等。这不仅是排查问题的依据也能帮你分析性能瓶颈在哪里。7. 扩展思路与未来展望koaung8629/mcp-browser项目提供了一个坚实的起点。基于此我们可以进行很多有趣的扩展让它变得更强大、更智能。工具扩展文件上传增加upload_file工具允许AI通过选择文件路径来模拟网页中的文件上传操作。鼠标拖拽增加drag_and_drop工具用于处理更复杂的交互。地理位置模拟增加工具来修改浏览器的地理位置信息用于测试基于位置的服务。网络请求拦截与Mock增加工具允许AI动态修改或Mock页面的网络请求和响应用于测试或屏蔽广告。状态管理与多页面协作让服务器能够管理多个标签页并提供switch_tab、new_tab、close_tab等工具使AI能在多个页面间协同工作。实现更强大的get_page_state不仅返回元素列表还能通过视觉模型或更复杂的DOM分析生成页面的语义化描述如“这是一个包含商品列表、搜索框和购物车的电商页面”帮助AI更好地理解当前场景。与工作流自动化平台集成将mcp-browser服务器封装成一个可被n8n、Zapier、Make等自动化平台调用的节点。这样你可以用图形化界面来设计“AI浏览器”的自动化流程而不仅仅局限于对话式的AI客户端。自主智能体Agent的“眼睛和手”这是最激动人心的方向。mcp-browser可以作为更高级别自主智能体的底层执行器。智能体根据目标如“订购一本畅销书”自主规划步骤搜索、比价、加入购物车、结算并调用mcp-browser的工具来执行。这需要智能体具备强大的规划、记忆和从错误中学习的能力。这个项目的魅力在于它用相对简单的代码打开了一扇大门让大语言模型从“思想家”变成了能动手的“实干家”。虽然目前还有很多稳定性、安全性上的挑战但它清晰地指向了一个未来AI将能更自然、更直接地与数字世界交互成为我们工作中无处不在的智能副驾。从今天开始用它来帮你自动查资料、填表格、监控信息你会发现很多重复性的网页操作真的可以交给AI了。
