Sessão Ao Vivo
O recurso de visualização ao vivo do navegador de raspagem permite que você visualize e controle as sessões do navegador em tempo real. Especificamente, o recurso de visualização ao vivo inclui visualizar, clicar, digitar e rolar dentro de qualquer sessão de navegador ativa. Portanto, você pode facilmente monitorar processos automatizados, depurar scripts de automação e intervir manualmente nas sessões do navegador.
No Scrapeless, você pode visualizar ou controlar sessões de navegador em dois lugares: o playground e a interface de gerenciamento de sessão.
Como Usar
Criar uma Sessão do Navegador Scrapeless
Primeiro, você precisa criar uma sessão. Existem duas maneiras de fazer isso:
Criar uma Sessão via Playground
Criar uma Sessão via API
Você também pode usar nossa API para criar uma sessão. Consulte a documentação da API: Documentos da API do Navegador de Raspagem. Nosso recurso de sessão ajudará você a gerenciar essa sessão, incluindo a função de visualização ao vivo.
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();
})();Visualizar Sessão Ao Vivo
Na interface de gerenciamento de sessão do Scrapeless, você pode visualizar facilmente as sessões ao vivo. Existem também duas maneiras de visualizá-las:
Visualizar Sessão do Playground em Tempo Real
Após criar uma sessão no playground, você pode ver o navegador rodando em tempo real no lado direito.
Além da visualização em tempo real integrada ao Playground, você também pode abrir instantaneamente a sessão ao vivo em uma guia do navegador. Basta clicar no ícone ‘Abrir URL ao Vivo’ localizado no canto superior direito do painel de visualização em tempo real.
Visualizar Sessão da API em Tempo Real
Após criar uma sessão via API, você pode ver a lista de sessões em execução na página de sessão. Clicando nos detalhes da Ação, você pode visualizar a operação do navegador em tempo real. Aqui você pode optar por visualizar a sessão ao vivo no local ou copiar a URL da sessão para visualizar a sessão ao vivo. Fornecemos dois vídeos de operação para sua referência.
Exibição no Local
Obter URL Ao Vivo via site
Você pode copiar a URL Ao Vivo da lista de sessões em execução e colá-la em um navegador para acessá-la diretamente.
Obter URL Ao Vivo via API
Você pode obter a URL Ao Vivo chamando a API. No exemplo de código a seguir, primeiro buscamos todas as sessões em execução usando a API de Sessões em Execução e, em seguida, recuperamos a URL Ao Vivo de uma sessão específica usando a API de URL Ao Vivo:
const API_CONFIG = {
host: 'https://api.scrapeless.com',
headers: {
'x-api-token': 'API Key',
'Content-Type': 'application/json'
}
};
const requestOptions = {
method: 'GET',
headers: new Headers(API_CONFIG.headers)
};
async function fetchBrowserSessions() {
try {
// Fetch running browser sessions
const sessionResponse = await fetch(`${API_CONFIG.host}/browser/running`, requestOptions);
if (!sessionResponse.ok) {
throw new Error(`failed to fetch sessions: ${sessionResponse.status} ${sessionResponse.statusText}`);
}
const sessionResult = await sessionResponse.json();
// Process sessions data
const sessions = sessionResult.data;
if (!sessions || !Array.isArray(sessions) || sessions.length === 0) {
console.log("no active browser sessions found");
return;
}
// Get first session task ID
const taskId = sessions[0]?.taskId;
if (!taskId) {
console.log("task id not found in the session data");
return;
}
// Fetch live URL for the task
await fetchLiveUrl(taskId);
} catch (error) {
console.error("error fetching browser sessions:", error.message);
}
}
async function fetchLiveUrl(taskId) {
try {
const liveResponse = await fetch(`${API_CONFIG.host}/browser/${taskId}/live`, requestOptions);
if (!liveResponse.ok) {
throw new Error(`failed to fetch live url: ${liveResponse.status} ${liveResponse.statusText}`);
}
const liveResult = await liveResponse.json();
if (liveResult && liveResult.data) {
console.log(`taskId: ${taskId}`);
console.log(`liveUrl: ${liveResult.data}`);
} else {
console.log("no live url data available for this task");
}
} catch (error) {
console.error(`error fetching live url for task ${taskId}:`, error.message);
}
}
fetchBrowserSessions().then(r => { });Obter URL Ao Vivo via CDP
Para obter a URL Ao Vivo enquanto seu código está em execução, chame o comando cdp Agent.liveURL:
const { Puppeteer, log as Log } = require('@scrapeless-ai/sdk');
const logger = Log.withPrefix('puppeteer-example');
(async () => {
const browser = await Puppeteer.connect({
sessionName: 'sdk_test',
sessionTTL: 180,
proxyCountry: 'US',
sessionRecording: true,
defaultViewport: null
});
const page = await browser.newPage();
await page.goto('https://www.scrapeless.com');
const { error, liveURL } = await page.liveURL();
if (error) {
logger.error('Failed to get current page URL:', error);
} else {
logger.info('Current page URL:', liveURL);
}
await browser.close();
})();