《用LangChain实现Manus》:Browser Use 到底能不能用?

0 评论 762 浏览 1 收藏 14 分钟

LangChain 1.0 加持下,Browser Use 作为 Agent 核心工具,能否真正实现 AI 像人类一样自动浏览网页、完成交互?这篇实测干货带你一探究竟!

前些日子,我们简单介绍了下LangChain框架:《LangChain、 Dify、 n8n、 Coze:四大AI框架怎么选?》

而后LangChain1.0 发布,其拥有了更多的功能,会适应于近期大家都想要的功能,比如:快速构建和交付Agent,那个经典的模型→工具→响应模式。

作为技术团队最常用的AI框架,我们之前其实也是浅尝则止,我们的程序员明显更喜欢自己撸代码,只不过这不是不学习、不深入的理由!

所以,接下来我们会写一个关于LangChain框架的系列文章,希望通过该系列文章让大家对LangChain乃至Agent的简单实现有个概括的认知,所以今天的关键词就是Browser Use。

01 Browser Use

依旧是这张经典架构图:

规划能力来自于模型本身、记忆板块模型会解决一部分,但更多的是由知识库(提示词工程、上下文工程解决),所以这一轮类Manus能爆发的核心在于工具层面,这些年互联网各种能力的集合:

比如,之前典型的工具需求对电脑的操作。目标是让AI像人类一样操作电脑:看屏幕、动光标、点按钮、打字,再这个基础上再扩展功能,比如帮订机票、填表格、查天气。

除了Computer Use,另一个非常典型的需求就是浏览器操作Browser Use了,甚至其实现ROI可能比Computer Use更高:

这款浏览器的自动化工具,是去年发布的,因为该功能的重要程度,以后应该也会有更多这类插件出现,毕竟让 AI 像人类一样浏览网页、点击链接、提取信息本身就有很大的意义。

学过前端的同学会比较清楚,对浏览器的操作方式有两种,第一种是模拟点击,记录x、y左边,在实现点击等操作即可;第二种是直接对其网页代码进行操作。这两种方式Browser Use都用了。

并且,当前对外宣传其效果还很好,那么其真实效果到底如何?我们今天就来测试测试。

今天使用的案例是通过 Browser Use 驱动浏览器完成页面操作、登录、元素交互,由 LangChain 负责语义对话生成,最终构建一个能够自动登录、实时监听消息、自动生成回复并直接在网页端发送的多轮自动会话系统。

02 Browser Use 实测

系统的架构可以分为两个主要模块:

LangChain 对话管理模块:负责处理对话逻辑和上下文管理:

  1. 使用 Qwen-Plus 模型生成回复
  2. 通过 ChatMessageHistory 管理对话历史
  3. 使用 ChatPromptTemplate 设置提示词模板
  4. 构建 Conversation Chain 来维持对话流程

Browser Use 浏览器自动化模块:负责与网页端进行实际交互

  1. Browser 实例控制实际的浏览器操作
  2. Browser Use Agent 执行具体的任务指令
  3. 使用大模型处理浏览器操作任务

整个工作流程如下:

1.系统启动时初始化两个模块

2.通过 Browser Use 模块在网页上发送初始消息

3.进入自动聊天循环:

  • 等待并提取网页端AI助手的回复
  • 使用 LangChain 模块生成回应
  • 通过 Browser Use 模块发送回复

4.循环执行指定轮次后结束,并保持浏览器打开一段时间供查看

接下来是具体实现:

具体实现(可略过看结论)

首先初始化 LangChain,对话模型使用 Qwen-Plus,并创建对话记忆与提示词模板。

这里我们让模型保持「CTO角色人设」,并限制回复风格始终为一句话,保证多轮对话的一致性与人格连续性:

然后,Browser Use 部分使用 GPT-4o 模型,并启动真实浏览器实例(可见窗口 mode)。其作用是负责所有真实网页层面的点击、输入、识别和元素交互:

然后,系统以「自然语言任务描述」的方式,将任务直接交给 Browser LLM。Browser Use 会自动解析指令:打开目标网页、登录、创建新会话、输入第一条消息并发送。

这一步完成对整个对话 session 的初始铺设:

系统每隔 30 秒执行一次 Browser Use 的任务,检查网页是否产生新的回复,并自动从聊天界面中抓取 AI 助手的最新回应,提取完成后将回复内容返回给程序处理:

再然后LangChain登场,把 AI 助手刚刚回复的内容、结合过往对话历史,一起交给 LangChain 再生成。这样可以保持角色一致性,并且形成连续的多轮语义闭环:

将 LangChain 生成出来的回复文本,再次以自然语言任务下发给 Browser Agent,由浏览器自己完成实际输入与发送行为,系统无需写任何 XPath/定位代码:

