Comment naviguer sur les sites Web de pageurs basés sur JavaScript et collecter des liens

Comprendre les défis de la pagination et des API basés sur JavaScript

Les sites Web dotés d'une pagination basée sur JavaScript peuvent rendre difficile la navigation des visiteurs dans les documents, en particulier si les contrôles de pagination ne divulguent aucun paramètre d'URL. Cela rend impossible la modification ou l'automatisation de la navigation dans les pages à l'aide d'approches conventionnelles telles que la modification des requêtes d'URL. Il est possible d’interagir avec de tels téléavertisseurs via différentes méthodes.

Un de ces problèmes se produit lors de la tentative de récupération de liens ou de données à partir de ces types de sites Web. Si vous ne parvenez pas à parcourir manuellement des centaines de pages, une meilleure approche consiste à simuler des événements de clic sur le pager JavaScript. Cette technologie automatise la procédure de navigation, simplifiant considérablement les tâches de collecte de données.

Dans certaines circonstances, l'onglet « Réseau » dans les outils de développement du navigateur peut afficher des points de terminaison d'API qui fournissent des informations utiles. Cependant, interagir directement avec ces points de terminaison peut parfois entraîner des problèmes, car ils peuvent ne pas autoriser certaines méthodes HTTP, telles que les requêtes GET, couramment utilisées pour récupérer des données.

Cet article explique comment simuler des événements de clic sur le pager JavaScript d'un site Web et comment gérer les limitations de l'API qui restreignent l'accès direct aux données dont vous avez besoin. Nous examinerons également les moyens de contourner les limites de méthodes API spécifiques afin de garantir que vous collectez efficacement toutes les informations importantes.

Maîtriser la pagination basée sur JavaScript et la navigation API

Le premier script introduit utilise du JavaScript pur pour explorer dynamiquement une page avec une pagination basée sur JavaScript. L'idée de base derrière cette méthode est d'imiter un utilisateur appuyant sur les boutons du pager en choisissant et en activant des événements de clic sur les éléments HTML appropriés. En identifiant le conteneur de pagination à l'aide du document.querySelector() commande, nous pouvons accéder aux différents boutons de la page et automatiser la navigation. Cette approche est idéale dans les cas où la modification manuelle de l'URL n'est pas une option et où vous avez besoin d'une interface frontale rapide pour interagir avec le mécanisme de pagination.

Dans le deuxième script, nous avons utilisé Puppeteer, un package Node.js pour contrôler un navigateur sans tête. Ce script simule non seulement les pressions sur les boutons du téléavertisseur, mais il automatise également l'ensemble du processus de déplacement sur de nombreuses pages, rassemblant tous les liens publicitaires à chaque itération. Puppeteer vous permet de récupérer du contenu chargé dynamiquement en interagissant directement avec les éléments DOM, un peu comme le ferait un véritable utilisateur. L'un des principaux composants ici est page.évaluer(), qui permet au code JavaScript d'être exécuté dans le contexte de la page. C'est parfait pour collecter des données telles que des liens publicitaires sur des pages paginées.

Les deux scripts nécessitent une gestion des erreurs pour garantir que le processus automatisé fonctionne correctement même si des éléments spécifiques sont manquants ou si l'API se comporte de manière inattendue. Par exemple, console.erreur() enregistre toutes les erreurs rencontrées lors de l'exécution, par exemple lorsqu'un bouton ciblé est introuvable sur la page. De plus, le Marionnettiste page.waitForSelector() La commande garantit que les composants dynamiques, tels que les liens publicitaires, sont entièrement chargés avant que le script ne tente d'interagir. Cela le rend extrêmement pratique lorsque vous travaillez avec des sites Web qui s'appuient largement sur JavaScript pour restituer le contenu, car cela évite les problèmes causés par des chargements de pages manquants ou incomplets.

Le script terminé utilise Axios, un client HTTP Node.js basé sur des promesses, sur le backend. Ici, nous essayons de récupérer les données directement à partir du point de terminaison de l'API, ce qui, selon l'erreur HTTP 405, n'accepte pas OBTENIR requêtes. Pour éviter cela, le script envoie un POSTE demande, qui peut être approuvée par le serveur. Cette méthode est plus adaptée aux utilisateurs qui souhaitent extraire des données sans avoir à naviguer dans le front-end, mais elle implique de comprendre la structure et le comportement de l'API du serveur. La gestion des erreurs garantit que tout échec de requête API est signalé, ce qui facilite la résolution des difficultés de récupération de données côté serveur.

