🦜 胡浏览器智能体:技术细节 🛠️

INFO

这是给懂技术的用户看的。你无需阅读此内容即可享受胡浏览器智能体功能。👍

此页面详细介绍了胡浏览器智能体的一些架构和探索。AI智能体正在快速发展;本指南可能不总是反映最新更新。

胡浏览器通过模块化、可扩展的设计提供强大、智能的浏览器自动化。下面,我们概述其架构、状态管理、智能和独特的技术解决方案。

🚀 概述与架构

  • 灵活自动化: 结合自然语言、录制动作和代码以实现适应性控制
  • 高级任务分解: 将复杂任务分解为可管理的子任务,并智能选择工具
  • 全面工具集: 集成浏览器、文件、命令行、API和数据分析功能
  • 实时反馈: 在任务执行时跟踪和修改中间结果
  • 模块化、可扩展设计: 为可靠性、透明性和易扩展而构建

核心工作流

胡浏览器在连续循环中运行:

  1. 初始化: 智能体使用任务、LLM和浏览器实例创建;所有组件都使用遥测初始化
  2. 执行循环: 状态检索 → LLM分析 → 动作执行 → 状态更新
  3. 完成: 任务完成触发事件记录、历史返回和可选GIF生成

系统组件

  • 智能体: 规划和执行任务,管理状态/历史,处理LLM消息和错误
  • 控制器: 注册浏览器动作,验证参数,将LLM指令桥接到浏览器操作
  • 浏览器: 管理浏览器实例、上下文、标签、导航和DOM操作
  • DomService: 构建DOM树,识别交互元素,跟踪历史和视口信息
  • 后台进程(虚拟沙箱): 在隔离环境中执行自动化任务,确保操作顺利运行而不干扰用户的浏览体验。

🔍 内存管理

  • 智能体对其先前动作具有持久记忆。这使其能够通过利用早期交互的上下文在后续步骤中做出明智的决策。例如,没有持久记忆,如果智能体点击按钮并导航到新页面,在提取数据时它可能不记得是它发起的导航。
  • 将历史数据建模为"记忆"显著简化了自动化脚本的开发和健壮性,相比使用显式变量在步骤之间手动传递数据——这个过程对于复杂工作流变得麻烦且容易出错。
    • 个人偏好:通过隐式信号学习
  • 这种方法使我们能够构建更复杂和动态的自动化场景,智能体可以真正"理解"其动作的上下文。

基本属性

  • context_evaluation: 动作后结果分析和调整规划
  • memory: 进度和关键信息的持久存储
  • short_term_goal: 立即下一步
  • long_term_goal: 指导序列的总体目标

压缩记忆

  • 总结每个完成的步骤: 在每个动作(例如,点击、数据提取、导航)之后,智能体生成刚刚发生的事情的简洁摘要。此摘要可能包括以下详细信息:
    • "点击:在'提交'按钮上。"
  • 为后续步骤保留和利用此记忆:

胡浏览器在两个级别管理状态:

  1. 多标签编排: 管理浏览器实例、上下文和页面以处理复杂工作流
  2. 标签级上下文: 解析和提取页面元素信息,并进行精确定位

📄 页面与DOM处理

胡浏览器使用结构化文本和索引截图将复杂的网页结构转换为LLM友好的描述。页面信息被视为一次性数据,在每次请求后清除以保持LLM上下文效率。

DOM树分析

  • 识别可见、交互和顶层元素
  • 多层交互性检查(ARIA、事件、内容可编辑)
  • 高性能元素突出显示覆盖
  • 专注于可操作类型:按钮、文本节点、图像、表单、容器
  • 过滤: 忽略小于5px(跟踪像素)或大于屏幕尺寸的元素
  • 提取: 生成带有ID、哈希、定位器的统一WebElementInfo
  • 标签逻辑: 对大多数元素使用父标签,表单特殊处理
  • 树操作: 应用算法转换为结构化树

元素属性示例:

{
	"tagName": "a",
	"attributes": {},
	"xpath": "html/body/div/a[2]",
	"children": ["idx_459"],
	"isVisible": true,
	"isTopElement": true,
	"isInteractive": true,
	"isInViewport": true,
	"highlightIndex": 5,
	"elementId": "element_123",
	"indexId": "idx_456",
	"nodeHashId": "hash_789",
	"content": "HuBrowsing",
	"position": { "x": 100, "y": 200, "width": 60, "height": 30 },
	"centerCoordinates": { "x": 150, "y": 225 },
	"zoomLevel": 1.0,
	"screenDimensions": { "width": 1920, "height": 1080 }
}

截图处理

  • DPR(设备像素比)适配不同屏幕分辨率: 为高分辨率屏幕(DPR > 1)调整截图,确保像素精确的元素定位
  • 元素标记: 为LLM识别和可操作UI提示添加交互元素标记/边框

用户意图识别

  • 分析鼠标和触摸移动模式以评估用户兴趣,使智能体能够优先处理并定制响应。
  • 基于语义意图突出显示每个元素的交互可能性,并可选择向用户显示颜色编码。这有助于智能体专注于最相关的信息或动作。

🧠 智能体智能与工具集成

工具集成与动作注册

  • 结构化函数调用,带有JSON Schema验证以确保精确执行
  • 灵活注册同步/异步操作

🧅 多层上下文系统

胡浏览器根据任务复杂性和LLM需求选择上下文层,平衡性能和准确性:

  • 文本内容: 可见文本提取
  • HTML元数据: 标题、元标签
  • 视口截图: 当前可见区域
  • 页面缩略图: 低分辨率预览
  • 全页截图: 完整视觉快照
  • 扁平化HTML树: 带有关键属性的结构化DOM
  • 完整HTML树: 用于深度检查的完整DOM
  • Web API数据: 用于详细任务的结构化数据

🎯 目标规划与执行

规划方法论