> ## Documentation Index
> Fetch the complete documentation index at: https://stagehand.readme-i18n.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Computer Use Agents

> 在 Stagehand 中只需一行代码即可集成 Anthropic 和 OpenAI 的计算机操作 API。

## 什么是计算机操作代理？

<iframe width="100%" height="400" src="https://www.youtube.com/embed/ODaHJzOyVCQ" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen />

你可能听说过 [Claude 计算机操作](https://www.anthropic.com/news/3-5-models-and-computer-use) 或 [OpenAI 的计算机操作代理](https://openai.com/index/computer-using-agent/)。

这些强大工具能将自然语言转换为计算机操作指令。但通常你需要自行编写代码将这些操作转换为 Playwright 命令。

Stagehand 不仅能执行计算机操作输出，还允许你通过一行代码在 OpenAI 和 Anthropic 模型之间热切换。

## 如何在 Stagehand 中使用计算机操作代理

Stagehand 让你只需一行代码即可使用计算机操作代理：

<Note>
  **重要提示！配置浏览器尺寸**

  计算机操作代理通常会返回屏幕点击的 XY 坐标，因此需要配置浏览器尺寸。

  如未指定，默认浏览器尺寸为 1024x768。你也可以通过 `browserbaseSessionCreateParams` 或 `localBrowserLaunchOptions` 选项配置浏览器尺寸。
</Note>

### 配置浏览器尺寸

不同环境下的浏览器配置方式不同：

<Tabs>
  <Tab title="BROWSERBASE">
    <CodeGroup>
      ```typescript TypeScript theme={null}
      import { Stagehand } from "@browserbasehq/stagehand";

      const stagehand = new Stagehand({
      	env: "BROWSERBASE",
        	apiKey: process.env.BROWSERBASE_API_KEY /* 用于身份验证的API密钥 */,
          projectId: process.env.BROWSERBASE_PROJECT_ID /* 项目标识符 */,
        
          browserbaseSessionCreateParams: {
            projectId: process.env.BROWSERBASE_PROJECT_ID!,
            browserSettings: {
      		blockAds: true,
              viewport: {
                width: 1024,
                height: 768,
              },
            },
        	},
      });

      await stagehand.init();
      ```

      ```python Python theme={null}
      import os
      from stagehand import Stagehand, StagehandConfig

      stagehand = Stagehand(StagehandConfig(
          env="BROWSERBASE",
          api_key=os.getenv("BROWSERBASE_API_KEY"),  # 用于身份验证的API密钥
          project_id=os.getenv("BROWSERBASE_PROJECT_ID"),  # 项目标识符
          
          browserbase_session_create_params={
              "projectId": os.getenv("BROWSERBASE_PROJECT_ID"),
              "browserSettings": {
                  "blockAds": True,
                  "viewport": {
                      "width": 1024,
                      "height": 768,
                  },
              },
          },
      ))

      await stagehand.init()
      ```
    </CodeGroup>
  </Tab>

  <Tab title="本地环境">
    <CodeGroup>
      ```typescript TypeScript theme={null}
      import { Stagehand } from "@browserbasehq/stagehand";

      const stagehand = new Stagehand({
        env: "LOCAL",
        localBrowserLaunchOptions: {
          headless: false,
          viewport: {
            width: 1024,
            height: 768,
          },
        }
      });

      await stagehand.init();
      ```

      ```python Python theme={null}
      from stagehand import Stagehand, StagehandConfig

      stagehand = Stagehand(StagehandConfig(
          env="LOCAL",
          local_browser_launch_options={
              "headless": False,
              "viewport": {
                  "width": 1024,
                  "height": 768,
              },
          }
      ))

      await stagehand.init()
      ```
    </CodeGroup>
  </Tab>
</Tabs>

### 控制您的计算机使用代理

调用代理的 `execute` 方法来为其分配任务。

<CodeGroup>
  ```typescript TypeScript theme={null}
  // Navigate to a website
  await stagehand.page.goto("https://www.google.com");

  const agent = stagehand.agent({
  	// You can use either OpenAI or Anthropic
  	provider: "openai",
  	// The model to use (claude-3-7-sonnet-latest for Anthropic)
  	model: "computer-use-preview",

  	// Customize the system prompt
  	instructions: `You are a helpful assistant that can use a web browser.
  	Do not ask follow up questions, the user will trust your judgement.`,

  	// Customize the API key
  	options: {
  		apiKey: process.env.OPENAI_API_KEY,
  	},
  });

  // Execute the agent
  await agent.execute("Apply for a library card at the San Francisco Public Library");
  ```

  ```python Python theme={null}
  import os

  # Navigate to a website
  await stagehand.page.goto("https://www.google.com")

  agent = stagehand.agent({
      # The model to use
      model="computer-use-preview",

      # Customize the system prompt
      instructions="You are a helpful assistant that can use a web browser. Do not ask follow up questions, the user will trust your judgement.",

      # Customize the API key
      options={
          "apiKey": os.getenv("OPENAI_API_KEY"),
      },
  })

  # Execute the agent
  await agent.execute("Apply for a library card at the San Francisco Public Library")
  ```
</CodeGroup>

您还可以通过以下方式定义代理可执行的最大步骤数：

<CodeGroup>
  ```typescript TypeScript theme={null}
  await agent.execute({
  	instructions: "Apply for a library card at the San Francisco Public Library",
  	maxSteps: 10,
  });
  ```

  ```python Python theme={null}
  await agent.execute(
  	"Apply for a library card at the San Francisco Public Library",
  	max_steps=10,
  )
  ```
</CodeGroup>