Web scraping en JavaScript : Guía completa

Autor :

Reaccionar :

Comentario

Para hacer web scraping en JavaScript, necesitas Node.js y una biblioteca adecuada para tu público objetivo. Utiliza Cheerio para las páginas estáticas y Puppeteer Donde Playwright en cuanto se muestra el contenido en el navegador del usuario.

Esta guía te muestra, paso a paso, cómo instalar, programar y ejecutar tu primer scraper.

Requisitos previos para el web scraping en JavaScript

Entorno de Node.js y bibliotecas para realizar web scraping en JavaScript.
Entorno Node.js y bibliotecas para realizar web scraping en JavaScript ©Christina para Alucare.fr

Antes de escribir tu primer script de JS, basta con dos herramientas básicas para empezar.

  • Node.js : un entorno de ejecución de JavaScript de código abierto y multiplataforma. Te permite ejecutar código JS fuera de un navegador, directamente desde tu consola. Descárgalo desde la documentación oficial de Node.js.
  • npm (Node Package Manager) : el gestor de paquetes integrado en Node. Sirve para instalar tus bibliotecas con un simple comando npm install.

Una vez Node.js Una vez instalada, eliges una biblioteca en función del tipo de página web que quieras rastrear. Estas son las más utilizadas.

  • Cheerio : ideal para el extracción de datos de páginas estáticas. Analiza el código HTML sin procesar con una sintaxis similar a jQuery. Ella es ligera, rápida y sencillo, pero no ejecuta el código JavaScript de la página. Consulta la documentación de Cheerio.
  • Puppeteer y Playwright : ideales para los sitios web dinámicos. Controlan un auténtico navegador sin interfaz gráfica (Chrome Donde Firefox) y cargan la página como lo haría un usuario real. Consulta la documentación de Puppeteer.

La regla es sencilla: Cheerio para las páginas estáticas, Puppeteer Donde Playwright en cuanto una página web carga sus datos en JavaScript.

¿Cómo puedo hacer web scraping en JavaScript?

El principio es sencillo: coges el HTML De una página web, seleccionas los elementos que te interesan y, a continuación, extraes los datos. La elección de la herramienta se basa en un único criterio: ¿la página es estático Donde dinámica ?

Paso 1: Instalación y configuración

Empieza por descargar Node.js desde la página web oficial y, a continuación, instálalo. Después, comprueba la instalación en tu terminal:

node -v
npm -v

Si aparecen las dos versiones, todo va bien. Crea ahora tu proyecto:

mkdir mi-scraping
cd mi-scraping
npm init -y

Este comando genera un archivo package.json que te mostrará una lista de tus dependencias. Ahora solo tienes que instalar las bibliotecas que se adapten a tus necesidades.

Para un página estática (contenido que ya figura en el código HTML enviado por el servidor), utiliza axios y Cheerio :

npm install axios cheerio

Para un página dinámica (datos cargados mediante JavaScript del lado del cliente, como React, Vue Donde Angular), instala mejor Puppeteer :

npm install puppeteer

Paso 2: Creación de un script de scraping

