ASD

Derive Client

Reverse-engineerea la API interna de un sitio grabando el tráfico del navegador en un HAR, y genera un cliente o CLI standalone que llama a los endpoints sin necesitar navegador después.

Oficial

Reemplaza a: Manejar el navegador cada vez para automatizar el mismo sitio

Solicitabash(agent-browser:*)bash(npx agent-browser:*)
Estrellas
40.5k

en todo el repo

Actividad
57

0–100, la ruta de este skill

Actualizado
hace 26 días

último commit aquí

Commits
1

últimos 90 días

Contexto
1.3k tok

121 tok en reposo

Paquete
1 archivo

5 KB

Instalar

Funciona con cualquier agente que lea SKILL.md

npx -y skills add vercel-labs/agent-browser --skill derive-client --agent claude-code

Se instala solo en este repositorio.

Qué hace

  • Grabas el tráfico de red del navegador en un archivo HAR mientras usas un sitio
  • Identifica los endpoints reales de API entre el ruido de analítica e infraestructura
  • Extrae esquemas de request/response y material de autenticación del HAR
  • Genera un cliente o CLI standalone con una función por flujo grabado
  • Verifica cada endpoint generado contra la API real antes de terminar

Úsalo cuando

  • Te piden "derive a client", "build a CLI for <site>", "reverse engineer this site's API" o "record network requests"
  • El mismo sitio se va a automatizar repetidamente y llamadas HTTP directas serían mejores que manejar el navegador cada vez

