Comment utiliser WSA dans notre projet ? Jetons un œil à cet exemple rapide où nous effectuons un scraping sur Amazon pour trouver la carte graphique la plus chère sur une page. Cet exemple est écrit en JavaScript, mais vous pouvez le réaliser dans n'importe quel langage de programmation avec lequel vous êtes à l'aise.
Tout d'abord, nous devons installer certains paquets pour nous aider à gérer la requête HTTP (got) et à analyser le résultat (jsdom) à l'aide de cette ligne de commande dans le terminal du projet :
npm install got jsdom
L'étape suivante consiste à définir les paramètres nécessaires pour effectuer notre requête :
const params = {
api_key: "XXXXXX",
url: "https://www.amazon.com/s?k=graphic+card"
}
Voici comment nous préparons la requête à WebScrapingAPI pour qu’elle effectue le scraping du site web à notre place :
const response = await got('https://api.webscrapingapi.com/v1', {searchParams: params})
Nous devons maintenant localiser chaque élément « Carte graphique » dans le code HTML. À l’aide de l’outil de développement, nous avons découvert que la classe s-result-item contient toutes les informations sur le produit, mais nous n’avons besoin que de son prix.
À l'intérieur de l'élément, nous pouvons voir qu'il existe un conteneur de prix avec la classe a-price et la sous-classe a-offscreen, d'où nous extrairons le texte représentant son prix.
WebScrapingAPI renverra la page au format HTML, nous devons donc l'analyser. JSDOM fera l'affaire.
const {document} = new JSDOM(response.body).window
Après avoir envoyé la requête et analysé la réponse reçue de WSA, nous devons filtrer le résultat et n'extraire que ce qui nous intéresse. D'après l'étape précédente, nous savons que les détails de chaque produit se trouvent dans la classe s-result-item, nous allons donc les parcourir. À l'intérieur de chaque élément, nous vérifions si le conteneur de prix de classe a-price existe, et si c'est le cas, nous extrayons le prix de l'élément a-offscreen qu'il contient et l'ajoutons à un tableau.
Déterminer quel est le produit le plus cher devrait désormais être un jeu d'enfant. Il suffit de parcourir le tableau et de comparer les prix entre eux.
En encapsulant le tout dans une fonction asynchrone, le code final devrait ressembler à ceci :
const {JSDOM} = require("jsdom");
const got = require("got");
(async () => {
const params = {
api_key: "XXX",
url: "https://www.amazon.com/s?k=graphic+card"
}
const response = await got('https://api.webscrapingapi.com/v1', {searchParams: params})
const {document} = new JSDOM(response.body).window
const products = document.querySelectorAll('.s-result-item')
const prices = []
products.forEach(el => {
if (el) {
const priceContainer = el.querySelector('.a-price')
if (priceContainer) prices.push(priceContainer.querySelector('.a-offscreen').innerHTML)
}
})
let most_expensive = 0
prices.forEach((price) => {
if(most_expensive < parseFloat(price.substring(1)))
most_expensive = parseFloat(price.substring(1))
})
console.log("The most expensive item is: ", most_expensive)
})();
