Reproducción de sesión

La reproducción de sesión proporciona una forma de inspeccionar las acciones ejecutadas y las solicitudes de red. Esta función permite reproducir sesiones grabadas, posibilitando un examen detallado página por página de las acciones ejecutadas y las solicitudes de red.

Ventajas

✅ Grabación en tiempo real – Registra automáticamente todas las solicitudes de red durante la ejecución del script

✅ Reproducción cuadro por cuadro: rastree con precisión las acciones del navegador

✅ Colaboración en equipo: comparta fácilmente grabaciones de sesiones para depuración en equipo

✅ Precisión milimétrica: inspeccione marcas de tiempo a nivel de evento para un ajuste avanzado de scripts

✅ Aislamiento seguro: los datos de la sesión están cifrados y protegidos mediante controles de acceso granulares

✅ Formato ligero: los archivos de grabación son un 90 % más pequeños que los archivos de video gracias a la comparación de DOM impulsada por rrweb

Cómo usar

Crear una sesión del navegador de Scrapeless

Tipo Uno: Crear una grabación de sesión mediante Playground

El entorno de pruebas tiene la grabación de sesiones habilitada por defecto mediante la configuración de parámetros.

También puede habilitar la grabación de sesiones en la configuración del entorno de pruebas. Sin embargo, tenga en cuenta que una vez que active la opción Usar configuración del entorno de pruebas , sobrescribirá los parámetros de conexión en el código del entorno de pruebas.

Después de la configuración, haga clic en “Ejecutar” para comenzar la grabación.

Tipo Dos: Crear una grabación de sesión mediante API

También puede integrar la funcionalidad de sesión en sus otros proyectos a través de la API, configurando los parámetros de sesión en su código.

Para habilitar la grabación, establezca el parámetro de consulta sessionRecording en true. El valor predeterminado es false. También puede usar el parámetro sessionName para asignar un nombre a su sesión, facilitando así su localización rápida en la lista de sesiones.

Para documentación más detallada, consulte: Documentación de la API de Agent Browser. El ejemplo de código es el siguiente:

const { Scrapeless } = require('@scrapeless-ai/sdk');
const puppeteer =require('puppeteer-core');
const client = new Scrapeless({ apiKey: 'API Key' });
 
// custom fingerprint
const fingerprint = {
    platform: 'Windows',
}
 
// Create browser session and get WebSocket endpoint
const { browserWSEndpoint } = client.browser.create({
    sessionName: 'sdk_test',
    sessionTTL: 180,
    proxyCountry: 'US',
    sessionRecording: true,
    fingerprint,
});
 
(async () => {
    const browser = await puppeteer.connect({browserWSEndpoint});
    const page = await browser.newPage();
 
    await page.goto('https://www.scrapeless.com');
    await new Promise(res => setTimeout(res, 3000));
 
    await page.goto('https://www.google.com');
    await new Promise(res => setTimeout(res, 3000));
 
    await page.goto('https://www.youtube.com');
    await new Promise(res => setTimeout(res, 3000));
 
    await browser.close();
})();

const puppeteer =require('puppeteer-core');
 
const token = 'API Key'
 
// custom fingerprint
const fingerprint = {
    platform: 'Windows',
}
 
const query = new URLSearchParams({
    sessionTTL: 180,
    sessionName: 'test_scraping', // session name
    sessionRecording: true, // enable web session recording
    proxyCountry: 'ANY',
    token: token,
    fingerprint: encodeURIComponent(JSON.stringify(fingerprint)),
});
 
const connectionURL = `wss://browser.scrapeless.com/api/v2/browser?${query.toString()}`;
 
(async () => {
    const browser = await puppeteer.connect({browserWSEndpoint: connectionURL});
    const page = await browser.newPage();
 
    await page.goto('https://www.scrapeless.com');
    await new Promise(res => setTimeout(res, 3000));
 
    await page.goto('https://www.google.com');
    await new Promise(res => setTimeout(res, 3000));
 
    await page.goto('https://www.youtube.com');
    await new Promise(res => setTimeout(res, 3000));
 
    await browser.close();
})();

const {chromium} =require('playwright');
 
const token = 'API Key'
 
// custom fingerprint
const fingerprint = {
    platform: 'Windows',
}
 
const query = new URLSearchParams({
    sessionTTL: 180,
    sessionName: 'test_scraping', // session name
    sessionRecording: true, // enable web session recording
    proxyCountry: 'ANY',
    token: token,
    fingerprint: encodeURIComponent(JSON.stringify(fingerprint)),
});
 
const connectionURL = `wss://browser.scrapeless.com/api/v2/browser?${query.toString()}`;
 
(async () => {
    const browser = await chromium.connectOverCDP(connectionURL);
    const page = await browser.newPage();
 
    await page.goto('https://www.scrapeless.com');
    await new Promise(res => setTimeout(res, 3000));
 
    await page.goto('https://www.google.com');
    await new Promise(res => setTimeout(res, 3000));
 
    await page.goto('https://www.youtube.com');
    await new Promise(res => setTimeout(res, 3000));
 
    await browser.close();
})();

Ver reproducción

Una vez que el navegador finalice su ejecución, la grabación de la sesión se guardará automáticamente. Haga clic en la lista de historial de sesiones para verla.

Limitaciones

💡 La grabación de sesiones se centra únicamente en la experiencia visual del usuario en el navegador y no incluye ninguna actividad subyacente del servidor, interacciones con bases de datos ni cambios técnicos que no se reflejen en la estructura de la página (DOM).

💡 Las animaciones complejas creadas con tecnologías como WebGL o canvas podrían no reproducirse de manera perfectamente fiel en las grabaciones de sesión.

Sesión en vivo Herramientas para desarrolladores