> [!NOTE] > 本文档由 WeHub 基于上游 README 翻译整理,属于社区翻译,非官方中文文档。 > [English](./README.en.md) · [原始项目](https://github.com/browser-use/web-ui) · [上游 README](https://github.com/browser-use/web-ui/blob/HEAD/README.md) > 原作者、版权与许可证归属以原始项目及本仓库 LICENSE 文件为准。 Browser Use Web UI
[![GitHub stars](https://img.shields.io/github/stars/browser-use/web-ui?style=social)](https://github.com/browser-use/web-ui/stargazers) [![Discord](https://img.shields.io/discord/1303749220842340412?color=7289DA&label=Discord&logo=discord&logoColor=white)](https://link.browser-use.com/discord) [![Documentation](https://img.shields.io/badge/Documentation-📕-blue)](https://docs.browser-use.com) [![WarmShao](https://img.shields.io/twitter/follow/warmshao?style=social)](https://x.com/warmshao) 本项目建立在 [browser-use](https://github.com/browser-use/browser-use), 的基础上,该项目旨在让 AI 智能体能够访问网站。 我们谨此正式感谢 [WarmShao](https://github.com/warmshao) 对本项目的贡献。 **WebUI:** 基于 Gradio 构建,支持 `browser-use` 的大部分功能。该 UI 设计注重易用性,便于与浏览器智能体进行交互。 **扩展的大语言模型(LLM)支持:** 我们已集成对多种大语言模型(LLM)的支持,包括:Google、OpenAI、Azure OpenAI、Anthropic、DeepSeek、Ollama 等。我们计划在未来支持更多模型。 **自定义浏览器支持:** 你可以使用自己的浏览器运行本工具,无需重新登录网站或处理其他身份验证问题。该功能还支持高清屏幕录制。 **持久化浏览器会话:** 你可以选择在多个 AI 任务之间保持浏览器窗口打开,从而查看 AI 交互的完整历史与状态。 ## 安装指南 ### 方式一:本地安装 阅读[快速入门指南](https://docs.browser-use.com/quickstart#prepare-the-environment),或按照以下步骤开始。 #### 步骤 1:克隆仓库 ```bash git clone https://github.com/browser-use/web-ui.git cd web-ui ``` #### 步骤 2:配置 Python 环境 我们建议使用 [uv](https://docs.astral.sh/uv/) 来管理 Python 环境。 使用 uv(推荐): ```bash uv venv --python 3.11 ``` 激活虚拟环境: - Windows(命令提示符): ```cmd .venv\Scripts\activate ``` - Windows(PowerShell): ```powershell .\.venv\Scripts\Activate.ps1 ``` - macOS/Linux: ```bash source .venv/bin/activate ``` #### 步骤 3:安装依赖 安装 Python 包: ```bash uv pip install -r requirements.txt ``` 在 Playwright 中安装浏览器。 ```bash playwright install --with-deps ``` 你也可以通过运行以下命令安装特定浏览器: ```bash playwright install chromium --with-deps ``` #### 步骤 4:配置环境 1. 复制示例环境文件: - Windows(命令提示符): ```bash copy .env.example .env ``` - macOS/Linux/Windows(PowerShell): ```bash cp .env.example .env ``` 2. 在你喜欢的文本编辑器中打开 `.env`,并添加 API 密钥及其他设置 #### 步骤 5:开始使用 web-ui 1. **运行 WebUI:** ```bash python webui.py --ip 127.0.0.1 --port 7788 ``` 2. **访问 WebUI:** 打开网页浏览器并访问 `http://127.0.0.1:7788`。 3. **使用你自己的浏览器(可选):** - 将 `BROWSER_PATH` 设置为浏览器的可执行文件路径,将 `BROWSER_USER_DATA` 设置为浏览器的用户数据目录。如需使用本地用户数据,请将 `BROWSER_USER_DATA` 留空。 - Windows ```env BROWSER_PATH="C:\Program Files\Google\Chrome\Application\chrome.exe" BROWSER_USER_DATA="C:\Users\YourUsername\AppData\Local\Google\Chrome\User Data" ``` > 注意:在 Windows 系统上,请将 `YourUsername` 替换为你的实际 Windows 用户名。 - Mac ```env BROWSER_PATH="/Applications/Google Chrome.app/Contents/MacOS/Google Chrome" BROWSER_USER_DATA="/Users/YourUsername/Library/Application Support/Google/Chrome" ``` - 关闭所有 Chrome 窗口 - 在非 Chrome 浏览器(如 Firefox 或 Edge)中打开 WebUI。这很重要,因为持久化浏览器上下文在运行智能体时会使用 Chrome 数据。 - 在浏览器设置中勾选「Use Own Browser」选项。 ### 方式二:Docker 安装 #### 前置要求 - 已安装 Docker 与 Docker Compose - [Docker Desktop](https://www.docker.com/products/docker-desktop/)(适用于 Windows/macOS) - [Docker Engine](https://docs.docker.com/engine/install/) 与 [Docker Compose](https://docs.docker.com/compose/install/)(适用于 Linux) #### 步骤 1:克隆仓库 ```bash git clone https://github.com/browser-use/web-ui.git cd web-ui ``` #### 步骤 2:配置环境 1. 复制示例环境文件: - Windows(命令提示符): ```bash copy .env.example .env ``` - macOS/Linux/Windows(PowerShell): ```bash cp .env.example .env ``` 2. 在你喜欢的文本编辑器中打开 `.env`,并添加 API 密钥及其他设置 #### 步骤 3:Docker 构建与运行 ```bash docker compose up --build ``` 对于 ARM64 系统(例如 Apple Silicon Mac),请运行以下命令: ```bash TARGETPLATFORM=linux/arm64 docker compose up --build ``` #### 步骤 4:开始使用 web-ui 与 vnc - Web-UI:在浏览器中打开 `http://localhost:7788` - VNC Viewer(用于观看浏览器交互):打开 `http://localhost:6080/vnc.html` - 默认 VNC 密码:"youvncpassword" - 可在 `.env` 文件中通过设置 `VNC_PASSWORD` 来修改 ## 更新日志 - [x] **2025/01/26:** 感谢 @vvincent1234。现在 browser-use-webui 可与 DeepSeek-r1 结合,进行深度思考! - [x] **2025/01/10:** 感谢 @casistack。现在我们提供 Docker 安装选项,并支持在任务之间保持浏览器打开。[视频教程演示](https://github.com/browser-use/web-ui/issues/1#issuecomment-2582511750). - [x] **2025/01/06:** 感谢 @richard-devbot。全新且设计精良的 WebUI 已发布。[视频教程演示](https://github.com/warmshao/browser-use-webui/issues/1#issuecomment-2573393113).