这个项目是一个用于控制浏览器的AI代理的Web界面,它使用Gradio构建UI,支持多种浏览器操作模式。

├── app.py # 主入口点
├── webui.py # 原始单文件版本(保留用于参考)
├── src/ # 源代码目录
│ ├── agent_runners.py # Agent运行器,负责启动和管理代理
│ ├── globals.py # 全局变量
│ ├── agent/ # Agent相关代码
│ ├── browser/ # 浏览器相关代码
│ ├── controller/ # 控制器相关代码
│ ├── ui/ # UI相关代码
│ │ ├── themes.py # 主题定义
│ │ ├── ui_builder.py # UI构建函数
│ │ └── ui_handlers.py # UI事件处理函数
│ └── utils/ # 工具类
│ ├── agent_state.py # Agent状态管理
│ ├── deep_research.py # 深度研究功能
│ ├── default_config_settings.py # 默认配置
│ ├── env_utils.py # 环境变量工具
│ └── utils.py # 通用工具函数

1. 安装依赖:

pip install -r requirements.txt

2. 运行应用:

python app.py

3. 可选参数:

python app.py --ip 0.0.0.0 --port 7788 --theme Ocean

• 代理设置:配置代理类型、最大步骤数和每步最大动作数
• LLM设置:配置语言模型提供商、模型名称和参数
• 浏览器设置:配置浏览器行为、窗口大小和录制选项
• 运行代理:执行定义的任务并显示结果
• 深度研究:执行深度研究任务
• 录制管理:查看和管理录制的浏览器会话
• 配置管理:保存和加载UI配置

欢迎贡献代码、报告问题或提供改进建议。

Browser Use Web UI

GitHub stars Discord Documentation WarmShao

This project builds upon the foundation of the browser-use, which is designed to make websites accessible for AI agents.

We would like to officially thank WarmShao for his contribution to this project.

WebUI: is built on Gradio and supports most of browser-use functionalities. This UI is designed to be user-friendly and enables easy interaction with the browser agent.

Expanded LLM Support: We've integrated support for various Large Language Models (LLMs), including: Google, OpenAI, Azure OpenAI, Anthropic, DeepSeek, Ollama etc. And we plan to add support for even more models in the future.

Custom Browser Support: You can use your own browser with our tool, eliminating the need to re-login to sites or deal with other authentication challenges. This feature also supports high-definition screen recording.

Persistent Browser Sessions: You can choose to keep the browser window open between AI tasks, allowing you to see the complete history and state of AI interactions.

• Python 3.11 or higher
• Git (for cloning the repository)

Read the quickstart guide or follow the steps below to get started.

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

We recommend using uv for managing the Python environment.

Using uv (recommended):

uv venv --python 3.11

Activate the virtual environment:

• Windows (Command Prompt):

.venv\Scripts\activate

• Windows (PowerShell):

.\.venv\Scripts\Activate.ps1

• macOS/Linux:

source .venv/bin/activate

Install Python packages:

uv pip install -r requirements.txt

Install Browsers in Playwright: You can install specific browsers by running:

playwright install --with-deps chromium

To install all browsers:

playwright install

1. Create a copy of the example environment file:

• Windows (Command Prompt):

copy .env.example .env

• macOS/Linux/Windows (PowerShell):

cp .env.example .env

2. Open .env in your preferred text editor and add your API keys and other settings

• Docker and Docker Compose installed
  • Docker Desktop (For Windows/macOS)
  • Docker Engine and Docker Compose (For Linux)

1. Clone the repository:

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

2. Create and configure environment file:

• Windows (Command Prompt):

copy .env.example .env

• macOS/Linux/Windows (PowerShell):

cp .env.example .env

Edit .env with your preferred text editor and add your API keys

3. Run with 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

4. Access the Application:

