openclaw

关注公众号 jb51net

关闭
AI > openclaw >

OpenClaw接入Chrome浏览器完整配置流程学习

脚本之家

背景介绍

OpenClaw接入浏览器功能让AI助手能够直接控制和操作浏览器，实现网页自动化、信息抓取、页面分析等能力。通过浏览器接入，OpenClaw可以：

这在需要网页自动化、数据采集、测试验证等场景中非常有用。

接入配置说明

配置文件位置

所有浏览器配置都在 ~/.openclaw/openclaw.json 文件中进行设置。如果文件不存在，OpenClaw会在首次启动时自动创建。

核心配置项详解

基础配置

{
  "browser": {
    "enabled": true,
    "defaultProfile": "openclaw"
  }
}

浏览器路径配置

{
  "browser": {
    "executablePath": "/Applications/Google Chrome.app/Contents/MacOS/Google Chrome",
    "headless": false,
    "noSandbox": false
  }
}

配置文件详解

"profiles": {
  "openclaw": { 
    "cdpPort": 18800, 
    "color": "#FF4500" 
  },
  "work": { 
    "cdpPort": 18801, 
    "color": "#0066CC" 
  },
  "user": {
    "driver": "existing-session",
    "attachOnly": true,
    "color": "#00AA00"
  }
}

安全策略配置

"ssrfPolicy": {
  "dangerouslyAllowPrivateNetwork": true,
  "hostnameAllowlist": ["*.example.com", "example.com"]
}

主要浏览器模式详解

  1. openclaw模式（默认）：

    • 创建独立的浏览器实例，完全隔离用户数据
    • 适合自动化测试、数据采集等场景
    • 不会影响用户的正常浏览器使用

  2. user模式：

    • 连接到现有的已登录Chrome会话
    • 可以访问用户的登录状态、书签、扩展等
    • 需要用户手动批准连接请求

  3. chrome-relay模式：

    • 通过Chrome扩展程序控制现有标签页
    • 需要安装OpenClaw浏览器扩展
    • 用户点击扩展图标来选择要控制的标签页

  4. 远程模式：

    • 连接远程CDP服务，如Browserless、Browserbase等
    • 适合云端自动化、大规模数据采集
    • 需要配置cdpUrl指向远程服务地址

完整配置示例

基础配置

这是最基本且安全的配置，适合大多数用户：

配置文件位置：~/.openclaw/openclaw.json

{
  "browser": {
    "enabled": true,
    "defaultProfile": "openclaw",
    "headless": false,
    "noSandbox": false,
    "executablePath": "",
    "profiles": {
      "openclaw": {
        "cdpPort": 18800,
        "color": "#FF4500"
      }
    },
    "ssrfPolicy": {
      "dangerouslyAllowPrivateNetwork": false,
      "hostnameAllowlist": []
    }
  }
}

使用说明：

  1. 将上述配置复制到 ~/.openclaw/openclaw.json 文件中
  2. 如果文件不存在，会自动创建
  3. 重启OpenClaw Gateway使配置生效
  4. 使用默认命令：openclaw browser status 验证配置

高级配置

适合需要多种浏览器环境的进阶用户：

{
  "browser": {
    "enabled": true,
    "defaultProfile": "openclaw",
    "headless": false,
    "noSandbox": false,
    "executablePath": "",
    "profiles": {
      "openclaw": {
        "cdpPort": 18800,
        "color": "#FF4500"
      },
      "work": {
        "cdpPort": 18801,
        "color": "#0066CC"
      },
      "user": {
        "driver": "existing-session",
        "attachOnly": true,
        "color": "#00AA00"
      },
      "chrome-relay": {
        "driver": "extension",
        "cdpUrl": "http://127.0.0.1:18792",
        "color": "#00AA00"
      }
    },
    "ssrfPolicy": {
      "dangerouslyAllowPrivateNetwork": false,
      "hostnameAllowlist": ["*.baidu.com", "*.google.com", "*.github.com"]
    }
  }
}

配置说明：

远程浏览器配置

连接云端浏览器服务（需要API密钥）：

{
  "browser": {
    "enabled": true,
    "defaultProfile": "browserless",
    "remoteCdpTimeoutMs": 2000,
    "remoteCdpHandshakeTimeoutMs": 4000,
    "profiles": {
      "browserless": {
        "cdpUrl": "https://production-sfo.browserless.io?token=YOUR_API_KEY",
        "color": "#00AA00"
      },
      "browserbase": {
        "cdpUrl": "wss://connect.browserbase.com?apiKey=YOUR_API_KEY",
        "color": "#F97316"
      }
    },
    "ssrfPolicy": {
      "dangerouslyAllowPrivateNetwork": false
    }
  }
}

