斩获11.8k星！像人类一样使用浏览器，轻松实现浏览器自动化!

作者
项目简介

本项目建立在 browser-use 的基础上，browser-use 旨在使网站对 AI 代理可访问。

WebUI：基于 Gradio 构建，支持大部browser-use 功能。此用户界面设计得非常用户友好，并允许轻松与浏览器代理进行交互。

扩展支持 LLM：我们已集成对各种大型语言模型(LLMs)的支持，包括：谷歌、OpenAI、Azure OpenAI、Anthropic、DeepSeek、Ollama 等。我们计划未来添加更多模型的支持。

自定义浏览器支持：您可以使用我们的工具使用自己的浏览器，无需重新登录网站或处理其他认证挑战。此功能还支持高清屏幕录制。

持久浏览器会话：您可以选择在 AI 任务之间保持浏览器窗口开启，以便查看 AI 交互的完整历史和状态。


安装指南

前提条件


  • Python 3.11 或更高版本
  • Git（用于克隆仓库）

选项 1：本地安装

阅读快速入门指南或按照以下步骤开始。

步骤 1：克隆仓库

git clone https://github.com/browser-use/web-ui.gitcd web-ui

第二步：设置 Python 环境

我们推荐使用 uv 来管理 Python 环境。

使用 uv（推荐）：

uv venv --python 3.11

激活虚拟环境：

  • Windows（命令提示符）：
.venv\Scripts\activate
  • Windows (PowerShell):  
.\.venv\Scripts\Activate.ps1
  • macOS/Linux: 
source .venv/bin/activate

步骤 3：安装依赖

安装 Python 包：

uv pip install -r requirements.txt

在 Playwright 中安装浏览器：您可以通过运行以下命令来安装特定浏览器：

playwright install --with-deps chromium

安装所有浏览器：

playwright install

第 4 步：配置环境


  1. 创建示例环境文件的副本：
  • Windows (命令提示符):
copy .env.example .env
  • macOS/Linux/Windows (PowerShell):
cp .env.example .env
  1. 在您喜欢的文本编辑器中打开 .env 并添加您的 API 密钥和其他设置


选项 2：Docker 安装

前提条件


  • 已安装 Docker 和 Docker Compose
    • Docker Desktop（适用于 Windows/macOS）
    • Docker 引擎和 Docker Compose（适用于 Linux）

安装步骤

  1. 1 克隆仓库：
git clone https://github.com/browser-use/web-ui.gitcd web-ui
  1. 2 创建并配置环境文件：
  • Windows (命令提示符):
copy .env.example .env
  • macOS/Linux/Windows (PowerShell):
cp .env.example .env

使用您喜欢的文本编辑器编辑 .env 并添加您的 API 密钥

  1. 3 使用 Docker 运行:
# Build and start the container with default settings (browser closes after AI tasks)docker compose up --build
# Or run with persistent browser (browser stays open between AI tasks)CHROME_PERSISTENT_SESSION=true docker compose up --build
  1. 4 访问应用:
  • 网页界面: 在浏览器中打开 http://localhost:7788
  • VNC Viewer（用于观看浏览器交互）：打开 http://localhost:6080/vnc.html
    • 默认 VNC 密码: “youvncpassword”
    • 可以通过设置您的 .env 文件中的 VNC_PASSWORD 来更改

使用说明

本地设置

  1. 1 运行 WebUI：完成上述安装步骤后，启动应用程序：
