屏幕内容并输出文字结果，无法直接操作桌面应用。

 项目（Apache 2.0 协议）为这一痛点提供了解决方案——它通过视觉语言模型（VLM）理解屏幕截图，再驱动 Operator 执行具体动作，覆盖 PC 桌面、浏览器、安卓三大平台。

本文基于该项目的源码研究，提炼两个核心技能模块的技术原理与实战用法。

用户指令（自然语言）
    ↓
┌─────────────────────────────────────────┐
│              GUIAgent                  │
│  ┌─────────┐   ┌──────────┐           │
│  │ Screenshot │ → │ VLM推理  │ → │ 执行动作│  │
│  └─────────┘   └──────────┘           │
│       ↑           ↑                   │
│       └───────────┘                   │
│         循环直到 finished             │
└─────────────────────────────────────────┘
    ↓
Operator（NutJS / Browser / ADB）


VLM 输出的坐标统一为归一化值 

，SDK 内部自动换算为实际像素坐标，无需开发者处理屏幕分辨率适配。

AI对话 → MCP Client → MCP Server Browser → Puppeteer → Chrome
                    ↓
            20+ 结构化工具
            (browser_navigate, browser_click, browser_screenshot...)


MCP（Model Context Protocol）为 AI 与浏览器之间提供了标准化的工具接口，使 AI 可以精确控制浏览器行为。

# 全局安装 CLI
npm install -g @agent-tars/cli@latest

# 或直接使用 npx（无需全局安装）
npx @ui-tars/cli start


在 AI 工作流的 MCP 配置文件中添加：

配置完成后，AI 对话时即可直接调用浏览器工具。

场景 1：桌面应用自动化（GUI Agent）

：打开记事本，输入文字，保存文件。

import { GUIAgent } from '@ui-tars/sdk';
import { NutJSOperator } from '@ui-tars/operator-nut-js';

const agent = new GUIAgent({
  model: {
    baseURL: 'http://your-vlm-api.com/v1',
    apiKey: 'your-api-key',
    model: 'ui-tars-1.5-7b',
  },
  operator: new NutJSOperator(),
  maxLoopCount: 25,
  onData: ({ data }) => {
    console.log('[状态]', data.status);
  },
});

await agent.run('打开记事本，输入"测试任务完成"，保存为 test.txt');


第1轮：截图 → 桌面状态 → 输出 click(开始菜单)
第2轮：截图 → 开始菜单 → 输出 type("记事本") + click(记事本)
第3轮：截图 → 记事本窗口 → 输出 click(文本框) + type("测试任务完成")
第4轮：截图 → 菜单栏 → 输出 click(文件) + click(保存)
第5轮：截图 → 保存对话框 → 输出 type("test.txt") + click(保存)
第6轮：截图 → 文件已保存 → 输出 finished()


场景 2：浏览器网页信息采集（MCP）

：打开 GitHub 仓库页面，获取截图。

用户："打开 https://github.com/bytedance/UI-TARS-desktop，截图"
AI 工具调用：
  → browser_navigate(url="https://github.com/bytedance/UI-TARS-desktop")
  → browser_screenshot()


用户："在百度搜索'字节跳动UI-TARS'"
AI 工具调用：
  → browser_navigate(url="https://www.baidu.com")
  → browser_get_clickable_elements()
  → browser_form_input_fill(index=1, value="字节跳动UI-TARS", clear=true)
  → browser_keyboard_press(key="Enter")
  → browser_screenshot()


场景 4：复杂任务分步执行（Planning + Execution）

对多步骤复杂任务，建议先用推理模型拆解，再逐步执行：

// 第一步：推理模型拆分任务
const steps = await reasoningModel.invoke(
  '帮我订一张明天北京到上海的高铁票，二等座'
);
// steps = ['打开12306', '点击出发地输入框', '输入北京', ...]

// 第二步：GUI Agent 逐步执行
for (const step of steps) {
  await agent.run(step);
  await sleep(1000);
}


：MCP 负责精确导航和表单填写，GUI Agent 负责处理验证码等复杂交互场景。

// 阶段一：MCP 精确控制
await mcpClient.callTool('browser', 'browser_navigate', {
  url: 'https://mail.example.com'
});
await mcpClient.callTool('browser', 'browser_form_input_fill', {
  selector: '#u', value: 'user@example.com', clear: true
});
await mcpClient.callTool('browser', 'browser_form_input_fill', {
  selector: '#p', value: 'password', clear: true
});

// 阶段二：GUI Agent 处理验证码
await guiAgent.run('如果出现验证码，识别并填写');


场景 6：安卓手机控制（AdbOperator）

import { AdbOperator, getAndroidDeviceId } from '@ui-tars/operator-adb';

