Browser Use 浏览器使用

lybic 沙箱中集成了 playwright 库，可以方便地允许你将lybic 沙箱作为 Browser Use 的后端来使用。

参考端口映射与转发, 你可以通过创建端口映射来暴露沙箱内的浏览器端口 (如 Chromium 的 CDP 端口)，然后使用 Playwright 或 Puppeteer 等工具连接到该端口进行浏览器自动化操作, 在此之上, 你可以结合AI框架(比如使用 Stagehand)，实现AI网页自动化操作。

Playwright 示例

在你的代码中，使用 chromium.connectOverCDP 方法连接到沙箱映射的 CDP URL(9222)，并携带 X-Gateway-Access-Token 请求头进行鉴权：

import { chromium } from 'playwright';

const browser = await chromium.connectOverCDP(
  'wss://<YOUR_GATEWAY_HOST_HERE>',
  {
    headers: {
      'X-Gateway-Access-Token': 'YOUR_GATEWAY_ACCESS_TOKEN_HERE' // 替换为你的网关 auth token
      // ... other headers if needed
    }
  }
);

const context = browser.contexts()[0];
const page = await context.newPage();

Puppeteer 通过 CDP 接管

Puppeteer 与 Playwright 类似，也可以通过 CDP 连接到沙箱映射的浏览器端口(9222)：

import puppeteer from 'puppeteer-core';

const browser = await puppeteer.connect({
  browserWSEndpoint: 'wss://<YOUR_GATEWAY_HOST_HERE>',
  headers: {
    'X-Gateway-Access-Token': 'YOUR_GATEWAY_ACCESS_TOKEN_HERE' // 替换为你的 auth token
    // ... other headers if needed
  }
});

const page = await browser.newPage();
await page.goto('https://example.com');

混合用法

同一个浏览器，不同 Context（推荐）：

const pwBrowser = await chromium.connectOverCDP(ws);
const pwContext = await pwBrowser.newContext();

// Puppeteer
const ppBrowser = await puppeteer.connect({ browserWSEndpoint: ws });
const ppContext = await ppBrowser.createIncognitoBrowserContext();

能力	Playwright	Puppeteer
自动化测试	✅	⚠
CDP 原始操作	⚠	✅
Trace / Video	✅	❌
DevTools 插件	❌	✅

只让 Puppeteer 用 CDP，不用 Page API：

const client = await page.context().newCDPSession(page);

await client.send('Network.enable');
await client.send('Page.enable');

client.on('Network.requestWillBeSent', e => {
  console.log(e.request.url);
});

Selenium Server / Grid 暴露 WebDriver URL

在 lybic 沙箱中，你也可以运行 Selenium Server / Grid 来暴露 WebDriver URL，从而允许远程使用 Selenium 进行浏览器自动化操作。

参考在沙箱上执行长期异步任务，在后台启动 Selenium Server：

java -jar /usr/local/binary/selenium-server.jar standalone # linux
java -jar C:\coding\binary\selenium-server.jar standalone # windows

参考端口映射与转发, 转发 Selenium Server 的端口 (默认 4444) ，然后你就可以通过 WebDriver URL 进行远程连接：

const { Builder } = require('selenium-webdriver');

(async () => {
    const driver = await new Builder()
        // 将请求token附加在URL中
        .usingServer('https://<YOUR_GATEWAY_HOST_HERE>?X-Gateway-Access-Token=YOUR_GATEWAY_ACCESS_TOKEN_HERE')
        .forBrowser('chrome')
        .build();

    await driver.get('https://example.com');

    // ... 其他操作

    await driver.quit();
    proxy.close();
})();

使用 Stagehand 连接到浏览器

Stagehand 是一个浏览器自动化框架，用于使用自然语言和代码控制网络浏览器。它通过将人工智能的强大功能与代码的精确性相结合，Stagehand 使网络自动化变得灵活、易于维护且真正可靠。

同样的，Stagehand连接到 lybic 沙箱中的浏览器也需要添加 X-Gateway-Access-Token Token验证，你可以将其附加在URL中。

你可以使用 Stagehand 连接到 lybic 沙箱中的浏览器，以下是一个示例代码，展示了如何通过代理连接到沙箱中的浏览器：

import { Stagehand } from "@browserbasehq/stagehand";

const stagehand = new Stagehand({
    env: "LOCAL",
    localBrowserLaunchOptions: {
        headless: false, // Show browser window
        devtools: true, // Open developer tools
        viewport: { width: 1280, height: 720 },
        cdpUrl:"wss://<YOUR_GATEWAY_HOST_HERE>?X-Gateway-Access-Token=YOUR_GATEWAY_ACCESS_TOKEN_HERE", // pass token in URL
        userDataDir: './chrome-user-data', // Persist browser data
        preserveUserDataDir: true, // Keep data after closing
        chromiumSandbox: false, // Disable sandbox (adds --no-sandbox)
        ignoreHTTPSErrors: true, // Ignore certificate errors
        locale: 'en-US', // Set browser language
        deviceScaleFactor: 1.0, // Display scaling
        downloadsPath: './downloads', // Download directory
        acceptDownloads: true, // Allow downloads
        connectTimeoutMs: 30000, // Connection timeout
    },
});

await stagehand.init();

Playwright 示例

Puppeteer 通过 CDP 接管

混合用法

Selenium Server / Grid 暴露 WebDriver URL

使用 Stagehand 连接到浏览器

本页内容