python webui.py --ip 127.0.0.1 --port 7788
  1.  2 WebUI 选项：
    • Default: 具有平衡设计的标准主题。
    • Soft: 柔和、淡雅的色彩方案，提供轻松的观看体验。
    • Monochrome: 以最小化色彩为特点的灰度主题，简洁且专注。
    • Glass: 现代感十足，半透明的时尚设计。
    • Origin:经典复古风格，唤起怀旧情怀。
    • Citrus: 充满活力的柑橘色调，明亮且清新。
    • Ocean ：蓝色海洋风格，带来宁静的体验。
    • --ip: 绑定 WebUI 的 IP 地址。默认为 127.0.0.1 。
    • --port: 绑定 WebUI 的端口号。默认为 7788 。
    • --theme ：用户界面主题。默认为 Ocean 。
    • --dark-mode: 启用暗黑模式界面。
  2. 3 访问 WebUI：打开您的网页浏览器并导航到 http://127.0.0.1:7788 。
  3. 4 使用您自己的浏览器（可选）：
    • 将 CHROME_PATH 设置为您的浏览器可执行文件路径，将 CHROME_USER_DATA 设置为您的浏览器用户数据目录。如果想要使用本地用户数据，请将 CHROME_USER_DATA 留空。
    • Windows
    •  CHROME_PATH="C:\Program Files\Google\Chrome\Application\chrome.exe" CHROME_USER_DATA="C:\Users\YourUsername\AppData\Local\Google\Chrome\User Data"
      Mac


    • CHROME_PATH="/Applications/Google Chrome.app/Contents/MacOS/Google Chrome" CHROME_USER_DATA="/Users/YourUsername/Library/Application Support/Google/Chrome"



    • 关闭所有 Chrome 窗口
    • 在非 Chrome 浏览器中打开 WebUI，例如 Firefox 或 Edge。这很重要，因为持久的浏览器上下文在运行代理时会使用 Chrome 的数据。
    • 在浏览器设置中检查“使用自己的浏览器”选项。
  4. 保持浏览器打开（可选）：
    • 在 .env 文件中设置 CHROME_PERSISTENT_SESSION=true 。

配置

  1. 1 环境变量：

    • 所有配置都通过 .env 文件完成
    • 可用的环境变量：
# LLM API KeysOPENAI_API_KEY=your_key_hereANTHROPIC_API_KEY=your_key_hereGOOGLE_API_KEY=your_key_here
# Browser SettingsCHROME_PERSISTENT_SESSION=true   # Set to true to keep browser open between AI tasksRESOLUTION=1920x1080x24         # Custom resolution format: WIDTHxHEIGHTxDEPTHRESOLUTION_WIDTH=1920           # Custom width in pixelsRESOLUTION_HEIGHT=1080          # Custom height in pixels
# VNC SettingsVNC_PASSWORD=your_vnc_password  # Optional, defaults to "vncpassword"

  1. 2 平台支持：

    • 支持 AMD64 和 ARM64 架构
    • 对于 ARM64 系统（例如，苹果硅 Mac），容器将自动使用适当的镜像

  2. 3 浏览器持久化模式：

    • 浏览器在 AI 任务之间保持开启状态
    • 维护历史和状态
    • 允许查看之前的 AI 交互
    • 在 .env 文件中设置或通过启动容器时环境变量设置
    • 浏览器每次执行 AI 任务后打开和关闭
    • 每次交互都保持干净状态
    • 资源使用量更低

    • 默认模式（CHROME_PERSISTENT_SESSION=false）:

    • 持久模式（CHROME_PERSISTENT_SESSION=true）:

  3. 4 查看浏览器交互：

    • 访问 noVNC 查看器 http://localhost:6080/vnc.html
    • 输入 VNC 密码（默认：”vncpassword” 或你在 VNC_PASSWORD 中设置的值）
    • 直接在端口 5900 上提供 VNC 访问（映射到容器端口 5901）
    • 您现在可以实时查看所有浏览器交互

  4. 5 容器管理：

# Start with persistent browserCHROME_PERSISTENT_SESSION=true docker compose up -d
# Start with default mode (browser closes after tasks)docker compose up -d
# View logsdocker compose logs -f
# Stop the containerdocker compose down

项目链接

https://github.com/browser-use/web-ui

扫码加入技术交流群，备注「开发语言-城市-昵称」

（文：GitHubStore）

发表评论