In Développement | Dernière mise à jourated: 4 Avril 2021

Logiciel Jira est l'outil de gestion de projet n°1 utilisé par les équipes agiles pour planifier, suivre, publier et prendre en charge d'excellents logiciels.

Premiers pas avec le Web Scraping en JavaScript

By Hafeezul Kareem Shaik

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 web scraping est un automatismeated tâche à extract données provenant de sites Web.

Il existe de nombreuses applications du web scraping. Extramesurer les prix des produits et les comparer avec différents e-Commerce platdocument. 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 saurez comment extract les données des sites Web, vous pouvez alors faire quoiatecomme vous le souhaitez avec les données.

Le programme qui extracts les données des sites Web sont appelées un web scraper. Tu vas apprendre à écrire 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 b sans têterowser.
Analyser les données pour extract les informations exactes que nous attendons 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 le cheerio pour le web scraping en JavaScript. Configurons le projet avec le npm pour travailler avec un third-forfait fête.

Voyons rapidement les étapes pour terminer notre configuration.

Create un répertoire appelé web_scraping et naviguerate à elle.
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 extract les informations nécessaires à partir des données brutes.

Deux forfaits node-fetch et le 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.

Liste de la Coupe du monde de cricket

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

Que sommes-nous extraça marche ?

D'après le titre de la section, je pense que vous le devinerez facilement. Ouais, quoiatece que vous pensez est correct. Allons extract tous les vainqueurs et finalistes de la Coupe du monde de cricket jusqu'à présent.

Create 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. Maintenant, il est temps de extract les informations dont nous avons besoin à partir des données brutes. Utilisons le package cheerio pour extract les données.

ExtraL'enregistrement de données impliquant des balises HTML avec cheerio est un cakemarcher. 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 extract 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.

Maintenant, il est temps de extract la liste de la coupe du monde. À extraCôté informations, nous devons connaître les balises HTML sur lesquelles les informations se trouvent sur la page. Allez au page Wikipédia de la coupe du monde de cricket et le inspect 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?

Tem de grattageplate

L'obtention des données brutes à partir de l'URL est courante dans tous les projets de web scraping. La seule partie qui change est extracting les données selon les exigences. Vous pouvez essayer le code ci-dessous comme modèleplate.

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 🙂

Publié dans