• Web Interface: Open http://localhost:7788 in your browser
• VNC Viewer (for watching browser interactions): Open http://localhost:6080/vnc.html
  • Default VNC password: "youvncpassword"
  • Can be changed by setting VNC_PASSWORD in your .env file

1. Run the WebUI: After completing the installation steps above, start the application:

   python webui.py --ip 127.0.0.1 --port 7788

2. WebUI options:
   • --ip: The IP address to bind the WebUI to. Default is 127.0.0.1.
   • --port: The port to bind the WebUI to. Default is 7788.
   • --theme: The theme for the user interface. Default is Ocean.
     • Default: The standard theme with a balanced design.
     • Soft: A gentle, muted color scheme for a relaxed viewing experience.
     • Monochrome: A grayscale theme with minimal color for simplicity and focus.
     • Glass: A sleek, semi-transparent design for a modern appearance.
     • Origin: A classic, retro-inspired theme for a nostalgic feel.
     • Citrus: A vibrant, citrus-inspired palette with bright and fresh colors.
     • Ocean (default): A blue, ocean-inspired theme providing a calming effect.
   • --dark-mode: Enables dark mode for the user interface.
3. Access the WebUI: Open your web browser and navigate to http://127.0.0.1:7788.
4. Using Your Own Browser(Optional):
   • Set CHROME_PATH to the executable path of your browser and CHROME_USER_DATA to the user data directory of your browser. Leave CHROME_USER_DATA empty if you want to use local 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"

       Note: Replace YourUsername with your actual Windows username for Windows systems.

     • Mac

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

   • Close all Chrome windows
   • Open the WebUI in a non-Chrome browser, such as Firefox or Edge. This is important because the persistent browser context will use the Chrome data when running the agent.
   • Check the "Use Own Browser" option within the Browser Settings.
5. Keep Browser Open(Optional):
   • Set CHROME_PERSISTENT_SESSION=true in the .env file.

1. Environment Variables:

   • All configuration is done through the .env file
   • Available environment variables:

     # LLM API Keys
     OPENAI_API_KEY=your_key_here
     ANTHROPIC_API_KEY=your_key_here
     GOOGLE_API_KEY=your_key_here
     # Browser Settings
     CHROME_PERSISTENT_SESSION=true # Set to true to keep browser open between AI tasks
     RESOLUTION=1920x1080x24 # Custom resolution format: WIDTHxHEIGHTxDEPTH
     RESOLUTION_WIDTH=1920 # Custom width in pixels
     RESOLUTION_HEIGHT=1080 # Custom height in pixels
     # VNC Settings
     VNC_PASSWORD=your_vnc_password # Optional, defaults to "vncpassword"
     

2. Platform Support:

   • Supports both AMD64 and ARM64 architectures
   • For ARM64 systems (e.g., Apple Silicon Macs), the container will automatically use the appropriate image

3. Browser Persistence Modes:

   • Default Mode (CHROME_PERSISTENT_SESSION=false):

     • Browser opens and closes with each AI task
     • Clean state for each interaction
     • Lower resource usage

   • Persistent Mode (CHROME_PERSISTENT_SESSION=true):

     • Browser stays open between AI tasks
     • Maintains history and state
     • Allows viewing previous AI interactions
     • Set in .env file or via environment variable when starting container

4. Viewing Browser Interactions:

   • Access the noVNC viewer at http://localhost:6080/vnc.html
   • Enter the VNC password (default: "vncpassword" or what you set in VNC_PASSWORD)
   • Direct VNC access available on port 5900 (mapped to container port 5901)
   • You can now see all browser interactions in real-time

5. Container Management:

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

• 2025年01月26日: Thanks to @vvincent1234. Now browser-use-webui can combine with DeepSeek-r1 to engage in deep thinking!
• 2025年01月10日: Thanks to @casistack. Now we have Docker Setup option and also Support keep browser open between tasks.Video tutorial demo.
• 2025年01月06日: Thanks to @richard-devbot. A New and Well-Designed WebUI is released. Video tutorial demo.