PRODUCTION RECIPE · SAME-ORIGIN, SIGNED-IN REQUESTS

In-Page Authenticated API Execution & SSR Hydration Harvesting

How AI agents query protected internal REST and GraphQL endpoints and extract hydration state directly through live Chrome execution contexts.

Quick Answer (TL;DR) External HTTP scrapers get blocked by CORS, Cloudflare TLS fingerprinting, and HttpOnly session cookies. WebBridge solves this by executing fetch() directly inside the browser's live page context via browser_evaluate. Chrome automatically supplies ambient session cookies, CSRF nonces, and Origin headers, allowing agents to harvest clean JSON payloads with zero API keys.

1. The In-Tab Authenticated Fetch Pattern

Rather than writing brittle Node.js scripts that attempt to parse HTML tables, navigate to the target domain in Chrome and invoke the platform's internal API directly:

// Executes inside browser_evaluate
(async () => {
  const res = await fetch('/api/v2/user/billing/invoices', {
    method: 'GET',
    headers: { 'Accept': 'application/json' }
  });
  if (!res.ok) throw new Error(`HTTP ${res.status}`);
  return await res.json();
})()

Because the request originates from within the browser window on the origin domain, the request is not subject to cross-origin resource sharing (CORS) rejections, and all credentials (including SameSite and HttpOnly cookies) are automatically attached by the browser network stack.

2. Single-Page App (SPA) Hydration Extraction

Modern applications built with Next.js, Nuxt, or Redux embed complete server-rendered state trees in the initial page payload. You can read these directly with zero network requests:

Next.js Hydration State:

// Executes inside browser_evaluate
(() => {
  return window.__NEXT_DATA__?.props?.pageProps || null;
})()

Nuxt / Redux Store State:

// Executes inside browser_evaluate
(() => {
  return window.__INITIAL_STATE__ || window.__NUXT__ || null;
})()

3. Structured Schema.org JSON-LD Trees

Extract all structured entity data (products, reviews, organizations) across the page without parsing DOM text:

// Executes inside browser_evaluate
(() => {
  return Array.from(document.querySelectorAll('script[type="application/ld+json"]'))
    .map(s => {
      try { return JSON.parse(s.textContent); }
      catch (e) { return null; }
    })
    .filter(Boolean);
})()