Meta

Hacer una herramienta web similar a este generador de imágenes aleatorias de referencia y temporizador para la práctica de dibujo pero para imágenes de dibujos animados .

Método y tecnologías utilizadas

Intenté usar la API de Pinterest, pero me pide que ingrese la política de privacidad de la empresa, así que decidí usar un raspador web en su lugar (titiritero)

Pensamiento

1. Ingrese un término de consulta (por ejemplo, cara de caricatura) y la consulta se agregará a la URL que se está raspando.
2. Consulta, seleccione todas las etiquetas de imagen y solicite su src.
3. Muestre estas imágenes en la pantalla del usuario junto con una funcionalidad de temporizador definida por el usuario y otras utilidades básicas (para omitir, siguiente, guardar, etc.) Al final del temporizador, la herramienta web muestra la siguiente imagen.

Código

 const puppeteer = require('puppeteer'); async function scrapeImage(url) { const browser = await puppeteer.launch(); const page = await browser.newPage(); const page1 = await page.goto(url); const div = await page.$x('/html/body/div[1]/div[1]/div[2]/div/div/div[2]/div[2]/div[1]/div/div/div/div[1]') const [ image ] = await page.$$("img") const src = await image.getProperty('src') console.log(src) browser.close() }

Problema

1. Pensé que usar Xpath me daría el comportamiento deseado, pero ahora estoy confundido sobre cómo seguir adelante.
2. Luego usé querySelectorAll para seleccionar todas las etiquetas img y solicitar su src

pero no se la teoria :(