const deviceId = await getAndroidDeviceId();
const agent = new GUIAgent({
  model: { baseURL: '...', apiKey: '...', model: '...' },
  operator: new AdbOperator(deviceId),
});

await agent.run('打开微信，搜索"文件传输助手"，发送"测试消息"');


| 维度 | UI-TARS GUI Agent | MCP 浏览器自动化 |

| 控制范围 | PC桌面 + 浏览器 + 安卓 | 仅浏览器 |

| 控制方式 | VLM 视觉理解，自主决策 | AI 调用具体工具，精确控制 |

| 是否需要 VLM | 必须 | 不需要（DOM-based） |

| 操作精度 | 中等（视觉定位有误差） | 高（DOM 精确定位） |

| 反爬能力 | 强（模拟人类操作） | 一般 |

| 适用场景 | 任意 GUI 界面 | 结构化页面、表单、数据采集 |

# 安装并运行模型
ollama run qwen2.5:3b

# 接入 GUI Agent
const agent = new GUIAgent({
  model: {
    baseURL: 'http://localhost:11434/v1',
    apiKey: 'ollama',
    model: 'qwen2.5:3b',
  },
  operator: new NutJSOperator(),
});


：纯 CPU 推理速度受限，建议简单任务使用；复杂任务推荐 GPU 部署专用 VLM 模型。

// AbortController 方式（推荐）
const ac = new AbortController();
const agent = new GUIAgent({ model: {...}, operator: op, signal: ac.signal });
process.on('SIGINT', () => ac.abort());

// 或直接调用方法
agent.pause();   // 暂停
agent.resume();  // 恢复
agent.stop();   // 强制停止


CHROME_PATH="C:/Program Files/Google/Chrome/Application/chrome.exe"


的问题，使 AI 可以自主操作桌面应用、处理表单、控制移动设备。

MCP 浏览器服务器提供了 DOM 级的精确浏览器控制能力，适合结构化数据采集与表单操作场景。

两者结合，AI 可以在电脑上完成从

理解需求 → 分析信息 → 执行操作

本文基于字节跳动 UI-TARS-desktop 0.3.0 开源项目源码研究撰写

UI-TARS GUI Agent + MCP 浏览器自动化实战

UITARS GUI Agent + MCP 浏览器自动化实战
 作者：技术团队
 日期：20260520
 适用人群：AI 开发者、自动化工程师、技术爱好者
 一、概述
过去，AI 助手只能"读"屏幕内容并输出文字结果，无法直接操作桌面应用。
字节跳动开源的 UITARSdesktop 项目（Apache 2.0 协议）为这一痛点提供了解决方案——它通过视觉语言模型（VLM）理解屏幕截图，再驱动...

编程语言

字节跳动开源UI-TARS-desktop项目，通过视觉语言模型实现AI对PC桌面、浏览器和安卓设备的自动化操作。支持MCP协议浏览器控制、表单填写、数据采集等六大场景，提供本地模型部署方案。适用于AI开发者实现从理解需求到执行操作的全流程自动化闭环。

结构化数据

验证码

服务器

Windows

GitHub

Agent

2026采购季 | AI焕新·智启新局

captcha

4核4G3M云服务器 新用户低至38元/年！

文章

问答

视频

教程

学习中心

腾讯云实验室

直播

竞赛

腾讯云代码分析专区

腾讯iOA零信任安全管理系统专区

腾讯云架构师技术同盟交流圈

腾讯云数据库专区

腾讯云智能顾问专区

腾讯云原生专区

腾讯混元专区

腾讯云TCE专区

腾讯云Lighthouse专区

腾讯云HAI专区

腾讯云Edgeone专区

腾讯云存储专区

腾讯云智能专区

腾讯轻联专区 

腾讯云开发专区

TAPD专区

腾讯轻量云游戏服专区

EdgeOne AI 安全实战专区

腾讯云最具价值专家

腾讯云架构师技术同盟

腾讯云创作之星

腾讯云开发者先锋

腾讯云代码助手

云原生构建

TAPD 敏捷项目管理

Cloud Studio

SDK中心

API中心

命令行工具

涵盖代码开发、场景应用、自动测试全流程，助你从零构建专属AI助手

一站式MCP教程库，解锁AI应用新玩法

聚焦“写作效率、视觉美观与运行性能”三方面进行全面升级，为您提供更高效、稳定的创作环境

社区富文本&Markdown编辑器全新改版上线，欢迎大家体验!

诚挚邀请您参与本次调研，分享您的真实使用感受与建议。您的反馈至关重要，感谢您的支持与参与！

UI-TARS GUI Agent + MCP 浏览器自动化实战

UI-TARS GUI Agent + MCP 浏览器自动化实战

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