Antes de programar tu script de JS, identifica los elementos adecuados Selectores CSS. Abre la página web de destino en Chrome Donde Firefox, haz clic con el botón derecho del ratón sobre el elemento que quieras y, a continuación, selecciona «Inspeccionar». Se mostrará el DOM: así podrás localizar la etiqueta, la clase (.clase) o el identificador (#id) a los que hay que dirigirse.

Extracción de datos de una página estática con Cheerio

Cheerio solo lee el HTML plano y no ejecuta ningún script JS. En una página web generada del lado del cliente, solo verá una página vacía.

// Importar bibliotecas
const axios = require('axios');
const cheerio = require('cheerio');

// URL de la página a desguazar
const url = "https://exemple.com";

// Función principal
async function scrapePage() {
  try {
    // Descarga el contenido HTML
    const { data } = await axios.get(url);

    // Cargar HTML con Cheerio
    const $ = cheerio.load(datos);

    // Ejemplo: recuperar todos los títulos h1
    const títulos = [];
    $("h1").each((i, elem) => {
      titles.push($(elem).text().trim());
    });

    // Mostrar los resultados
    console.log("Títulos encontrados:", títulos);

  } catch (error) {
    console.error("Error al realizar el scraping:", error);
  }
}

// Ejecutar el script
scrapePage();

Sustituye https://exemple.com con la URL que elijas y, a continuación, adapta el selector $("h1") para centrarte en lo que te interesa: $("p") para los párrafos, .clase Donde #id para un elemento concreto. El método .text() devuelve el textContent del elemento, el equivalente a jQuery del lado del servidor.

Extracción de datos de una página dinámica con Puppeteer

Puppeteer un piloto de verdad navegador sin cabeza y espera a que el JavaScript haya terminado de cargar el contenido, donde Cheerio fracasa.

// Importar Puppeteer
const puppeteer = require("puppeteer");

// URL de la página a desguazar
const url = "https://exemple.com";

async function scrapePage() {
  // Lanzar un navegador sin interfaz gráfica (headless)
  const browser = await puppeteer.launch({ headless: true });
  const page = await browser.newPage();

  try {
    // Ir a la página
    await page.goto(url, { waitUntil: "networkidle2" });

    // Ejemplo: extraer el texto de todos los títulos h1
    const titles = await page.$$eval("h1", elements =>
      elements.map(el => el.textContent.trim())
    );

    console.log("Títulos encontrados:", títulos);

  } catch (error) {
    console.error("Error al realizar el scraping:", error);
  } finally {
    // Cerrar el navegador
    await browser.close();
  }
}

// Ejecutar el script
scrapePage();

La opción waitUntil: "networkidle2" espera a que terminen los solicitudes de red antes de extraer los datos de la página web.

Etapa 3: Gestión de los datos extraídos

Una vez recuperados los datos, puedes guardarlos en JSON para una base de datos, o en CSV para abrirlos en Excel. El módulo fs es natural de Node.js y no requiere ninguna instalación. Para el CSV, solo tienes que añadir la biblioteca json2csv :

npm install json2csv
const axios = require("axios");
const cheerio = require("cheerio");
const fs = require("fs");
const { Parser } = require("json2csv");

const url = "https://exemple.com";

async function scrapeAndSave() {
  try {
    // Récupérer le HTML de la page
    const { data } = await axios.get(url);
    const $ = cheerio.load(data);

    // Extraire les titres dans un tableau d'objets
    const resultats = [];
    $("h1").each((i, elem) => {
      resultats.push({ titre: $(elem).text().trim() });
    });

    // Sauvegarde en JSON
    fs.writeFileSync("resultats.json", JSON.stringify(resultats, null, 2), "utf-8");
    console.log("Données sauvegardées dans resultats.json");

    // Sauvegarde en CSV
    const parser = new Parser();
    const csv = parser.parse(resultats);
    fs.writeFileSync("resultats.csv", csv, "utf-8");
    console.log("Données sauvegardées dans resultats.csv");

  } catch (error) {
    console.error("Erreur lors du scraping :", error);
  }
}

scrapeAndSave();

Este script de JavaScript lo hace todo de una sola vez: recupera la página web, extrae los datos HTML y, a continuación, escribe dos archivos. El bloque try / catch gestiona los errores para evitar que un se acabó el tiempo o un CAPTCHA haga que se cuelgue todo el script de scraping.

Prácticas recomendadas para el web scraping en JavaScript

Antes de ejecutar tus scripts, hay algunos hábitos sencillos que te ayudarán a mantener tu scraping con JS eficaz, estable y que respete las condiciones de uso de los sitios web en cuestión. También es importante que te asegures de que tu Este procedimiento es legal según el contexto.

  • Respetar el archivo robots.txt : esa es la regla de oro. Antes de extraer datos de una página web, abre https://exemple.com/robots.txt. Si la ruta en cuestión está en Prohibir, no lo extraigas. Así evitarás problemas éticos y legales.
  • Espacia tus consultas : No satures la página web. Deja un tiempo entre cada solicitud para pasar desapercibido y evitar que te bloqueen.
  • Personaliza tu User-Agent : por defecto, un scraper de JavaScript se detecta rápidamente. Con Puppeteer, define un encabezado realista mediante page.setUserAgent() para imitar a un auténtico navegante.
  • Gestionar los errores y los bloqueos : envuelve tus llamadas en un bloque try / catch para evitar que un tiempo de espera o un CAPTCHA provoque un fallo en todo el script.

¿Qué alternativas deben considerarse?

El web scraping no se limita a JavaScript. Dependiendo de tu proyecto, puede que otros lenguajes o herramientas se adapten mejor a tus necesidades.

  • Python : las bibliotecas Scrapy y BeautifulSoup funcionan de maravilla para extraer contenido de numerosas páginas web.
  • PHP : resulta útil si quieres integrar el scraping directamente en una página web ya programada en este lenguaje.
  • Herramientas sin código como Bright Data, Octoparse y Apify: te permiten extraer datos de la web sin escribir ni una sola línea de código.

¿API de scraping o solución «hazlo tú mismo»? ¿Qué elegir?

La verdadera cuestión no es el lenguaje, sino el nivel de complejidad que estás dispuesto a gestionar por ti mismo. Tu propio script de scraping con Puppeteer Donde Cheerio sigue siendo la mejor opción cuando el volumen es reducido y el emplazamiento está poco protegido.

A API de raspado (como la que ofrece Bright Data) cobra mayor relevancia en cuanto te enfrentas a bloqueos avanzados: rotación de direcciones IP, resolución automática de CAPTCHA y ejecución de JavaScript a gran escala.

En resumen: el Bricolaje te ayuda a ahorrar dinero y te enseña mucho. El’API te permite ahorrar tiempo en proyectos complejos o recurrentes.

preguntas frecuentes

¿Cuál es la mejor herramienta JavaScript de web scraping?

Todo depende del tipo de página web que quieras extraer.

  • Cheerio : rápido y ligero, perfecto para analizar el HTML páginas estáticas.
  • Puppeteer : ideal para manejar un navegador de verdad Chrome y gestionar el contenido generado en JavaScript.
  • Playwright : cerca de Puppeteer, pero con el compatibilidad con múltiples navegadores (Chrome, Firefox, WebKit) y otras funciones avanzadas.

¿Cuál es el mejor lenguaje de programación para el scraping?

No hay un lenguaje universal que sea mejor que otro. La elección depende de tu proyecto y de tu entorno.

  • Python : muy popular para proyectos rápidos y grandes volúmenes de datos web.
  • JavaScript : lo más acertado si ya trabajas en el ecosistema web con Node.js.
  • PHP : resulta práctico para integrar el scraping directamente en una web ya existente.

la web scraping en JavaScript sigue siendo una excelente opción para recoger datos de la web, que pases por Cheerio, Puppeteer Donde Playwright.

Si quieres profundizar en el tema sin tener que escribir código, echa un vistazo a nuestras guías sobre Datos brillantes, Octoparse y Apify.

👍Su opinión
El artículo es informativo
El artículo es objetivo
El artículo responde a mi pregunta
El contenido está actualizado
🔍 ¿Has encontrado algún error? ¡Dinos dónde!

¿Te gusta? ¡Compártelo!

Este contenido es originalmente en francés (Véase el editor justo debajo). Se ha traducido y revisado en varios idiomas utilizando Deepl y/o la API de Google Translate para ofrecer ayuda en el mayor número de países posible. Esta traducción nos cuesta varios miles de euros al mes. Si no es 100 % perfecta, déjanos un comentario para que podamos arreglarlo. Si estás interesado en corregir y mejorar la calidad de los artículos traducidos, ¡envíanos un correo electrónico a través del formulario de contacto!
Agradecemos sus comentarios para mejorar nuestros contenidos. Si desea sugerirnos mejoras, utilice nuestro formulario de contacto o deje un comentario a continuación. Sus comentarios siempre nos ayudan a mejorar la calidad de nuestro sitio web Alucare.fr


Alucare es un medio de comunicación independiente. Apóyanos añadiéndonos a tus favoritos de Google News:

Publicar un comentario en el foro de debate