Renderização de JavaScript

Aprenda a usar um parâmetro render na Web Scraper API para que você possa raspar páginas dinâmicas de forma eficiente.

Se a página que você deseja rastrear requer JavaScript para carregar dinamicamente todos os dados necessários no DOM, você pode incluir um render parâmetro em suas requisições em vez de configurar e usar manualmente um navegador headless. Requisições com este parâmetro serão totalmente renderizadas, e os dados serão armazenados em um arquivo HTML ou em uma captura de tela PNG, dependendo do parâmetro especificado.

HTML

Defina o render parâmetro para html para obter a saída bruta da página renderizada.

PNG (Captura de tela)

Defina o render parâmetro para png para obter uma captura de tela codificada em Base64 da página renderizada.

Se você quiser rastrear uma imagem e baixá-la, consulte esta seção.

Exemplo de requisição

curl --user "user:pass" \
'https://realtime.oxylabs.io/v1/queries' \
-H "Content-Type: application/json" \
-d '{"source": "universal", "url": "https://www.example.com", "render": "html"}'

import requests
from pprint import pprint

# Estruturar payload.
payload = {
    'source': 'universal',
    'url': 'https://www.example.com',
    'render': 'html',
}

# Obter resposta.
response = requests.request(
    'POST',
    'https://realtime.oxylabs.io/v1/queries',
    auth=('user', 'pass1'),
    json=payload,
)

# Em vez de uma resposta com status do job e URL de resultados, isto retornará o
# response JSON com o resultado.
pprint(response.json())

<?php

$params = [
    'source' => 'universal',
    'url' => 'https://www.example.com',
    'render' => 'html',
];

$ch = curl_init();

curl_setopt($ch, CURLOPT_URL, "https://realtime.oxylabs.io/v1/queries");
curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
curl_setopt($ch, CURLOPT_POSTFIELDS, json_encode($params));
curl_setopt($ch, CURLOPT_POST, 1);
curl_setopt($ch, CURLOPT_USERPWD, "user" . ":" . "pass1");

$headers = array();
$headers[] = "Content-Type: application/json";
curl_setopt($ch, CURLOPT_HTTPHEADER, $headers);

$result = curl_exec($ch);
echo $result;

if (curl_errno($ch)) {
    echo 'Error:' . curl_error($ch);
}
curl_close($ch);

using System;
using System.Collections.Generic;
using System.Net.Http;
using System.Net.Http.Json;
using System.Threading.Tasks;

namespace OxyApi
{
    class Program
    {
        static async Task Main()
        {
            const string Username = "YOUR_USERNAME";
            const string Password = "YOUR_PASSWORD";

            var parameters = new Dictionary<string, string>()
            {
                { "source", "universal" },
                { "url", "https://www.example.com" },
                { "render" : "html" },
            };


            var client = new HttpClient();

            Uri baseUri = new Uri("https://realtime.oxylabs.io");
            client.BaseAddress = baseUri;

            var requestMessage = new HttpRequestMessage(HttpMethod.Post, "/v1/queries");
            requestMessage.Content = JsonContent.Create(parameters);

            var authenticationString = $"{Username}:{Password}";
            var base64EncodedAuthenticationString = Convert.ToBase64String(System.Text.ASCIIEncoding.UTF8.GetBytes(authenticationString));
            requestMessage.Headers.Add("Authorization", "Basic " + base64EncodedAuthenticationString);

            var response = await client.SendAsync(requestMessage);
            var contents = await response.Content.ReadAsStringAsync();

            Console.WriteLine(contents);
        }
    }
}

package main

import (
	"bytes"
	"encoding/json"
	"fmt"
	"io/ioutil"
	"net/http"
)

func main() {
	const Username = "YOUR_USERNAME"
	const Password = "YOUR_PASSWORD"

	payload := map[string]string{
		"source": "universal",
		"url": "https://www.example.com",
        	"render": "html",
	}

	jsonValue, _ := json.Marshal(payload)

	client := &http.Client{}
	request, _ := http.NewRequest("POST",
		"https://realtime.oxylabs.io/v1/queries",
		bytes.NewBuffer(jsonValue),
	)

	request.SetBasicAuth(Username, Password)
	response, _ := client.Do(request)

	responseText, _ := ioutil.ReadAll(response.Body)
	fmt.Println(string(responseText))
}

