• Assurez la sécurité des applications de la bonne manière! Détectez, protégez, surveillez, accélérez et plus encore…
  • Le scraping Web est l'une des choses les plus intéressantes dans le monde du codage.

    Qu'est-ce que le web scraping?

    Pourquoi existe-t-il même?

    Découvrons les réponses.

    Qu'est-ce que le Web Scraping?

    Le scraping Web est une tâche automatisée pour extraire des données de sites Web.

    Il existe de nombreuses applications de web scraping. Extraire les prix des produits et les comparer avec différents Plateformes de commerce électronique. Obtenir un devis quotidien sur le Web. Construire votre propre moteur de recherche comme Google, Yahoo, etc., La liste est longue.

    Vous pouvez faire plus que vous ne le pensez avec le web scraping. Une fois que vous savez comment extraire les données de sites Web, vous pouvez faire ce que vous voulez avec les données.

    Le programme qui extrait les données des sites Web s'appelle un grattoir. Vous allez apprendre à écrire des web scrapers en JavaScript.

    Le raclage Web comporte principalement deux parties.

    • Obtenir les données à l'aide de bibliothèques de requêtes et d'un navigateur sans tête.
    • Analyser les données pour extraire les informations exactes que nous voulons des données.

    Sans plus tarder, commençons.

    Configuration du projet

    Je suppose que vous avez installé Node, sinon consultez le Guide d'installation de NodeJS.

    Nous allons utiliser les packages node-fetch et cheerio pour le web scraping en JavaScript. Configurons le projet avec le npm pour qu'il fonctionne avec un package tiers.

    Voyons rapidement les étapes pour terminer notre configuration.

    • Créez un répertoire appelé web_scraping et accédez-y.
    • Exécuter la commande npm init pour initialiser le projet.
    • Répondez à toutes les questions en fonction de vos préférences.
    • Maintenant, installez les packages à l'aide de la commande
    npm install node-fetch cheerio

    Voyons les aperçus des packages installés.

    extraction de nœud

    Le paquet node-fetch apporte le window.fetch à l'environnement node js. Cela aide à faire les requêtes HTTP et à obtenir les données brutes.

    cheerio

    Le paquet cheerio est utilisé pour analyser et extraire les informations nécessaires à partir des données brutes.

    Deux forfaits node-fetch et cheerio sont assez bons pour le scraping Web en JavaScript. Nous n'allons pas voir toutes les méthodes fournies par les packages. Nous verrons le flux du web scraping et les méthodes les plus utiles dans ce flux.

    Vous apprendrez le raclage Web en le faisant. Alors, passons au travail.

    Gratter la liste de la Coupe du monde de cricket

    Ici, dans cette section, nous allons faire du web scraping.

    Qu'est-ce que nous extrayons?

    Par le titre de la section, je pense que vous le devineriez facilement. Ouais, tout ce que tu penses est correct. Extrayons tous les vainqueurs et finalistes de la coupe du monde de cricket jusqu'à présent.

    • Créez un fichier appelé extract_cricket_world_cups_list.js dans le projet.
    • Nous utiliserons le Wikipedia Coupe du monde de cricket page pour obtenir les informations souhaitées.
    • Tout d'abord, récupérez les données brutes en utilisant le node-fetch paquet.
    • Le code ci-dessous obtient les données brutes de la page Wikipédia ci-dessus.
    const fetch = require("node-fetch");
    
    // function to get the raw data
    const getRawData = (URL) => {
       return fetch(URL)
          .then((response) => response.text())
          .then((data) => {
             return data;
          });
    };
    
    // URL for data
    const URL = "https://en.wikipedia.org/wiki/Cricket_World_Cup";
    
    // start of the program
    const getCricketWorldCupsList = async () => {
       const cricketWorldCupRawData = await getRawData(URL);
       console.log(cricketWorldCupRawData);
    };
    
    // invoking the main function
    getCricketWorldCupsList();
    

    Nous avons obtenu les données brutes de l'URL. Il est maintenant temps d'extraire les informations dont nous avons besoin à partir des données brutes. Utilisons le package cheerio pour extraire les données.

    Extraire des données impliquant des balises HTML avec cheerio est un jeu d'enfant. Avant d'entrer dans les données réelles, voyons quelques exemples d'analyse de données à l'aide de cheerio.

    • Analyser les données HTML en utilisant cheerio.load la méthode.
    const parsedSampleData = cheerio.load(
          `<div id="container"><p id="title">I'm title</p></div>`
       );
    • Nous avons analysé le code HTML ci-dessus. Comment extraire le p taguer le contenu de celui-ci? C'est la même chose que les sélecteurs dans la manipulation JavaScript DOM.

    console.log(parsedSampleData("#title").text());

    Vous pouvez sélectionner les balises comme vous le souhaitez. Vous pouvez consulter différentes méthodes de la site officiel cheerio.

    • Il est maintenant temps d'extraire la liste de la coupe du monde. Pour extraire les informations, nous devons connaître les balises HTML sur lesquelles se trouvent les informations sur la page. Aller à la page Wikipédia de la coupe du monde de cricket et inspectez la page pour obtenir des informations sur les balises HTML.

    Voici le code complet.

    const fetch = require("node-fetch");
    const cheerio = require("cheerio");
    
    // function to get the raw data
    const getRawData = (URL) => {
       return fetch(URL)
          .then((response) => response.text())
          .then((data) => {
             return data;
          });
    };
    
    // URL for data
    const URL = "https://en.wikipedia.org/wiki/Cricket_World_Cup";
    
    // start of the program
    const getCricketWorldCupsList = async () => {
       const cricketWorldCupRawData = await getRawData(URL);
    
       // parsing the data
       const parsedCricketWorldCupData = cheerio.load(cricketWorldCupRawData);
    
       // extracting the table data
       const worldCupsDataTable = parsedCricketWorldCupData("table.wikitable")[0]
          .children[1].children;
    
       console.log("Year --- Winner --- Runner");
       worldCupsDataTable.forEach((row) => {
          // extracting `td` tags
          if (row.name === "tr") {
             let year = null,
                winner = null,
                runner = null;
    
             const columns = row.children.filter((column) => column.name === "td");
    
             // extracting year
             const yearColumn = columns[0];
             if (yearColumn) {
                year = yearColumn.children[0];
                if (year) {
                   year = year.children[0].data;
                }
             }
    
             // extracting winner
             const winnerColumn = columns[3];
             if (winnerColumn) {
                winner = winnerColumn.children[1];
                if (winner) {
                   winner = winner.children[0].data;
                }
             }
    
             // extracting runner
             const runnerColumn = columns[5];
             if (runnerColumn) {
                runner = runnerColumn.children[1];
                if (runner) {
                   runner = runner.children[0].data;
                }
             }
    
             if (year && winner && runner) {
                console.log(`${year} --- ${winner} --- ${runner}`);
             }
          }
       });
    };
    
    // invoking the main function
    getCricketWorldCupsList();
    

    Et voici les données grattées.

    Year --- Winner --- Runner
    1975 --- West Indies --- Australia
    1979 --- West Indies --- England
    1983 --- India --- West Indies
    1987 --- Australia --- England
    1992 --- Pakistan --- England
    1996 --- Sri Lanka --- Australia
    1999 --- Australia --- Pakistan
    2003 --- Australia --- India
    2007 --- Australia --- Sri Lanka
    2011 --- India --- Sri Lanka
    2015 --- Australia --- New Zealand
    2019 --- England --- New Zealand

    Cool 😎, c'est ça?

    Modèle de grattage

    L'obtention des données brutes à partir de l'URL est courante dans tous les projets de scraping Web. La seule partie qui change est l'extraction des données conformément à l'exigence. Vous pouvez essayer le code ci-dessous comme modèle.

    const fetch = require("node-fetch");
    const cheerio = require("cheerio");
    const fs = require("fs");
    // function to get the raw data
    const getRawData = (URL) => {
       return fetch(URL)
          .then((response) => response.text())
          .then((data) => {
             return data;
          });
    };
    // URL for data
    const URL = "https://example.com/";
    // start of the program
    const scrapeData = async () => {
       const rawData = await getRawData(URL);
       // parsing the data
       const parsedData = cheerio.load(rawData);
       console.log(parsedData);
       // write code to extract the data
       // here
       // ...
       // ...
    };
    // invoking the main function
    scrapeData();

    Conclusion

    Vous avez appris à gratter une page Web. Maintenant, c'est à ton tour de pratiquer le codage.

    Je suggérerais également de vérifier populaire cadres de scraping Web d'explorer et de solutions de web-scraping basées sur le cloud.

    Codage heureux 🙂