No lo uses cuando

    Qué lo activa

    Di cualquiera de estas frases y el agente debería cargar este skill.

    • Deriva un cliente de API para este sitio a partir de una grabación HAR
    • Construye una CLI para este sitio usando su API interna
    • Convierte este sitio en una API reutilizable sin navegador
    • Reverse-engineer la API interna de este sitio web

    SKILL.md

    En inglés

    Derive an API client from a recorded session

    Driving a browser is the right tool for the first visit and the wrong tool for the hundredth. This skill records a site's network traffic once while you use it, then turns the captured requests into a standalone client (script, CLI, or library) that talks to the site's internal API directly.

    The recording alone contains everything needed: agent-browser embeds text response bodies (JSON/HTML/JS) in the HAR by default, so endpoint shapes can be studied offline after the browser is closed.

    Workflow

    1. Record     Start HAR capture, drive the flows you want in the client
    2. Identify   Find the real API endpoints among the noise
    3. Extract    Pull request shapes, response schemas, and auth material
    4. Generate   Write the client, one function per flow
    5. Verify     Call every endpoint for real before declaring done
    

    1. Record

    agent-browser network har start          # embeds text response bodies by default
    # ... drive the site: search, open a detail page, paginate, etc. ...
    agent-browser network har stop /tmp/site.har
    
    • Exercise every flow the client should support, and run each one at least twice with different inputs (two search terms, two detail pages). Diffing the recorded URLs reveals which parts are parameters.
    • If the site needs login, log in before starting the HAR so credentials don't land in the recording unnecessarily. The session cookies are exported separately in step 3.
    • --content all embeds binary bodies too (base64); --content none disables embedding. Per-body cap is 2 MB.

    While the session is still open, agent-browser network requests and network request <id> give the same data interactively — but only the HAR survives navigation and browser close, so prefer it for anything multi-page.

    2. Identify endpoints

    Query the HAR with jq:

    # All JSON API calls: method, URL, status
    jq -r '.log.entries[]
      | select(.response.content.mimeType | test("json"))
      | "\(.request.method) \(.response.status) \(.request.url)"' /tmp/site.har
    

    Ignore analytics and infrastructure noise: telemetry endpoints (/collect, /track, /beacon, /log), third-party domains (google-analytics, segment, sentry, datadog, intercom, hotjar), and static assets. The real API is usually first-party, JSON, and correlates with the actions you performed.

    3. Extract shapes and auth

    # Full detail for one endpoint: request headers, POST body, response body
    jq '.log.entries[] | select(.request.url | test("api/search"))
      | {request: {method: .request.method, headers: .request.headers,
         postData: .request.postData.text},
         response: .response.content.text}' /tmp/site.har
    
    • Response schema: read .response.content.text — this is the real payload, use it to derive types.
    • Auth: compare request headers across endpoints. Look for authorization, cookie, x-csrf-token, x-api-key, and site-specific x-* headers. Replay only the ones that matter — test by omission in step 5.
    • Cookies: export the live session with agent-browser cookies get --json > cookies.json for the client to load at runtime. Never hardcode cookie values into generated source.

    4. Generate the client

    • One function per recorded flow (search(query), getItem(id)), typed from the observed response bodies.
    • Auth material (cookies, bearer tokens) loads from a file or environment variable, with a clear error telling the user to re-run the browser login when it expires.
    • Reproduce the headers the API actually requires — some sites 403 without a matching user-agent, referer, or x-requested-with.
    • Keep pagination, sort, and filter parameters that appeared in the recorded query strings as function options.

    5. Verify

    Call every generated function against the live API and compare the response shape with the recording. Common failures:

    Symptom Cause Fix
    401/403 Expired or missing session Re-login via agent-browser, re-export cookies
    403/419 on writes CSRF token is per-session or per-form Fetch the token endpoint first, or keep that flow browser-driven
    Works then breaks Signed/expiring request params Fall back to the browser for that step; derive the rest
    Different shape than HAR A/B tests or geo-dependent responses Re-record and treat the union as optional fields

    Caveats

    • Internal APIs are unversioned and change without notice — keep the HAR so the client can be re-derived.
    • Respect the site's terms of service and rate limits; add delays for bulk fetching.
    • HAR files contain live session credentials (cookies, tokens, POST bodies). Treat them like secrets: keep them out of version control and delete them when done.

    Reproducido de vercel-labs/agent-browser bajo licencia Apache-2.0. Leer esta página en markdown.

    Archivos

    1 archivo en el paquete. Solo se lee SKILL.md al activarse — las referencias se cargan si el skill decide que las necesita.

    Antes de instalar

    Requiere agent-browser (vía Bash(agent-browser:*) o npx agent-browser) y jq para consultar el HAR generado.

    Necesita en el PATH:jq

    Detalles

    Categoría
    Automatización
    Licencia
    Apache-2.0
    Recursos incluidos
    Solo SKILL.md
    Código fuente
    Ver SKILL.md

    Más de vercel-labs/agent-browser

    Este repo incluye 8 skills. Si instalas uno, normalmente ya tienes los demás.

    Core

    40.5k

    Guía central de uso de agent-browser: snapshots con refs, navegación, interacción con elementos, extracción de datos, capturas, pestañas, formularios, auth, esperas y sesiones paralelas.

    Costo de contexto al activarse
    7.4k tok
    Tamaño del paquete
    14 archivos
    Última actualización
    hace 3 días
    Oficialherramientas desarrollo

    CLI de automatización de navegador para agentes de IA: navega, rellena formularios, hace clic, captura pantallas, extrae datos, prueba apps y automatiza Electron o Slack.

    Costo de contexto al activarse
    841 tok
    Tamaño del paquete
    1 archivo
    Última actualización
    hace 26 días
    Oficialtesting qa

    Ejecuta agent-browser + Chrome dentro de microVMs de Vercel Sandbox para automatización de navegador desde cualquier app desplegada en Vercel.

    Costo de contexto al activarse
    1.9k tok
    Tamaño del paquete
    1 archivo
    Última actualización
    el mes pasado
    Oficialautomatizacion

    Automatiza apps de escritorio Electron (VS Code, Slack, Discord, Figma, Notion, Spotify, etc.) usando agent-browser vía Chrome DevTools Protocol.

    Costo de contexto al activarse
    1.7k tok
    Tamaño del paquete
    1 archivo
    Última actualización
    hace 4 meses
    Oficialherramientas desarrollo

    Dogfood

    40.5k

    Explora y prueba sistemáticamente una aplicación web para encontrar bugs y problemas de UX, generando un reporte con capturas paso a paso, videos de reproducción y pasos detallados por cada hallazgo.

    Costo de contexto al activarse
    2.7k tok
    Tamaño del paquete
    3 archivos
    Última actualización
    hace 4 meses
    Oficialtesting qa

    Ejecuta agent-browser en navegadores en la nube de AWS Bedrock AgentCore; úsalo para automatización de navegador respaldada por infraestructura AWS con credenciales AWS.

    Costo de contexto al activarse
    1k tok
    Tamaño del paquete
    1 archivo
    Última actualización
    hace 4 meses
    Oficialdevops infraestructura

    Skills relacionados

    Úsalo cuando enfrentes 2 o más tareas independientes que puedan trabajarse sin estado compartido ni dependencias secuenciales.

    Costo de contexto al activarse
    1.5k tok
    Tamaño del paquete
    1 archivo
    Última actualización
    el mes pasado
    automatizacion

    Úsalo al ejecutar planes de implementación con tareas independientes dentro de la sesión actual.

    Costo de contexto al activarse
    8.1k tok
    Tamaño del paquete
    7 archivos
    Última actualización
    anteayer
    automatizacion

    Interrógame sobre las specs de los workflows que quiero construir, dentro de este workspace.

    Costo de contexto al activarse
    640 tok
    Tamaño del paquete
    2 archivos
    Última actualización
    hace 16 días
    automatizacion