Function Compute：使用 Browser Use Sandbox

如果任務只涉及網頁訪問、點擊、截圖、下載檔案和輕量結果提取，使用 Browser Use Sandbox 即可。如果瀏覽器產物還需要在同一會話中交給 Python/Node.js 做資料清洗、表格分析或報告產生，優先使用 AIO Sandbox。

適用情境

推薦流程

1. 按 browser 模板 構建業務模板，例如 my-browser-template。

2. 使用模板建立沙箱，並設定合理的逾時時間。

3. 通過 sandbox.get_host(3000) 擷取 browser 服務公網 host。

4. 輪詢 /health，確認 browser 服務已經就緒。

5. 通過 wss://<sandbox-host>/ws/automation 串連 Puppeteer、Playwright 或 BrowserUse。

6. 執行網頁訪問、點擊、輸入、截圖、PDF 產生或下載。

7. 將結構化結果、截圖、HTML、PDF 或下載檔案儲存到沙箱任務目錄。

8. 業務側讀取結果後銷毀沙箱。

準備本地環境

以下樣本使用 Node.js 和 Puppeteer Core。業務側不需要安裝完整瀏覽器，因為 Chromium/Chrome 已運行在 browser 沙箱中。

{
  "name": "browser-use-sandbox-demo",
  "version": "1.0.0",
  "type": "module",
  "dependencies": {
    "e2b": "^2.31.0",
    "puppeteer-core": "^24.0.0"
  }
}

Puppeteer 樣本

樣本流程如下：

1. 建立 my-browser-template 沙箱。

2. 等待 browser 服務 /health 返回 200。

3. 通過 CDP 串連雲端瀏覽器。

4. 開啟 https://example.com，提取頁面資訊並儲存截圖。

import { writeFile } from "node:fs/promises";
import puppeteer from "puppeteer-core";
import { Sandbox } from "e2b";

const TEMPLATE = process.env.E2B_BROWSER_TEMPLATE || "my-browser-template";

const BROWSER_PORT = 3000;
const TARGET_URL = "https://example.com";
const TASK_DIR = "/tmp/browser-task";
const SCREENSHOT_PATH = `${TASK_DIR}/browser-example.png`;

const sleep = (ms) => new Promise((resolve) => setTimeout(resolve, ms));

function toArrayBuffer(bytes) {
  return bytes.buffer.slice(bytes.byteOffset, bytes.byteOffset + bytes.byteLength);
}

async function waitUntilHealthy(sandbox, host, token, timeoutMs = 60_000) {
  const tokenHeader = token ? `-H 'X-Access-Token: ${token}' ` : "";
  const deadline = Date.now() + timeoutMs;

  while (Date.now() < deadline) {
    let result;
    try {
      result = await sandbox.commands.run(
        `curl -sS -o /dev/null -w '%{http_code}' -m 4 ` +
          tokenHeader +
          `https://${host}/health`,
        { timeoutMs: 10_000 },
      );
    } catch (error) {
      result = error;
    }

    const code = (result.stdout || "").trim();
    if (code === "200") {
      return;
    }
    await sleep(2_000);
  }

  throw new Error(`browser 服務在 ${timeoutMs}ms 內未就緒`);
}

let sandbox;

try {
  sandbox = await Sandbox.create(TEMPLATE, {
    timeoutMs: 300_000,
  });

  const host = sandbox.getHost(BROWSER_PORT);
  const token = sandbox.envdAccessToken;

  await sandbox.files.makeDir(TASK_DIR);
  await waitUntilHealthy(sandbox, host, token);

  const browser = await puppeteer.connect({
    browserWSEndpoint: `wss://${host}/ws/automation`,
    headers: token ? { "X-Access-Token": token } : {},
  });

  const page = await browser.newPage();
  await page.setViewport({ width: 1365, height: 768 });
  await page.goto(TARGET_URL, {
    waitUntil: "networkidle2",
    timeout: 60_000,
  });

  const screenshot = await page.screenshot({ fullPage: true });
  await sandbox.files.write(SCREENSHOT_PATH, toArrayBuffer(screenshot));
  await writeFile("browser-example.png", screenshot);

  const result = await page.evaluate(() => ({
    url: location.href,
    title: document.title,
    text: document.body.innerText.replace(/\s+/g, " ").slice(0, 500),
  }));

  await browser.close();
  console.log(result);
} finally {
  if (sandbox) {
    await sandbox.kill();
  }
}

BrowserUse 接入

對於以自然語言驅動網頁操作的 Agent，可以讓 BrowserUse 串連 browser 沙箱暴露的 CDP 地址。商務服務負責建立和銷毀沙箱；BrowserUse 只串連這個沙箱中的瀏覽器會話。

import asyncio
import os

from browser_use import Agent, BrowserSession, ChatOpenAI
from browser_use.browser import BrowserProfile
from e2b import Sandbox

BROWSER_PORT = 3000


async def main():
    browser_session = None
    sandbox = Sandbox.create(
        template=os.environ.get("E2B_BROWSER_TEMPLATE", "my-browser-template"),
        timeout=600,
    )

    try:
        host = sandbox.get_host(BROWSER_PORT)
        cdp_url = f"wss://{host}/ws/automation"

        browser_session = BrowserSession(
            cdp_url=cdp_url,
            browser_profile=BrowserProfile(
                headless=False,
                keep_alive=True,
            ),
            headers={"X-Access-Token": sandbox._envd_access_token},
        )

        agent = Agent(
            task="訪問 https://example.com，提取頁面標題並總結首屏本文",
            llm=ChatOpenAI(
                model=os.environ.get("QWEN_MODEL", "qwen-vl-max"),
                api_key=os.environ["DASHSCOPE_API_KEY"],
                base_url="https://dashscope.aliyuncs.com/compatible-mode/v1",
            ),
            browser_session=browser_session,
            use_vision=True,
        )
        result = await agent.run()
        print(result)
    finally:
        if browser_session is not None:
            await browser_session.stop()
        sandbox.kill()


if __name__ == "__main__":
    asyncio.run(main())

這類接入方式適合搜尋、比較、填寫表單、點擊確認和產生截圖證據。需要穩定產物時，讓 Agent 把關鍵結果寫成 JSON，同時保留截圖或 HTML 片段，便於人工複核和問題追蹤。

上線建議

• 把每個瀏覽器任務限制在明確的 URL 範圍內，必要時增加網域名稱白名單。

• 限制下載檔案類型、單檔案大小、總輸出大小和任務生命週期。

• 頁面內容可能包含 prompt injection。不要讓 Agent 未經校正地執行網頁中的指令。

• 登入態、Cookie、帳號憑證和業務 Token 應按任務隔離，通過運行時注入，不寫入模板。

• 記錄 URL、截圖、關鍵 DOM 摘要、工具調用軌跡和結果檔案路徑。

• 如果需要人工觀察或調試，可通過 wss://<sandbox-host>/ws/livestream 串連 noVNC。

• 如果任務需要在瀏覽器操作後繼續運行 Python/Node.js 指令碼處理資料，使用 AIO Sandbox。

相關功能

• browser 模板

• All-In-One 模板

• 後台命令

• 上傳和下載檔案

• AIO Sandbox