Пагінація в Axios: як виконувати вебскрапінг кількох сторінок
У цьому посібнику я покажу, як використовувати Axios для вебскрапінгу сайтів із пагінацією та збирати дані з кількох сторінок у Node.js.
По ходу ми також розглянемо, як працювати з пагінацією на основі JavaScript і уникати блокувань під час вебскрапінгу. Розберімося і почнімо!
Що таке пагінація?
Пагінація — це техніка, яку вебсайти використовують для поділу великих обсягів даних на кілька сторінок. Замість того щоб завантажувати всі дані одразу, сайт показує обмежену кількість елементів на сторінці, а користувачі можуть переходити між сторінками за допомогою кнопок або посилань.
Існує три поширені типи пагінації:
- Numbered Pagination — Сторінки позначаються числами, як-от 1, 2, 3, 4, …
- Кнопки «Наступна» та «Попередня» — Користувачі натискають Next, щоб перейти вперед, або Previous, щоб повернутися назад.
- Infinite Scrolling — Нові дані завантажуються автоматично, коли користувач прокручує сторінку вниз.
Кожен тип потребує різного підходу до вебскрапінгу. Почнімо з найпростішого: пагінації з нумерацією сторінок.
Налаштування Axios для вебскрапінгу
Щоб скрапити пагіновані дані, нам потрібні два npm-пакети:
- Axios — Популярний HTTP-клієнт для надсилання запитів до вебсайтів
- Cheerio — Легка бібліотека для розбору HTML і витягування даних
Встановіть Axios і Cheerio
First, create a new Node.js project and install the required packages:
mkdir axios-pagination-scraper
cd axios-pagination-scraper
npm init -y
npm install axios cheerio
Тепер можемо почати писати наш вебскрапер.
Вебскрапінг сайтів із нумерованою пагінацією
Крок 1: Базовий вебскрапер для однієї сторінки
Ми будемо збирати дані про товари (назву, ціну та URL зображення) з вигаданого інтернет-магазину, який використовує нумеровану пагінацію.
const axios = require('axios');
const cheerio = require('cheerio');
const url = 'https://www.scrapingcourse.com/ecommerce/?page=1';
async function scrapePage(pageUrl) {
try {
const response = await axios.get(pageUrl);
if (response.status !== 200) {
console.error(`Error: ${response.status}`);
return [];
}
const $ = cheerio.load(response.data);
const products = [];
$('.product').each((index, product) => {
const name = $(product).find('.product-name').text().trim();
const price = $(product).find('.product-price').text().trim();
const imageUrl = $(product).find('.product-image').attr('src');
products.push({ Name: name, Price: price, Image: imageUrl });
});
return products;
} catch (error) {
console.error(`Error: ${error.message}`);
return [];
}
}
(async () => {
const products = await scrapePage(url);
console.log(products);
})();
This script extracts products from only the first page. Now, let’s modify it to scrape multiple pages.
Step 2: Scraping Multiple Pages
We need to loop through each page and extract data to scrape all pages. We assume the website has 12 pages.
async function scrapeAllPages(baseURL, totalPages) {
let allProducts = [];
for (let i = 1; i <= totalPages; i++) {
const pageUrl = `${baseURL}?page=${i}`;
console.log(`Scraping: ${pageUrl}`);
const products = await scrapePage(pageUrl);
allProducts = […allProducts, …products];
}
return allProducts;
}
(async () => {
const allProducts = await scrapeAllPages('https://www.scrapingcourse.com/ecommerce/', 12);
console.log(allProducts);
})();
Ця версія збирає дані з усіх 12 сторінок і об’єднує їх в один масив.
Вебскрапінг сайтів із кнопками «Next» і «Previous»
Деякі вебсайти не використовують нумеровані сторінки, а натомість мають кнопки «Далі» та «Попередня».
Щоб упоратися з цим, нам потрібно:
- Витягніть «Наступна сторінка» URL.
- Рекурсивно переходьте на наступну сторінку, доки не Next button.
Крок 1: змініть вебскрапер, щоб виявляти посилання на наступну сторінку
async function scrapePages(url) {
let products = [];
try {
const response = await axios.get(url);
if (response.status !== 200) {
console.error(`Error: ${response.status}`);
return products;
}
const $ = cheerio.load(response.data);
$('.product').each((index, product) => {
const name = $(product).find('.product-name').text().trim();
const price = $(product).find('.product-price').text().trim();
const imageUrl = $(product).find('.product-image').attr('src');
products.push({ Name: name, Price: price, Image: imageUrl });
});
const nextPage = $('.next').attr('href');
if (nextPage) {
console.log(`Вебскрапінг наступної сторінки: ${nextPage}`);
const nextProducts = await scrapePages(nextPage);
products = […products, …nextProducts];
}
} catch (error) {
console.error(`Error: ${error.message}`);
}
return products;
}
(async () => {
const allProducts = await scrapePages('https://www.scrapingcourse.com/ecommerce/');
console.log(allProducts);
})();
Тепер вебскрапер автоматично натискає кнопку «Далі», доки не вичерпаються всі сторінки.
Handling JavaScript-Based Pagination
Сайти, що використовують JavaScript для динамічного завантаження даних, не можна скрапити лише за допомогою Axios. Вам потрібен безголовий браузер, наприклад Puppeteer або Playwright.
Використання Puppeteer для нескінченного прокручування
Install Puppeteer:
npm install puppeteer
Модифікуйте вебскрапер:
const puppeteer = require('puppeteer');
async function scrapeInfiniteScroll(url) {
const browser = await puppeteer.launch();
const page = await browser.newPage();
await page.goto(url, { waitUntil: 'networkidle2' });
let products = [];
while (true) {
const newProducts = await page.evaluate(() => {
return Array.from(document.querySelectorAll('.product')).map(product => ({
Name: продукт.querySelector('.product-name').innerText,
Price: продукт.querySelector('.product-price').innerText,
Image: продукт.querySelector('.product-image').src
}));
});
products = […products, …newProducts];
const loadMore = await page.$('.load-more');
if (loadMore) {
await loadMore.click();
await page.waitForTimeout(2000);
} else {
break;
}
}
await browser.close();
return products;
}
(async () => {
const allProducts = await scrapeInfiniteScroll('https://www.scrapingcourse.com/infinite-scroll');
console.log(allProducts);
})();
Цей вебскрапер прокручує сторінку та натискає кнопку «Load More», доки не перестане з’являтися новий вміст.
Avoiding Anti-Bot Detection
Сайти часто блокують вебскрапери за допомогою CAPTCHA, IP-блокувань і JavaScript-перевірок. Щоб уникнути цього:
- Use Ротаційні проксі
- Випадково змінюйте заголовки запитів і значення User-Agent.
- Додавайте затримки між запитами
- За допомогою надійного рішення на кшталт Bright Data or Oxylabs, що автоматично обходить антибот-захист. Простий приклад коду:
const axios = require('axios');
const url = 'https://www.scrapingcourse.com/antibot-challenge';
const apiKey = 'YOUR_Bright Data_API_KEY';
axios.get(`https://api.brightdata.com/v1/?url=${url}&apikey=${apiKey}&js_render=true`)
.then(response => console.log(response.data))
.catch(error => console.log(error));
Conclusion
Під час вебскрапінгу кількох сторінок важливо розуміти антиботові механізми, які сайти часто використовують. Хоча інструменти на кшталт Axios і Cheerio чудово підходять для базової пагінації, ці антиботові системи все одно можуть заважати. Саме тому я рекомендую Bright Data або Oxylabs. Це повноцінне рішення для вебскрапінгу, яке допомагає скрапити сайти, не переймаючись блокуванням.
З Bright Data або Oxylabs ви можете отримати доступ до ротаційних проксі, розв’язання CAPTCHA та інших інноваційних можливостей, які роблять вебскрапінг простішим і надійнішим. Тож якщо ви хочете, щоб ваш вебскрапінг був плавним і безперервним, Bright Data та Oxylabs точно варто розглянути. Це заощадить вам час і зайві клопоти, щоб ви могли зосередитися на збиранні потрібних вам даних!