package org.example;

import okhttp3.*;
import org.json.JSONObject;

public class Main implements Runnable {
    private static final String AUTHORIZATION_HEADER = "Authorization";
    public static final String USERNAME = "YOUR_USERNAME";
    public static final String PASSWORD = "YOUR_PASSWORD";

    public void run() {
        JSONObject jsonObject = new JSONObject();
        jsonObject.put("source", "universal");
        jsonObject.put("url", "https://www.example.com");
        jsonObject.put("render": "html");

        Authenticator authenticator = (route, response) -> {
            String credential = Credentials.basic(USERNAME, PASSWORD);

            return response
                    .request()
                    .newBuilder()
                    .header(AUTHORIZATION_HEADER, credential)
                    .build();
        };

        var client = new OkHttpClient.Builder()
                .authenticator(authenticator)
                .build();

        var mediaType = MediaType.parse("application/json; charset=utf-8");
        var body = RequestBody.create(jsonObject.toString(), mediaType);
        var request = new Request.Builder()
                .url("https://realtime.oxylabs.io/v1/queries")
                .post(body)
                .build();

        try (var response = client.newCall(request).execute()) {
            assert response.body() != null;
            System.out.println(response.body().string());
        } catch (Exception exception) {
            System.out.println("Error: " + exception.getMessage());
        }

        System.exit(0);
    }

    public static void main(String[] args) {
        new Thread(new Main()).start();
    }
}

import fetch from 'node-fetch';

const username = 'YOUR_USERNAME';
const password = 'YOUR_PASSWORD';
const body = {
  'source': 'universal',
  'url': 'https://www.example.com',
  'render': 'html'
};
const response = await fetch('https://realtime.oxylabs.io/v1/queries', {
  method: 'post',
  body: JSON.stringify(body),
  headers: {
    'Content-Type': 'application/json',
    'Authorization': 'Basic ' + Buffer.from(`${username}:${password}`).toString('base64'),
  }
});

console.log(await response.json());

# Toda a string que você enviar precisa estar codificada em URL.

https://realtime.oxylabs.io/v1/queries?source=universal&url=https%3A%2F%2Fwww.example.com%2F&render=html&access_token=12345abcde

A renderização JavaScript leva mais tempo para rastrear a página. Defina o timeout no lado do cliente para 180 segundos se estiver usando os métodos de integração Realtime ou Proxy Endpoint.

Para garantir o menor consumo de tráfego, nosso sistema não carrega recursos desnecessários durante a renderização da página.

Forçando renderização em páginas específicas

Para um rastreamento bem-sucedido, alguns tipos de páginas de domínios específicos exigem renderização devido ao seu conteúdo dinâmico. Nosso sistema aplica automaticamente a renderização para essas páginas, mesmo que não seja explicitamente definida pelo usuário.

Observe que jobs renderizados consomem mais tráfego em comparação com jobs não renderizados.

Queremos que nossos usuários estejam plenamente cientes disso ao rastrear as seguintes páginas:

6KB

Force render domains.csv

Abrir

Essa abordagem fornece a melhor experiência possível de rastreamento, garantindo precisão e confiabilidade dos dados dessas páginas desafiadoras.

Se você desejar desativar a renderização, pode fazê-lo adicionando o seguinte parâmetro às suas requisições:

"render": ""

Instruções do navegador

Com nosso Headless Browser você também pode executar várias instruções do navegador como clicar, rolar, inserir, aguardar e mais. Leia mais:

Instruções do navegador

AnteriorRenderização JS e controle do navegador PróximoInstruções do navegador

Atualizado há 3 dias

Isto foi útil?

Bom dia

hashtagHTML

hashtagPNG (Captura de tela)

hashtagExemplo de requisição

hashtagForçando renderização em páginas específicas

hashtagInstruções do navegador

HTML

PNG (Captura de tela)

Exemplo de requisição

Forçando renderização em páginas específicas

Instruções do navegador