整个对话流程会循环执行:

  1. 每轮先从网页等待回复
  2. 再调用 LangChain 生成新内容
  3. 再交由 Browser Use 发送出去

至此整体流程结束,具体效果大家可以在上面视频查看。接下来就是一些具体的问题了:

03 一些问题

这里不同的人、不同的环境碰到的问题不一样,我们这里就有撒说撒了…

CDP / 浏览器连接不稳定

对于经常使用魔法的同学来说,优先检查本地代理、VPN,很多时候是代理阻断了 CDP 通信…

另外注意 Chrome / Chromium 版本与 Browser Use 的兼容性一定要一致。

ChatBrowserUse 模型不稳定

Browser Use 默认自带的 ChatBrowserUse 模型不稳定,国内使用经常出现 timeout / stuck 的情况。

可以切换到其他模型,比如 qwen/deepseek…

登录问题

我们 Demo 使用账号密码即可,但像抖音这种会要求扫码 / 验证码 会比较麻烦,建议做成一次登录,永久继续用:

  1. 手动登录一次
  2. 把浏览器 Cookie 导出来
  3. 下次 Browser Use 打开同站点时,加载 Cookie 文件
  4. 这样整个自动对话流程就不再需要重新登录

只不过失效了就得再来一次,反正这个东西很麻烦就是了,核心实现代码示例:

……

04 总结

最后总结一下,出于完整的了解LangChain及带大家深刻了解智能体(Agent)生态真实的情况的需求,我们会将一些关节、难点在接下来的时间一一展开,目的当然是对AI不要过于乐观,但也不要过于悲观。

今天,我们实现了一个完整的自动对话闭环:登录、实时监听消息、调用大模型生成回复,并在真实网页端进行发送,从而形成稳定的多轮自动会话流程。

当前案例仅是一个 Demo 级工程,用的是通用大模型生成回复,但这只是能力的起点。事实上该功能可以很轻易的做各种扩展,比如:

  1. 引入 RAG(检索增强生成):接入企业知识库、FAQ、内部 SOP、订单/工单系统,让回复真正具备业务专业能力。
  2. 人机混合模式:对敏感、高风险、高业务价值的消息自动转人工;人工也可以审阅/修订 AI的回复,实现可控可信。
  3. 更丰富的 Browser Use + LangChain 场景:不仅仅聊天自动回复,还可以执行「AI 自动任务」,如指定站点信息抽取、搜索与对比、内容采集与整理、自动评论、自动发布视频/图文等。

这其中 Browser Use 负责“操作真实世界的网页动作”,LangChain 负责“理解与生成语言逻辑”,两者结合,就能够把过去只能人工做的线上操作,转变为可被 AI 自动执行的任务系统。

最后给个Browser Use结论:标准化、可流程化的网页操作,表现得很不错。但开放网络、长链路、多站点的全自动化依然不稳,需要基建与人机协作兜底,实际操作下来:

  1. Browser Use 在定位元素、点击、输入、提取文本这些步骤上都非常稳定,执行过程成功率非常高;
  2. 但如果换成复杂网页,例如抖音、微博、小红书这种强交互、多层嵌套、多组件的页面,就会明显感觉到 Browser Use 的能力下降,比如:
  3. 带文字的按钮、有明显标签的区域,识别精准;但纯图标区域、动态渲染组件、hover 才出现的元素、评论区这种非显性结构,就经常找不到、反复失败、定位不准、或者执行超时。
  4. 实际尝试时需要对预期有所认知,Browser Use 在信息清晰、层级明确、结构可理解的中小型网页上很好用,但在大型复杂页面上就不一定稳定

其实Browser Use在某些地方是有点类似于我们之前做的浏览器插件的(而且他本身也确实是浏览器插件)。它们都是通过技术手段“嵌入”浏览器,以自动化的方式与网页进行交互。

插件的核心逻辑是:我们作为开发者,需要预先洞察一切,通过代码精确告诉浏览器“点击哪个按钮”、“在哪个输入框填写什么”。这是一种确定性的自动化。

Browser Use的不同之处在于,它把这个“预先洞察”的职责交给LLM。他需要自己判断:“这是登录页?”、“那是搜索框?”,然后自主决策操作顺序。

这使其在应对不同网站结构或微小UI变动时,拥有了我们传统插件难以比拟的灵活性。

只不过,灵活性的背后肯定也隐藏着稳定性的问题,至于如何解决,就看官方下阶段更新了,Browser Use 作为Agent重用工具组成,势必会迎来进一步发展。

本文由人人都是产品经理作者【叶小钗】,微信公众号:【叶小钗】,原创/授权 发布于人人都是产品经理,未经许可,禁止转载。

题图来自Unsplash,基于 CC0 协议。

更多精彩内容,请关注人人都是产品经理微信公众号或下载App
评论
评论请登录
  1. 目前还没评论,等你发挥!