Maison > interface Web > js tutoriel > Pourquoi `page.evaluate()` renvoie-t-il des objets vides lors de l'interrogation d'éléments dans Puppeteer ?

Pourquoi `page.evaluate()` renvoie-t-il des objets vides lors de l'interrogation d'éléments dans Puppeteer ?

Mary-Kate Olsen
Libérer: 2024-11-16 04:33:03
original
310 Les gens l'ont consulté

Why Does `page.evaluate()` Return Empty Objects When Querying Elements in Puppeteer?

Puppeteer : page.evaluate querySelectorAll Dilemma

Lors de l'utilisation de la fonction page.evaluate() dans Puppeteer, certains utilisateurs ont rencontré le problème de recevoir en conséquence un tableau d’objets vides. Ce comportement déroutant provient de la nécessité de renvoyer des valeurs sérialisables à partir de la fonction d'évaluation.

Considérez le code Puppeteer suivant, dont l'objectif est d'extraire les éléments de titre du populaire site Web d'agrégation d'actualités sociales Reddit :

const browser = await puppeteer.launch();

const page = await browser.newPage();
await page.goto('https://reddit.com/');

let list = await page.evaluate(() => {
  return Promise.resolve(Array.from(document.querySelectorAll('.title')));
});

console.log(JSON.stringify(list))

await browser.close();
Copier après la connexion

Lors de son exécution, ce code peut renvoyer un tableau d'objets vides similaire à celui mentionné dans la description du problème. La raison en est que même si les éléments DOM ne sont pas directement sérialisables en JSON, Puppeteer tente quand même de les chaîner.

Pour résoudre ce problème, le code doit extraire les valeurs souhaitées des éléments et renvoyer les dans un format sérialisable JSON. Dans ce cas, l'attribut href des éléments title contient les liens titre réels. Pour les obtenir, le code peut être modifié comme suit :

let links = await this.page.evaluate((sel) => {
        let elements = Array.from(document.querySelectorAll(sel));
        let links = elements.map(element => {
            return element.href
        })
        return links;
    }, sel);
Copier après la connexion

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal