Imagínese crear una plataforma de comercio electrónico donde podamos obtener fácilmente datos de productos en tiempo real de las principales tiendas como eBay, Amazon y Flipkart. Claro, existe Shopify y servicios similares, pero seamos honestos: puede resultar un poco engorroso comprar una suscripción solo para un proyecto. Entonces pensé, ¿por qué no eliminar estos sitios y almacenar los productos directamente en nuestra base de datos? Sería una forma eficiente y rentable de conseguir productos para nuestros proyectos de comercio electrónico.

¿Qué es el web scraping?

El web scraping implica extraer datos de sitios web analizando el HTML de las páginas web para leer y recopilar contenido. A menudo implica automatizar un navegador o enviar solicitudes HTTP al sitio y luego analizar la estructura HTML para recuperar información específica como texto, enlaces o imágenes. Puppeteer es una biblioteca que se utiliza para extraer sitios web.

¿Qué es el titiritero?

Puppeteer es una biblioteca de Node.js. Proporciona una API de alto nivel para controlar los navegadores Chrome o Chromium sin cabeza. Chrome sin cabeza es una versión de Chrome que ejecuta todo sin una interfaz de usuario (perfecta para ejecutar cosas en segundo plano).

Podemos automatizar varias tareas usando el titiritero, como por ejemplo:

• Web Scraping: Extraer contenido de sitios web implica interactuar con el HTML y JavaScript de la página. Normalmente recuperamos el contenido apuntando a los selectores de CSS.
• Generación de PDF: Convertir páginas web a PDF mediante programación es ideal cuando desea generar directamente un PDF desde una página web, en lugar de tomar una captura de pantalla y luego convertirla a un PDF. (P.D. Disculpas si ya tienes soluciones para esto).
• Pruebas automatizadas: Ejecutar pruebas en páginas web simulando acciones del usuario como hacer clic en botones, completar formularios y tomar capturas de pantalla. Esto elimina el tedioso proceso de revisar manualmente formularios largos para garantizar que todo esté en su lugar.

?¿Cómo empezar con el titiritero?

Primero tenemos que instalar la biblioteca, continúa y haz esto.
Usando npm:

npm i puppeteer # Downloads compatible Chrome during installation.
npm i puppeteer-core # Alternatively, install as a library, without downloading Chrome.

Usando hilo:

yarn add puppeteer // Downloads compatible Chrome during installation.
yarn add puppeteer-core // Alternatively, install as a library, without downloading Chrome.

Usando pnpm:

pnpm add puppeteer # Downloads compatible Chrome during installation.
pnpm add puppeteer-core # Alternatively, install as a library, without downloading Chrome.

? Ejemplo para demostrar el uso de titiritero.

Aquí hay un ejemplo de cómo raspar un sitio web. (P.D. Utilicé este código para recuperar productos del sitio web de Myntra para mi proyecto de comercio electrónico).

const puppeteer = require("puppeteer");
const CategorySchema = require("./models/Category");

// Define the scrape function as a named async function
const scrape = async () => {
    // Launch a new browser instance
    const browser = await puppeteer.launch({ headless: false });

    // Open a new page
    const page = await browser.newPage();

    // Navigate to the target URL and wait until the DOM is fully loaded
    await page.goto('https://www.myntra.com/mens-sport-wear?rawQuery=mens sport wear', { waitUntil: 'domcontentloaded' });

    // Wait for additional time to ensure all content is loaded
    await new Promise((resolve) => setTimeout(resolve, 25000));

    // Extract product details from the page
    const items = await page.evaluate(() => {
        // Select all product elements
        const elements = document.querySelectorAll('.product-base');
        const elementsArray = Array.from(elements);

        // Map each element to an object with the desired properties
        const results = elementsArray.map((element) => {
            const image = element.querySelector(".product-imageSliderContainer img")?.getAttribute("src");
            return {
                image: image ?? null,
                brand: element.querySelector(".product-brand")?.textContent,
                title: element.querySelector(".product-product")?.textContent,
                discountPrice: element.querySelector(".product-price .product-discountedPrice")?.textContent,
                actualPrice: element.querySelector(".product-price .product-strike")?.textContent,
                discountPercentage: element.querySelector(".product-price .product-discountPercentage")?.textContent?.split(' ')[0]?.slice(1, -1),
                total: 20, // Placeholder value, adjust as needed
                available: 10, // Placeholder value, adjust as needed
                ratings: Math.round((Math.random() * 5) * 10) / 10 // Random rating for demonstration
            };
        });

        return results; // Return the list of product details
    });

    // Close the browser
    await browser.close();

    // Prepare the data for saving
    const data = {
        category: "mens-sport-wear",
        subcategory: "Mens",
        list: items
    };

    // Create a new Category document and save it to the database
    // Since we want to store product information in our e-commerce store, we use a schema and save it to the database.
    // If you don't need to save the data, you can omit this step.
    const category = new CategorySchema(data);
    console.log(category);
    await category.save();

    // Return the scraped items
    return items;
};

// Export the scrape function as the default export
module.exports = scrape;

?Explicación:

• En este código, utilizamos Puppeteer para extraer datos de productos de un sitio web. Después de extraer los detalles, creamos un esquema (CategorySchema) para estructurar y guardar estos datos en nuestra base de datos. Este paso es especialmente útil si queremos integrar los productos scrapeados en nuestra tienda de comercio electrónico. Si no es necesario almacenar los datos en una base de datos, puede omitir el código relacionado con el esquema.
• Antes de realizar el scraping, es importante comprender la estructura HTML de la página e identificar qué selectores de CSS contienen el contenido que desea extraer.
• En mi caso, utilicé los selectores CSS relevantes identificados en el sitio web de Myntra para extraer el contenido al que me dirigía.