1. Manus 爆火之后我想把 Computer Use Agent 拆开看看Manus 刷屏那几天我朋友圈里做 Agent 的、做前端的、做自动化的都在转它的演示视频。一个通用型 AI Agent能自己开浏览器查资料、做 PPT、整理表格看起来像是把「人操作电脑」这件事整个交给了模型。但抛开产品层面的热闹真正让我感兴趣的是它背后那套 Computer Use Agent 的技术栈——VLM 视觉理解加上 OCR 屏幕解析这两条主线决定了 Agent 到底能不能「看懂」屏幕能不能「点准」按钮。Computer Use 这个概念Anthropic 在 2024 年 11 月随 Claude 3.5 一起放出来的时候国内讨论声量并不大。它的核心思路很直接不让模型去调一个个预先写好的 API而是让它像人一样看屏幕、移动光标、点击、输入。这样一来任何有图形界面的软件理论上都能被 Agent 操作不需要为每个软件单独开发代理程序。Manus 的爆火某种程度上是把这条路线重新推到了台前。这篇文章面向的是想复现类似能力的开发者。我会从 VLM 和 OCR 两条技术主线拆解 Computer Use Agent 的工作原理然后给出可复制的 Agent 工具调用配置以及用 TaoToken 统一 Key 接入的完整步骤。最后会带你做本地验证让 VLM 识别一张界面截图让 OCR 提取其中的文本确认你的链路是通的。如果你之前只听过 Computer Use 这个词没动手搭过这篇可以当作一个可跟做的起点。需要先说明一点Computer Use Agent 目前各家产品都有明显的性能瓶颈交互效率不算高。但作为开发者理解它的架构和接入方式对判断未来 Agent 设计方向是有价值的。下面进入正题。2. TaoToken 前置准备统一 Key 与模型接入在拆解 VLM 和 OCR 之前得先把模型调用这条链路打通。Computer Use Agent 的决策单元通常是一个多模态模型它要能同时处理截图和文本指令。我试过直接对接各家模型的原生接口切换模型时改 Base URL、改 Key、改参数来回折腾很费时间。后来换成 TaoToken 的统一 Key 方式一个 Key 走多个模型配置上省事不少。TaoToken 的定位是模型 API 的统一接入层。你可以在官网 https://taotoken.net/?utm_sourcetaotoken_aicg_blog_endutm_mediumcsdnutm_campaignrewriteutm_content 了解它的能力范围API 入口是 https://taotoken.net/api。对于 Computer Use 这类需要频繁切换 VLM 和 OCR 模型的场景统一 Key 的好处是你的 Agent 代码里只需要维护一套鉴权逻辑模型 ID 作为参数传入即可。先拿到 Key。进入控制台创建 API Key地址是 https://taotoken.net/console?utm_sourcetaotoken_aicg_blog_endutm_contentconsoleutm_campaignrewrite 。创建完之后复制出来后面配置里会用到。如果你还没决定用哪个模型可以先在模型对话页面 https://taotoken.net/chat?utm_sourcetaotoken_aicg_blog_endutm_contentmodel_chatutm_campaignrewrite 试一下多模态模型的图片理解效果确认它能看懂界面截图再往下走。这里要强调一个概念Computer Use Agent 里的 VLM 不是普通聊天模型。它需要具备视觉定位能力能回答「这个按钮在屏幕的哪个坐标」这类问题。普通多模态模型能描述图片内容但不一定能输出精确的边界框或点击坐标。所以在选模型时要确认它支持视觉定位或 grounding 能力。TaoToken 的模型列表里会标注各模型的能力标签你可以按「视觉」「多模态」筛选。配置层面我建议把 Base URL、Key、Model ID 三件套写进环境变量不要硬编码在代码里。这样切换模型时只改环境变量代码不动。下面是一个.env的示例TAOTOKEN_BASE_URLhttps://taotoken.net/api TAOTOKEN_API_KEYsk-你的Key VLM_MODEL_ID你的视觉模型ID OCR_MODEL_ID你的OCR模型ID如果你用的是 Claude Code 这类编码 Agent它的配置方式略有不同。Claude Code 通过settings.json或环境变量读取 Base URL 和 Key。你可以在接入文档 https://taotoken.net/doc?utm_sourcetaotoken_aicg_blog_endutm_contentdocutm_campaignrewrite 里找到对应客户端的配置说明。对于长期跑编码任务的场景可以考虑 Coding Plan https://taotoken.net/coding-plan?utm_sourcetaotoken_aicg_blog_endutm_contentcoding_planutm_campaignrewrite 它在持续调用上更划算。前置准备做到这里就够了一个 Key、一个 Base URL、两个模型 IDVLM 和 OCR。接下来进入技术拆解和可复制配置。3. 可复制配置VLM OCR 双线 Agent 工具调用这一节是全文的核心我会给出一个可复制的 Agent 工具调用配置把 VLM 视觉理解和 OCR 屏幕解析两条线都接进来。配置以 JSON 形式给出你可以直接放进自己的 Agent 项目里改。先理清架构。Computer Use Agent 的执行循环是「感知—决策—执行」截屏拿到当前界面VLM 结合用户指令决定下一步动作点击哪里、输入什么OCR 辅助提取界面文本做精确定位然后系统级输入驱动执行动作循环直到任务完成。我们的配置要覆盖前两步的模型调用。下面是一个工具定义配置放在tools/computer_use.json{ tools: [ { name: screen_capture, description: 捕获当前屏幕截图返回 base64 编码的 PNG 图像, parameters: { type: object, properties: { region: { type: string, description: 截图区域full 表示全屏window 表示当前窗口, default: full } } } }, { name: vlm_locate, description: 调用视觉语言模型根据截图和指令定位可交互元素返回坐标和动作建议, parameters: { type: object, properties: { image_base64: { type: string }, instruction: { type: string }, model_id: { type: string, default: env:VLM_MODEL_ID } }, required: [image_base64, instruction] } }, { name: ocr_extract, description: 对截图执行 OCR提取文本及其边界框坐标, parameters: { type: object, properties: { image_base64: { type: string }, lang: { type: string, default: chi_simeng }, model_id: { type: string, default: env:OCR_MODEL_ID } }, required: [image_base64] } }, { name: execute_action, description: 执行鼠标或键盘动作, parameters: { type: object, properties: { action_type: { type: string, enum: [click, type, scroll, key] }, x: { type: integer }, y: { type: integer }, text: { type: string } }, required: [action_type] } } ] }这个配置里vlm_locate和ocr_extract是两个关键工具。VLM 负责语义理解OCR 负责文本原子化解析。实际调用时我建议先跑 OCR 拿到界面上的文本和坐标再把 OCR 结果和截图一起喂给 VLM让 VLM 在文本上下文的辅助下做决策。这样比纯 VLM 方案在复杂界面上的准确率高一些。接下来是模型调用的客户端配置。以 Python 为例用 OpenAI 兼容的 SDK 指向 TaoToken 的 Base URLimport os from openai import OpenAI client OpenAI( base_urlos.environ[TAOTOKEN_BASE_URL], api_keyos.environ[TAOTOKEN_API_KEY], ) def vlm_locate(image_base64: str, instruction: str) - dict: resp client.chat.completions.create( modelos.environ[VLM_MODEL_ID], messages[ { role: user, content: [ {type: text, text: f根据截图和指令定位元素{instruction}。返回 JSON包含 action_type、target_text、x、y。}, {type: image_url, image_url: {url: fdata:image/png;base64,{image_base64}}}, ], } ], response_format{type: json_object}, ) return resp.choices[0].message.contentOCR 那条线可以走独立的 OCR 模型也可以用多模态模型直接做文本提取。如果走独立 OCR 模型调用方式类似只是 messages 里只放图片prompt 改成「提取图中所有文本及边界框」。TaoToken 的模型列表里如果有专门的 OCR 模型用它的 ID 替换OCR_MODEL_ID即可。这里有个配置细节要注意response_format设为json_object能让模型输出结构化结果方便后续解析坐标。但不是所有模型都支持这个参数如果报错就把它去掉在 prompt 里强调「只返回 JSON不要其他文字」。如果你用的是 Cline 或 Claude Code 这类已经集成了 MCP 的客户端配置方式是在 MCP 配置文件里加一个 server指向你的 Computer Use 工具服务。Cline 的 MCP 配置在cline_mcp_settings.jsonClaude Code 在settings.json。三件套依然是 Base URL、Key、Model ID缺一不可。具体路径和字段名以接入文档为准不同版本可能有差异。配置写完之后先别急着跑完整 Agent 循环。下一步我们单独验证 VLM 和 OCR 两条线是否通。4. 验证请求本地测试 VLM 识别与 OCR 提取配置写完最怕的是链路不通却不知道卡在哪。这一节带你做两个独立的验证请求一个测 VLM 能不能看懂界面截图并给出坐标一个测 OCR 能不能提取文本。两个都通了再串起来跑 Agent 循环。先准备一张测试截图。随便打开一个网页或软件界面截一张 PNG存成test_screen.png。然后写一个验证脚本verify.pyimport base64 import json import os from openai import OpenAI client OpenAI( base_urlos.environ[TAOTOKEN_BASE_URL], api_keyos.environ[TAOTOKEN_API_KEY], ) def encode_image(path): with open(path, rb) as f: return base64.b64encode(f.read()).decode() image_b64 encode_image(test_screen.png) # 验证 VLM 视觉定位 vlm_resp client.chat.completions.create( modelos.environ[VLM_MODEL_ID], messages[ { role: user, content: [ {type: text, text: 这张截图里有哪些可点击的按钮请给出每个按钮的文字和大致坐标x, y用 JSON 数组返回。}, {type: image_url, image_url: {url: fdata:image/png;base64,{image_b64}}}, ], } ], ) print(VLM 结果) print(vlm_resp.choices[0].message.content) # 验证 OCR 文本提取 ocr_resp client.chat.completions.create( modelos.environ[OCR_MODEL_ID], messages[ { role: user, content: [ {type: text, text: 提取这张截图中的所有文本按行输出每行格式为文本内容 | x | y | 宽度 | 高度。}, {type: image_url, image_url: {url: fdata:image/png;base64,{image_b64}}}, ], } ], ) print(OCR 结果) print(ocr_resp.choices[0].message.content)运行python verify.py观察输出。VLM 那条线你要确认它返回的按钮文字和截图里实际存在的按钮对得上坐标大致落在按钮区域内。如果它返回的坐标明显偏了或者把不存在的按钮编出来说明这个模型的视觉定位能力不够换一个模型 ID 再试。OCR 那条线确认提取的文本和截图里的文字一致坐标格式规整。如果 OCR 结果里出现大量乱码或漏字检查lang参数是否匹配截图语言。中文界面用chi_simeng纯英文用eng。实测下来VLM 和 OCR 分开验证能省很多排障时间。如果直接跑完整 Agent 循环出错时你分不清是截图问题、模型问题还是坐标映射问题。分开测每个环节的结果都看得见。两个验证都通过后把vlm_locate和ocr_extract串进 Agent 主循环。主循环的逻辑是截屏 → OCR 提取文本 → VLM 结合文本和截图决策 → 执行动作 → 再截屏验证结果。循环上限设个 20 次左右避免死循环。验证阶段还有一个动作值得做把 VLM 返回的坐标画到截图上人工看一眼准不准。用 PIL 在截图上画个红点坐标就是模型返回的 x、y。如果红点落在按钮上说明定位可用如果偏了就得调 prompt 或换模型。这个动作花不了几分钟但能直观判断模型能力。5. 本篇常见错排查401、local proxy failed 与 reading choices配置和验证过程中有几个报错出现频率很高。这一节按真实报错逐个排查你遇到时可以直接对照。401 Unauthorized。这个最常见原因是 Key 没传对或没生效。检查三处环境变量TAOTOKEN_API_KEY是否真的被读到了在脚本里 print 一下前几位确认Key 字符串有没有多余空格或换行Base URL 是不是https://taotoken.net/api注意结尾不要多加/v1或斜杠。如果 Key 是从控制台复制的确认复制完整没有截断。401 还有一种可能是 Key 被禁用或额度耗尽去控制台看一下状态。local proxy failed / connection refused。这个报错通常出现在你本地配了代理但代理没启动或端口不对。Computer Use Agent 的截图和模型调用都在本地跑如果环境变量里有HTTP_PROXY或HTTPS_PROXY指向一个不存在的本地端口请求就会失败。排查方法检查环境变量里的代理设置临时 unset 掉再试。另外确认你的网络能正常访问taotoken.net用curl -I https://taotoken.net/api看返回码。reading choices of undefined。这个报错说明你拿到的响应结构里没有choices字段。常见原因有三个一是请求根本没成功返回的是错误对象但代码直接去读resp.choices二是模型 ID 写错了服务端返回了错误信息三是流式和非流式响应混用你按非流式解析但请求开了 stream。排查方法在解析前先 print 完整响应看它到底是什么结构。如果是错误对象里面会有 message 字段说明原因。模型 ID 建议从 TaoToken 的模型列表里复制不要手打。OAuth 相关报错。如果你用的是 Claude Code 或类似客户端可能会遇到 OAuth token 失效的提示。这类客户端有的走 OAuth 鉴权有的走 API Key。用 TaoToken 接入时确认你配置的是 API Key 模式而不是让它去走原生 OAuth 流程。在settings.json里把鉴权字段指向你的 Key具体字段名参考接入文档。如果客户端同时支持两种模式优先选 API Key配置更直接。坐标偏移或点击不准。这不是报错但比报错更烦。VLM 返回的坐标和实际屏幕坐标对不上常见原因是截图分辨率和屏幕分辨率不一致。截图时如果做了缩放坐标映射就会偏。解决办法截图保持原始分辨率不要缩放如果必须缩放在坐标映射时按比例还原。另外多显示器环境下要确认截图捕获的是哪个屏幕坐标原点是主屏还是副屏。OCR 返回空或乱码。检查图片是不是纯色或对比度太低OCR 对低质量图片识别率会下降。另外确认lang参数和图片语言匹配。如果图片里有艺术字体或特殊符号普通 OCR 模型可能识别不了这种情况可以换更强的多模态模型直接做文本提取。排查完这些你的链路基本就稳了。如果还有问题去接入文档 https://taotoken.net/doc?utm_sourcetaotoken_aicg_blog_endutm_contentdocutm_campaignrewrite 里对照客户端的配置示例或者到 API Keys 页面 https://taotoken.net/api-keys?utm_sourcetaotoken_aicg_blog_endutm_contentapi_keysutm_campaignrewrite 确认 Key 状态。6. 从验证到落地把 Computer Use 接进你的工作流VLM 和 OCR 两条线验证通过之后你可以开始把它接进实际工作流。这里给几个落地方向都是我自己跑过或见别人跑通的。第一个方向是端到端测试。传统 E2E 测试要写选择器、维护页面对象界面一改就挂。用 Computer Use Agent你给它一句「打开登录页输入账号密码点击登录确认跳转到首页」它自己看屏幕操作。适合界面变动频繁、选择器维护成本高的项目。但要注意这种方式的稳定性目前还不如传统 E2E适合做辅助验证不适合替代核心测试用例。第二个方向是重复性流程自动化。比如每天要从某个后台导出数据、整理成表格、发到指定位置。这类流程界面固定、步骤明确Computer Use Agent 跑起来比较稳。配置时把步骤拆细每步都让 Agent 截屏确认结果避免它跳步。第三个方向是编码 Agent 的屏幕操作能力扩展。Claude Code 这类工具本身能读写代码但操作图形界面能力有限。通过 MCP 把 Computer Use 工具接进去它就能在编码之外操作浏览器查文档、操作设计工具导出资源。Coding Plan https://taotoken.net/coding-plan?utm_sourcetaotoken_aicg_blog_endutm_contentcoding_planutm_campaignrewrite 适合这种长期跑的编码场景模型调用成本更可控。落地时有个经验不要一上来就追求全自动。先做「人机协作」模式Agent 给出建议动作人确认后再执行。跑顺了再逐步放开自动执行。这样既能积累对 Agent 行为的信任也能在出错时及时拦截。另外Computer Use Agent 的上下文消耗比普通对话大得多因为每轮都要传截图。截图分辨率越高token 消耗越大。优化方法截图前先裁剪掉无关区域只保留操作相关的界面部分或者对截图做适度压缩在清晰度和 token 之间找平衡。TaoToken 的模型对话页面 https://taotoken.net/chat?utm_sourcetaotoken_aicg_blog_endutm_contentmodel_chatutm_campaignrewrite 可以帮你快速对比不同模型在截图理解上的 token 消耗和效果。最后说一个我踩过的坑Agent 循环里一定要设最大步数上限和超时。有次我忘了设上限Agent 在一个弹窗上反复点击跑了上百轮才被我手动停掉token 烧了不少。现在我的配置里固定写max_steps: 20和timeout: 120s超过就中断并记录当前截图方便排查。Computer Use 这条路线还在早期工具链和最佳实践都在快速变化。但核心的 VLM OCR 双线架构以及统一 Key 接入的方式短期内不会大变。把这条链路跑通后面换模型、换场景改的都是配置不是架构。