Skip to main content

Documentation Index

Fetch the complete documentation index at: https://docs.anchorbrowser.io/llms.txt

Use this file to discover all available pages before exploring further.

This page is a quick start using our official SDK. For complete documentation and advanced usage examples, visit our package repositories:
1

Fetch API Key

In Anchor UI, copy your API key
2

Install the SDK

npm install anchorbrowser
3

Initialize the SDK

Set up the Anchor Browser client with your API key:
import AnchorClient from "anchorbrowser";

const anchorClient = new AnchorClient({
  apiKey: process.env.ANCHOR_API_KEY,
});
4

AI Agent Browser Automation

Use AI agents to automate browser tasks with natural language commands:
(async () => {
  // Simple navigation task
  const result = await anchorClient.agent.task(
    "go to news.ycombinator.com and get the title of the first story"
  );
  console.log("Task result:", result);
  
  // Task with execution step monitoring
  const executionStepLogs = [];
  const navigationResult = await anchorClient.agent.task(
    "go to news.ycombinator.com and get the title of the first story",
    {
      taskOptions: {
        onAgentStep: (executionStep) => {
          console.log("Agent step:", executionStep);
          executionStepLogs.push(executionStep);
        },
      },
    }
  );
  console.log("Navigation result:", navigationResult)
  console.log("Execution step logs count:", executionStepLogs.length)
  })();

​
Additional Usage

​
Structured Data Extraction

Extract structured data from webpages using schemas: 
import { z } from "zod";

(async () => {

  // Define your data schema
  const extractionSchema = z.object({
    title: z.string(),
    description: z.string(),
    price: z.string().optional(),
  });
  
  // Extract structured data from product page
  const structuredResult = await anchorClient.agent.task(
    "Extract the product title, description, and price from this Amazon product page",
    {
      taskOptions: {
        outputSchema: z.toJSONSchema(extractionSchema),
        url: "https://www.amazon.com/dp/B0D7D9N7X3",
      },
    }
  );
  
  // Validate the result
  const validatedData = extractionSchema.safeParse(structuredResult);
  if (validatedData.success) {
    console.log("Product title:", validatedData.data.title);
    console.log("Description:", validatedData.data.description);
    console.log("Price:", validatedData.data.price);
  } else {
    console.error("Validation failed:", validatedData.error);
  }
})();

​
Screenshots

Capture screenshots of your current session view. 
import fs from "fs/promises";

(async () => {
  // Create a session for screenshot
  const screenshotSession = await anchorClient.sessions.create();
  const screenshotBrowser = await anchorClient.browser.connect(screenshotSession.data.id);
  const screenshotPage = screenshotBrowser.contexts()[0].pages()[0];
  await screenshotPage.goto("https://example.com");

  // Capture screenshot from the session
  const screenshot = await anchorClient.tools.screenshotWebpage({
    sessionId: screenshotSession.data.id,
  });

  // Get screenshot data
  const buffer = await screenshot.arrayBuffer();
  console.log("Screenshot captured, size:", buffer.byteLength);

  // Save screenshot to file
  await fs.writeFile("screenshot.png", Buffer.from(buffer));
  console.log("Screenshot saved as screenshot.png");
})();

​
Advanced Configuration

Configure browser sessions with proxies, timeouts, and other options: 
// Create session with advanced configuration
const sessionConfig = {
  session: {
    recording: {active: false}, // Disable session recording
    proxy: {
      active: true,
      country_code: "us",
    },
    timeout: {
      max_duration: 5, // 5 minutes
      idle_timeout: 1, // 1 minute
    }
  },
};

const configuredSession = await anchorClient.sessions.create(sessionConfig);
const result = await anchorClient.agent.task(
  "What is my IP address and where am I?",
  {
  sessionId: configuredSession.data.id,
});
console.log(result);

​
From SDK to Browser: Run Extra Playwright Code

​
Standalone Browser Creation

Create a standalone browser instance: 
(async () => {
// Create standalone browser
const standaloneBrowser = await anchorClient.browser.create();
const page = standaloneBrowser.contexts()[0].pages()[0];
await page.goto("https://httpbin.org/ip");

console.log("Current URL:", page.url());

// Disconnect (session keeps running)
standaloneBrowser.close();
})();

​
Browser Task with Session Control

Use AI agents with direct browser control: 
// Browser task with session control
const browserTask = await anchorClient.agent.browserTask(
  "go to github.com/trending and find the most popular JavaScript repository"
);

console.log("Session ID:", browserTask.sessionId);

// Access the Playwright browser instance
const playwrightBrowser = browserTask.playwrightBrowser;
const page = playwrightBrowser.contexts()[0].pages()[0];

// Direct Playwright manipulation
await page.goto("https://stackoverflow.com/");
console.log("Current URL:", page.url());

// Wait for task completion
const taskResult = await browserTask.taskResultPromise;
console.log("Final result:", taskResult);

browserTask.playwrightBrowser.close();

​
Manual Session Management

Create and manage browser sessions manually: 
// Create session and connect it later
const sessionResponse = await anchorClient.sessions.create();
const sessionId = sessionResponse.data.id;

const browser = await anchorClient.browser.connect(sessionId);
const context = browser.contexts()[0];
const page = context.pages()[0];
await page.goto("https://reddit.com/r/programming");

console.log("Current URL:", page.url());

browser.close();

​
Key SDK Benefits

The Anchor Browser SDK provides several advantages over direct API usage:
  • AI Agent Integration: Use natural language to automate complex browser tasks
  • Structured Data Extraction: Define schemas and extract data in a predictable format
  • Seamless Playwright Integration: Full access to Playwright’s powerful browser automation capabilities
  • Session Management: Easy creation and management of persistent browser sessions
  • Built-in Tools: Screenshot capture, proxy management, and more
  • Type Safety: Full TypeScript support with proper type definitions

​
Next Steps