使用前准备：

  1. 注册Browserless或Browserbase账户
  2. 获取API密钥
  3. 替换配置中的YOUR_API_KEY为实际密钥
  4. 建议将密钥存储在环境变量中，避免硬编码

平台特定配置

macOS专用配置

{
  "browser": {
    "enabled": true,
    "executablePath": "/Applications/Google Chrome.app/Contents/MacOS/Google Chrome",
    "profiles": {
      "openclaw": {
        "cdpPort": 18800,
        "color": "#FF4500"
      }
    }
  }
}

Linux专用配置

{
  "browser": {
    "enabled": true,
    "executablePath": "/usr/bin/google-chrome",
    "noSandbox": true,
    "profiles": {
      "openclaw": {
        "cdpPort": 18800,
        "color": "#FF4500"
      }
    }
  }
}

Windows专用配置

{
  "browser": {
    "enabled": true,
    "executablePath": "C:\\Program Files\\Google\\Chrome\\Application\\chrome.exe",
    "profiles": {
      "openclaw": {
        "cdpPort": 18800,
        "color": "#FF4500"
      }
    }
  }
}

配置验证命令

配置完成后，使用以下命令验证：

# 检查浏览器状态
openclaw browser status
# 启动浏览器
openclaw browser start
# 列出所有标签页
openclaw browser tabs
# 打开测试网页
openclaw browser open https://example.com
# 获取截图验证
openclaw browser screenshot

效果演示

案例：AI助手自动打开网页并截图

以下演示展示AI助手如何使用OpenClaw浏览器工具自动操作网页：

场景：AI助手需要打开百度首页，搜索"OpenClaw"，然后截图保存结果。

AI助手的操作流程：

  1. 打开百度首页：

    使用浏览器工具打开 https://www.baidu.com

  2. 获取页面快照以了解结构：

    获取页面快照，了解搜索框位置

  3. 在搜索框中输入关键词：

    在搜索框中输入"OpenClaw"

  4. 点击搜索按钮：

    点击搜索按钮执行搜索

  5. 等待搜索结果加载：

    等待页面加载完成

  6. 截图保存搜索结果：

    对搜索结果页面进行截图

操作结果截图：


上图展示了AI助手成功完成整个自动化流程：打开百度首页、在搜索框中输入"OpenClaw"关键词、点击搜索按钮执行搜索，并成功获取搜索结果页面的完整过程。页面显示了与OpenClaw相关的搜索结果，证明了浏览器自动化功能的有效性。

技术实现细节：

注意事项

常见错误及解决方案

  1. 浏览器未启动：

    • 错误：“Browser disabled”
    • 原因：配置文件中的browser.enabled设置为false
    • 解决：编辑~/.openclaw/openclaw.json，将enabled改为true，然后重启Gateway

  2. 端口冲突：

    • 错误："Port already in use"或连接失败
    • 原因：cdpPort被其他程序占用
    • 解决：修改配置文件中的cdpPort为其他值（如18801、18802等）

  3. Playwright缺失：

    • 错误：“Playwright is not available in this gateway build”
    • 原因：未安装完整版Playwright，只安装了playwright-core
    • 解决：运行npm install playwright安装完整版本，然后重启Gateway

  4. Chrome版本不兼容：

    • 错误：连接超时或协议错误
    • 原因：Chrome版本过低或远程调试未启用
    • 解决：
      • 升级Chrome到144+版本
      • 在Chrome中访问chrome://inspect/#remote-debugging启用远程调试
      • 确保用户手动批准连接请求

  5. 权限问题：

    • 错误：“Unauthorized"或"Access denied”
    • 原因：Gateway认证配置阻止了浏览器访问
    • 解决：检查Gateway的认证设置，确保有正确的访问令牌或密码

安全注意事项

  1. 网络隔离：将Gateway和节点主机保持在私有网络内，避免公网暴露
  2. 令牌管理：远程CDP URL和API令牌视为机密，使用环境变量或密钥管理器
  3. 配置文件保护：避免在openclaw.json中直接存储敏感信息
  4. 最小权限原则：只授予必要的网络访问权限，使用hostnameAllowlist限制域名

参考资料

  1. OpenClaw浏览器工具官方文档
  2. Chrome DevTools MCP官方指南
  3. Browserless云端浏览器服务
  4. Browserbase云端浏览器平台
  5. OpenClaw安装与配置指南

到此这篇关于OpenClaw接入Chrome浏览器的文章就介绍到这了,更多相关OpenClaw接入Chrome浏览器内容请搜索脚本之家以前的文章或继续浏览下面的相关文章，希望大家以后多多支持脚本之家！