// Select the pagination container
const pagerContainer = document.querySelector('.pagination');

// Function to trigger a click event on a pager button
function clickPageButton(pageNumber) {
  const buttons = pagerContainer.querySelectorAll('button');
  const targetButton = [...buttons].find(btn => btn.textContent === String(pageNumber));
  if (targetButton) {
    targetButton.click();
  } else {
    console.error('Page button not found!');
  }
}

// Example usage: clicking the 2nd page button
clickPageButton(2);

const puppeteer = require('puppeteer');

// Function to scrape all ad links from a paginated website
async function scrapeAds() {
  const browser = await puppeteer.launch();
  const page = await browser.newPage();
  await page.goto('https://www.supralift.com/uk/itemsearch/results');

  let ads = [];
  let hasNextPage = true;

  while (hasNextPage) {
    // Scrape the ad links from the current page
    const links = await page.evaluate(() => {
      return Array.from(document.querySelectorAll('.ad-link-selector')).map(a => a.href);
    });
    ads.push(...links);

    // Try to click the next page button
    const nextButton = await page.$('.pagination-next');
    if (nextButton) {
      await nextButton.click();
      await page.waitForSelector('.ad-link-selector');
    } else {
      hasNextPage = false;
    }
  }

  await browser.close();
  return ads;
}

// Call the scraping function and log results
scrapeAds().then(ads => console.log(ads));

const axios = require('axios');

// Function to fetch data from the API using POST instead of GET
async function fetchData() {
  try {
    const response = await axios.post('https://www.supralift.com/api/search/item/summary', {
      headers: {
        'Content-Type': 'application/json'
      },
      data: { /* Add necessary POST body if applicable */ }
    });

    console.log(response.data);
  } catch (error) {
    console.error('Error fetching data:', error.response ? error.response.data : error.message);
  }
}

// Invoke the fetchData function
fetchData();

Optimisation de la pagination JavaScript pour le Web Scraping et la collecte de données

Lorsque vous explorez des sites Web dotés d’un système de pagination basé sur JavaScript, il est essentiel d’étudier plusieurs méthodes permettant d’extraire rapidement des données. Une option parfois ignorée consiste à intercepter les requêtes réseau émises par le mécanisme de pagination. En examinant attentivement les requêtes effectuées dans les outils de développement du navigateur, notamment l'onglet « Réseau », vous pouvez déterminer les points de terminaison utilisés pour récupérer les données de chaque page. Les systèmes basés sur JavaScript peuvent utiliser AJAX ou aller chercher demandes de chargement dynamique de données sans modifier l'URL, par opposition à la pagination traditionnelle qui nécessite de modifier les paramètres de l'URL.

Pour extraire des liens ou des données de ces sites Web, intercepter les demandes et récupérer les données qu'elles renvoient. Puppeteer et d'autres outils vous permettent de surveiller le trafic réseau et de collecter des données utiles. Lorsque cette stratégie n'est pas réalisable en raison de contraintes côté serveur, la compréhension du comportement de l'API devient essentielle. Certaines API, telles que Supralift, peut interdire des méthodes spécifiques comme OBTENIR et autorisez seulement POSTE requêtes. L'adaptation de vos requêtes pour qu'elles correspondent à la méthode prévue par l'API constitue une solution efficace à ces limitations.

Enfin, lors de la suppression des données paginées, il est essentiel de prévoir des pauses appropriées entre les requêtes. De nombreux sites Web utilisent des algorithmes de limitation de débit pour éviter les abus, et l'envoi d'un trop grand nombre de requêtes successives peut entraîner la mise sur liste noire temporaire de votre adresse IP. Pour éviter la détection et garantir une extraction réussie des données, incluez un délai aléatoire entre les requêtes ou limitez le nombre de requêtes simultanées. Utiliser des outils comme axios dans Node.js et une gestion appropriée des taux sont une excellente approche pour y parvenir.