如果你想“自己用 AI”来实现整套「自动打开网站 → 登录各销售后台 → 下载业务数据」,本质上就是把传统爬虫/RPA 流程里的“人工写规则”环节,尽量换成大模型来“看网页→决策→写代码/点按钮”。 为此,你需要在系统里内嵌 6 个 AI 能力模块,对应 6 个功能点:
1. 视觉解析(Vision Parsing) 功能:把网页截图 + DOM 结构喂给多模态模型,让它“看懂”当前页面有哪些表格、按钮、日期控件、导出入口。
技术:GPT-4o / Gemini-1.5-Pro / Claude-3.5-SONNET 的 vision API,输出 JSON 描述元素坐标、类型、语义。
2. 导航规划(Navigation Planning) 功能:根据“业务目标(下载 2025-12 销售报表)”和当前页面快照,自动输出下一步操作序列,比如「1. 点击【报表中心】 2. 选择【销售明细】 3. 输入日期 2025-12-01~2025-12-31 4. 点击【导出 Excel】」。
技术:ReAct / Reflexion / Chain-of-Thought Prompt,让模型在“思考-行动-观察”循环里自己纠正路径。
3. 动作执行(Action Execution) 功能:把自然语言操作翻译成浏览器可执行命令(点击、输入、滚动、等待下载)。
技术:
– 轻量:Playwright/Selenium 的 CDP 接口;
– 高级:开源项目 seeact、WebArena、MetaGPT-UI,把模型输出的 JSON 直接映射成 page.click(x, y) 或 DOM selector。
4. 异常恢复(Self-healing) 功能:遇到验证码、弹窗、页面改版、按钮位移时,模型能自动重试并改写 selector 或截图找新坐标。
技术:在 ReAct 循环里加入「异常截图 → 重新定位 → 更新操作」分支;也可以外挂一个轻量检测模型(YOLOv8)专门识别验证码类型,再调用第三方打码平台。
5. 数据清洗/对齐(Data Post-processing) 功能:下载下来的文件可能是多语言、多币种、多表头,需要统一列名、汇率、日期格式。
技术:
– 让 LLM 直接读 Excel/CSV,输出“重命名映射表”+“清洗代码”(Pandas 脚本);
– 或者走 ETL 规则引擎,LLM 只负责“生成规则配置文件”。
6. 记忆与反馈(Memory & Feedback) 功能:同一家网站第二次跑时,模型应记住“上次成功的 DOM 路径、日期格式、等待时长”,不再从零推理。
技术:向量数据库存储“站点 ID + 页面哈希 + 成功操作序列”,下次先检索最相似经验;失败时写入“负样本”供后续微调。
一句话版本 “浏览器驱动 + 大模型(视觉+推理)+ 向量记忆 + 轻量 ETL” 四件套即可落地。 展开成最小可跑、又能随时横向扩展的技术栈,如下表:
层级
首选技术
作用
备注/可替换
① 浏览器自动化
Playwright (Python/JS)
真正“打开网页-点击-下载”
Selenium/DrissionPage 也能用,但 Playwright 对等待、下载、headless 支持最好
② 视觉+语言模型
GPT-4o / Gemini-1.5-Pro / Claude-3.5-SONNET
看懂页面→规划下一步→生成代码
预算紧可用 Qwen-VL-Chat、CogVLM 本地 8-bit 推理
③ 提示框架
LangChain / LlamaIndex / 原生 ReAct
把“截图→思考→动作→记忆”循环标准化
百行代码也能自己写,LangChain 省脚手架
④ 向量记忆
Chroma/Qdrant(本地)或 Pinecone(云)
存成功轨迹、异常经验,下次 RAG 复用
数据量小直接用 SQLite + sentence-transformers
⑤ 任务/异常调度
asyncio + tenacity(重试)+ APScheduler(定时)
并发、断点续跑、失败回退
heavier 场景换 Celery + Redis
⑥ 数据清洗
Pandas + 让 LLM 生成 python 片段
列名翻译、币种换算、日期统一
量大可转 DuckDB、Polars
⑦ 配置/密钥
pydantic-settings + python-dotenv
管理账号、API-key、代理
容器化时直接挂 K8s Secret
⑧ 部署与监控
Docker + FastAPI(暴露手动触发接口)+ Prometheus
一键镜像、日志、 metrics
单机可先 docker-compose;后面丢 Serverless(阿里云 FC、AWS Lambda)
全自研的话 如果“一行现成的 SaaS / 开源框架都不想用,全部自己从头撸”,那你需要自研的其实只有 * 5 大子系统、16 个功能模块,外加 3 份离线资产。下面给出“从零到生产”的完整自研清单、关键技术点与最小数据结构,方便你直接开 Repo。
16 个必须自研的功能模块 1.浏览器驱动(裸 CDP) 用 Chrome 官方库 github.com/chromium/chromium —— 远程调试端口 9222 自己封装 6 个原子命令:Page.navigate / Runtime.evaluate / DOM.querySelector / Input.dispatchMouseEvent / Input.dispatchKeyEvent / Page.captureScreenshot 下载监听:Browser.setDownloadBehavior 把文件重定向到已知目录,配合 Page.downloadWillBegin 事件拿到文件名。
2.页面快照序列化
截图:PNG → 统一 1280×720,压缩质量 85
DOM 精简:只保留可见节点,属性仅 tagName、class、id、href、type、value、bounds(通过 DOM.getBoxModel),体积 <150 KB/页
生成「截图 + DOM-JSON」二元组,作为后续模型的统一输入。
3.视觉编码器(Vision Encoder)
方案 A:CLIP-ViT-B/16 直接出 512 维向量,轻量、可本地跑
方案 B:自训 ScreenBERT:用 1M 中文网页截图 + 对应 DOM 做 MLM 预训练,得到 768 维向量 输出固定维度的「页面视觉特征」v。
4.动作词汇表 & 动作空间 限定 7 种原子动作,降低模型输出空间:
1 2 3 { "action_id": 0-6, "txt": "click|type|scroll|wait|go_back|go_forward|download" , "arg": "selector|text|pixels|seconds|NULL" }
5. 小参数语言模型(1.1B–7B)
基座:Qwen2-7B-Instruct 或 Llama3-8B-Chinese
继续预训练:100 万条「网页截图(路径) + DOM + 人类操作序列」自我对抗生成(用现有 GPT-4o 批量标注,再人工抽检 5%)
微调目标:输入「截图路径 + DOM-JSON + 目标描述」→ 输出「下一步动作 JSON」+「是否结束」标志位
训练框架:LLaMA-Factory / Axolotl,2×A100-40G 3 天可收敛。
6. 推理服务(self-hosted)
vLLM + FastAPI,int4 量化,batch=8,首 token <600 ms
显存占用 6 GB(7B 模型 int4)→ 单卡 24 GB 可跑 3 并发。
7. 向量索引(自建 ANN)
选 hnswlib 或 faiss IndexHNSW,维度 768/512,M=32,efConstruction=200
内存约 4 字节×维×向量数,100 万条 768 维 ≈ 3 GB RAM
写入:页面视觉特征 v + DOM-文本特征(MiniLM 句向量)做加权拼接,再 L2 归一化。
8. 轨迹回放池(Trajectory Pool)
表结构: traj_id | url_hash | goal | success_flag | action_sequence(json) | screenshot_dir | cleaned_csv_path | ctime
本地用 PostgreSQL + JSONB,索引 (url_hash, success_flag);亿级可迁 ClickHouse。
9. 经验召回(RAG)
当前页面 v → ANN 取 Top-5 相似轨迹 → 过滤 success_flag=true → 把「动作序列」拼成 prompt 示例,喂给语言模型做 in-context learning,减少幻觉。
10. 异常检测与自恢复
规则层: – 页面 15 s 仍无响应 → 刷新 – selector 找不到 → DOM diff:把当前 DOM 与上次成功 DOM 做最长公共子序列,定位新增/消失节点,自动生成备选 selector(id→class→xpath→text)
模型层:遇到验证码/弹窗,把局部截图再喂给视觉模型做“分类:滑块/点选/短信”,调用第三方打码平台或内置滑动轨迹生成器。
11. 数据清洗脚本生成器
把下载的 CSV/Excel 第一页 + 列名喂给微调后的 1.1B「代码小模型」,输出一段 Python(仅依赖 pandas、numpy)
沙箱执行:PyPy sandbox + RestrictedPython,禁止 import os/socket 等,超时 30 s
输出标准化 Parquet,schema 统一:date, sku, qty, amount, currency, channel。
12. 版本化落盘(Git LFS + Parquet)
每次任务生成 sales_YYYYMMDD_HHMMSS_{site}.parquet,同批次写 _SUCCESS 空文件
大文件走 Git LFS;元数据(大小、行数、hash)写 manifest.json 一并 commit,保证可回滚。
13. 调度与并发引擎
纯 asyncio + 进程池:浏览器每进程 1 个 CDP 实例,避免锁
任务队列:用 Redis List 实现,LPUSH 下发,BRPOP 抢任务
优先级:goal 级别 0-9,数字越小越先出队。
14. 监控 & 可观测
日志:JSON 格式打到 stdout,Filebeat 收集 → Elasticsearch
指标:prometheus_client 暴露 browser_restart_total、download_bytes、success_rate、avg_step_latency
告警:Prometheus + AlertManager,成功率 <90% 或单任务 >10 min 未结束则飞书/Slack 通知。
15. 配置中心
YAML 文件 + pydantic 校验,热更新:watchdog 监听 inode 变化,5 s 内 reload;无需重启浏览器。
16. 一键部署脚本
Dockerfile:基于官方 chromium-image,多阶段编译把模型权重、代码、依赖打进去
docker-compose: – web-agent 服务(含浏览器+模型) – redis 服务 – postgres 服务 – prometheus + grafana 服务
单台 16 核 32 GB + RTX-4080(16G) 可并发 4 浏览器 4 模型实例,日跑 2000 个站点报表。
3 份离线自建资产 预训练语料(100 万页)
来源:CommonCrawl 中文网页 40 万 + 主流电商后台模板 60 万(用 GPT-4o 自动生成「随机目标+操作轨迹」)
格式:{ “jpg_path”: “xxx”, “dom_json”: “…”, “goal”: “下载 2025-12 销售报表”, “action_sequence”: […] }
清洗规则知识库(5 万条)
列名映射:「订单金额→amount」「實收金額→amount」…
正则集合:日期、币种、千分位、括号负数等
用于微调「代码小模型」+ 校验输出。
词表/符号表
动作空间 7 类、CSS 属性白名单、异常编码表(验证码/滑块/登录失败/无数据)
保证模型输出可解析、日志可追踪。
四、开发顺序(6 周排期)
Week1 浏览器裸 CDP 封装 + 截图/DOM 序列化
Week2 视觉编码器训练 + 向量 ANN 索引
Week3 语言模型微调(1.1B→7B)+ 推理服务
Week4 调度+并发+Redis 队列打通,单站点闭环
Week5 异常恢复+验证码+自回归测试,成功率>90%
Week6 数据清洗+Parquet 落盘+监控告警+Docker 化
五、最小可运行 Git 目录结构 1 2 3 4 5 6 7 8 9 ai-sales-agent/ ├─ agent/ # 浏览器驱动、动作执行 ├─ model/ # 微调脚本、权重、推理入口 ├─ memory/ # ANN 索引、经验池 SQL ├─ etl/ # 清洗沙箱、规则库 ├─ scheduler/ # 任务队列、生命周期 ├─ monitor/ # 日志、metrics、告警 ├─ deploy/ # Dockerfile, docker-compose.yml └─ tools/ # 数据合成、评测脚本
全部自研意味着: “浏览器自己驱、模型自己训、向量自己建、清洗自己写、调度自己管、监控自己搭”。 按上面 16 模块 + 3 资产 + 6 周排期推进,你就能得到一条不依赖任何商用/开源黑盒框架、可 100% 源码级掌控的 AI 数据抓取生产线。祝开发顺利,随时卡位可再问我!
有开源的用开源的 下面给你一份“能直接跑、全开源、0→1” 的技术栈速查表——把市面上最活跃、中文支持好、且完全可本地部署的开源项目,对应到前述 5 大子系统。拿着这张表,你就可以「npm install / pip install / docker pull」之后立刻开干,不必自己从头写。
一、浏览器驱动(裸 CDP 不依赖商业包)
chrome-remote-interface 语言:Node.js 作用:直接对 Chrome 9222 端口发 CDP 命令,等价于自写「Page.navigate / DOM.querySelector / Input.dispatchMouseEvent」 地址:https://github.com/cyrus-and/chrome-remote-interface 备注:配合 Puppeteer-core 亦可,但想“零黑盒”就裸用 CRI。 P* yChromeDevTools(Python) 同上,只是 Python 封装,适合后端统一用 Python 的团队。
二、视觉-语言模型(开源 & 中文友好)
推理框架
vLLM + Transformers 即可一键启动;显存不够就用 bitsandbytes 8-bit / 4-bit 量化。
batch 推理首 token <600 ms,单卡 24 GB 可跑 7B 模型 int4。
三、向量记忆(RAG 召回轨迹)
Chroma 语言:Python / JS,MIT 协议 特点:pip install chromadb 即可,本地文件持久化,4 行代码就能 add / query 地址:https://github.com/chroma-core/chroma
Qdrant(Rust 内核,Python SDK) 如果数据上到千万级,需要过滤 + 分布式,可选 Qdrant;单机用 Docker 一个容器搞定。
四、动作生成 & Agent 框架
LangChain-Community + ReAct 模板
已集成「CDPToolkit」和「OpenAI-like」接口,把 Qwen-VL 当 LLM 节点,自定义 Tool 为「click/type/scroll」即可。
seeact(WebAgent 开源实现)
五、数据清洗 & 落盘
DuckDB / Pandas
轻量 ETL:SQL + Python UDF,单文件 1000 万行无压力。
datasette + Git LFS
把结果写 SQLite,datasette 一键发布成只读 Web UI;大文件走 Git LFS,版本可回滚。
六、调度 & 监控(全开源)
任务队列:Celery + Redis
定时:APScheduler(单机)或 Airflow(集群)
监控:Prometheus + Grafana + AlertManager
日志:Vector → Elasticsearch → Kibana(可选)
总结(直接照抄即可)
浏览器:chrome-remote-interface (JS) 或 PyChromeDevTools (Python)
视觉模型:Qwen2.5-VL-7B / CogVLM / InternVL2.5 均可本地推理
向量记忆:Chroma
Agent 框架:seeact(裸 CDP + ReAct)
数据清洗:Pandas + DuckDB
调度/监控:Celery + Prometheus + Grafana
细节梳理 CLIP-ViT-B/16 和 自训 ScreenBERT 的区别
维度
CLIP-ViT-B/16
自训 ScreenBERT(以网页截图-DOM 为输入的 BERT 变体)
1. 训练目标
图文对齐:4 亿图文对对比学习,让图片向量与对应文本向量余弦相似度最大
网页元素-动作预测:给定截图+DOM,预测下一步操作(或元素语义),本质是“网页理解”预训练
2. 输入形式
纯图片(224×224)→ 16×16 Patch → 196 个视觉 Token
双模态:① 截图切块 ② 同级 DOM 结构(节点标签、属性、坐标)→ 同时送进 Transformer
3. 数据规模/领域
通用自然图像(WebImageText 4 亿对)
自建 100 万级网页截图-操作轨迹,领域专注“后台/表单/按钮”
4. 输出向量特点
全局单向量([CLS]),图文空间对齐,零样本分类强
保留细粒度 token 向量,可接 token-level 头做元素定位或动作分类
5. Patch/Embedding 策略
固定 16×16 像素 Patch;无显式文本嵌入
常见做法:视觉仍用 16×16 Patch,DOM 按节点序列化后 WordPiece 分词,再与视觉 Patch 做 Cross-Attention 或拼接
6. 参数规模
视觉编码器 86 M(12 层 768 dim)
可自定,常见 12 层 768 dim,与 BERT-base 相当;若加 Cross-Attn 会略大
7. 适用下游任务
图文检索、零样本分类、CLIP-Adapter 等
网页元素定位、动作生成、RPA 流程理解、DOM 语义抽取
8. 计算代价
纯视觉,O(L²) 只取决于 Patch 数
视觉+文本序列,序列更长(196+DOM_tokens),Attention 计算量更高
9. 微调/继续预训练难度
公开权重丰富,直接加载即可
需自采网页截图-操作对,清洗 DOM、对齐坐标,数据工程量大
一句话总结
CLIP-ViT-B/16 是“通用图文对齐”的纯视觉编码器;自训 ScreenBERT 是“网页专用、视觉+DOM 双模态”的细粒度理解模型,两者目标、输入、输出维度完全不同,在 RPA/WebAgent 场景下 ScreenBERT 更精准,但需要自己从头造数据与训练 pipeline。