Le scraping Web est l’une des choses les plus intéressantes dans le monde du codage.
Qu’est-ce que le webscraping ?
Pourquoi existe-t-il même?
Découvrons les réponses.
Table des matières
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érentes 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 des 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 Web. Vous allez apprendre à écrire des web scrapers en JavaScript.
Il y a principalement deux parties dans le web scraping.
- 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 Node est installé, 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 travailler 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écutez 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 package node-fetch apporte 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 packages node-fetch et cheerio sont assez bons pour le web scraping 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 web scraping 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 qu’on extrait ?
Par le titre de la section, je pense que vous le devineriez facilement. Oui, tout ce que vous pensez 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 Coupe du monde de cricket Wikipédia page pour obtenir les informations souhaitées.
- Tout d’abord, récupérez les données brutes à l’aide du package node-fetch.
- Le code ci-dessous récupère les données brutes de la page Wikipedia 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 des données brutes. Utilisons le package cheerio pour extraire les données.
L’extraction de 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.
- Analysez les données HTML à l’aide de la méthode cheerio.load.
const parsedSampleData = cheerio.load(
`<div id="container"><p id="title">I'm title</p></div>`
);- Nous avons analysé le code HTML ci-dessus. Comment en extraire le contenu de la balise p ? C’est la même chose que les sélecteurs dans la manipulation du DOM JavaScript.
console.log(parsedSampleData(« #title »).text());
Vous pouvez sélectionner les balises comme vous le souhaitez. Vous pouvez consulter différentes méthodes à partir du site officiel de Cheerio.
- Maintenant, il est temps d’extraire la liste de la coupe du monde. Pour extraire les informations, nous devons connaître les balises HTML que les informations se trouvent sur la page. Allez à 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 récupéré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 😎, n’est-ce pas ?
Gabarit de grattage
L’obtention des données brutes à partir de l’URL est courante dans tous les projets de grattage Web. La seule partie qui change est l’extraction des données conformément aux exigences. 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 à vous de pratiquer le codage.
Je suggérerais également de consulter les frameworks de grattage Web populaires à explorer et les solutions de grattage Web basées sur le cloud.
Bon codage 🙂
Vous avez apprécié la lecture de l’article ? Que diriez-vous de partager avec le monde ?