Рубрики
Без рубрики

Ultimate Guide To Web Scraping с использованием JavaScript (Node.js + Cuppeteter)

В этом посте вы узнаете, как просматривать веб-страницы, используя JavaScript с Nodejs и uppereer. Мы будем использовать технику udrolless для страницы ecommerce ecommerce. Кукольщик использует браузер Chrome для автоматизации

Автор оригинала: Manthan Koolwal.

В этом посте мы научимся просматривать веб-страницы с помощью автоматизации браузера с JavaScript. Мы будем использовать uppereer для этого. Кукла это API библиотеки узла, которая позволяет нам контролировать безголовый хром. Без головы хрома это способ запуска браузера Chrome без фактического запуска Chrome.

Как правило, веб-соскоб разделен на две части:

  1. Получение данных, сделав HTTP-запрос
  2. Извлечение важных данных путем разбора HTML DOM

Мы собираемся соскребать книгу и название от этого Сайт Отказ Какой поддельный книжный магазин специально установлен, чтобы помочь людям практиковать соскабливание.

Наша настройка довольно проста. Просто создайте папку и установите кукур. Для создания папки и установки библиотек введите ниже заданные команды. Я предполагаю, что вы уже установили Node.js.

mkdir scraper 
cd scraper 
npm i puppeteer — save

Теперь создайте файл внутри этой папки по любому имени, который вам нравится. Я использую Scraping.js.

Теперь вставьте следующий код котельной в SCRAPING.JS

const puppeteer = require('puppeteer');
let scrape = async () =\> { 
 // Actual Scraping goes Here… 
 // Return a value 
}; 

scrape().then((value) =\> { 
 console.log(value); 
 // Success!
});

Давайте пройдемся по этому примеру строку по линии.

  • Линия 1: нам требуется зависимость кукловатора, которую мы установили ранее
  • Строка 3-7: это наша главная функция Scrape Отказ Эта функция проведет весь наш код автоматизации.
  • Строка 9: Здесь мы вызываем наши Scrape () функция. (Запуск функции).

Что-то важное, что наше Scrape () Функция – это async функция и использует новые ES 2017 Async/await Особенности. Потому что эта функция асинхронная, когда она называется, возвращает Обещание Отказ Когда async Функция наконец возвращает значение, Обещание будет разрешаться (или letefe Если есть ошибка).

Так как мы используем async Функция, мы можем использовать ждать Выражение, которое приостановит выполнение функции и ждать Обещание разрешить, прежде чем двигаться дальше. Это нормально, если ничто из этого не имеет смысла прямо сейчас. Это станет яснее, поскольку мы продолжаем с учебником.

Мы можем проверить вышеуказанный код, добавив строку кода на Scrape функция. Попробуйте это:

let scrape = async () =\> { return 'test'; };

Сейчас беги Узел Scrape.js в консоли. Вы должны получить Тест Вернулся! Идеально, наше возвращенное значение регистрируется в консоли. Теперь мы можем начать заполнять наши Scrape функция.

Первое, что нам нужно сделать, это создать экземпляр нашего браузера, открыть новую страницу и перейдите к URL. Вот как мы это делаем:

let scrape = async () =\> { 
 const browser = await puppeteer.launch({headless: false}); 
 const page = await browser.newPage(); 
 await page.goto('[http://books.toscrape.com/catalogue/a-light-in-the- attic\_1000/index.html](http://books.toscrape.com/catalogue/a-light-in-the-attic_1000/index.html)'); 
 await page.waitFor(1000); 
 // Scrape browser.close(); 
 return result;
};

Потрясающие! Давайте сломаемся линейкой по линии:

Во-первых, мы создаем наш браузер и установите без головы Режим для ложь Отказ Это позволяет нам смотреть именно то, что происходит:

const browser = await puppeteer.launch({headless: false});

Затем мы создаем новую страницу в вашем браузере:

const page = await browser.newPage();

Далее мы ходим в books.toscrape.com URL:

await page.goto('[http://books.toscrape.com/catalogue/a-light-in-the-attic\_1000/index.html](http://books.toscrape.com/catalogue/a-light-in-the-attic_1000/index.html)');

При желании я добавил задержку 1000 Миллисекунды. Пока нормально не нужно, это обеспечит все на странице нагрузки:

await page.waitFor(1000);

Наконец, после того, как все сделано, мы закроем браузер и вернем наш результат.

browser.close(); return result;

Настройка завершена. Теперь, давайте соскребать!

Вероятно, теперь вы должны иметь представление о том, что мы собираемся соскребать. Мы собираемся соскребать название книги и ее цену.

Web Scraping с помощью JavaScript (Node.js + Cuppeteter)
Web Scraping с помощью JavaScript (Node.js + Cuppeteter)

Глядя на API uppeter, мы можем найти метод, который позволяет нам получить HTML из страницы.

Для того, чтобы получить эти значения, мы будем использовать Page.evalatue () метод. Этот метод позволяет нам использовать встроенные селекторы DOM, такие как QuerySelector () Отказ

Первое, что мы сделаем, это создать наши Page.evalatue () Функция и сохранить возвращенное значение для переменной с именем Результат :

const result = await page.evaluate(() =\> { // return something });

В рамках нашей функции мы можем выбрать элементы, которые мы желаем. Мы будем использовать инструменты Google Developer, чтобы выяснить это снова. Щелкните правой кнопкой мыши на заголовке и выберите «Проверьте»:

Web Scraping с помощью JavaScript (Node.js + Cuppeteter)
Web Scraping с помощью JavaScript (Node.js + Cuppeteter)

Как вы увидите на панели элементов, заголовок просто H1 элемент. Теперь мы можем выбрать этот элемент со следующим кодом:

let title = document.querySelector('h1');

Поскольку мы хотим текст, содержащийся в этом элементе, нам нужно добавить .innertext – Вот, как выглядит окончательный код:

let title = document.querySelector('h1').innerText;

Точно так же мы можем выбрать цену, щелкнув правой кнопкой мыши и проверку элемента:

Web Scraping с помощью JavaScript (Node.js + Cuppeteter)
Web Scraping с помощью JavaScript (Node.js + Cuppeteter)

Как видите, наша цена имеет класс Price_color Отказ Мы можем использовать этот класс, чтобы выбрать элемент и его внутренний текст. Вот код:

let price = document.querySelector('.price\_color').innerText;

Теперь, когда у нас есть текст, который нам нужен, мы можем вернуть его в объект:

return { title, price }

Потрясающие! Теперь мы выбираем название и цену, сохраняя их на объект и возвращая значение этого объекта к Результат Переменная. Вот что похоже, когда все это собрано:

const result = await page.evaluate(() =\> { let title = document.querySelector('h1').innerText; let price = document.querySelector('.price\_color').innerText;return { title, price }});

Единственное, что осталось сделать, это вернуть наш Результат Так что его можно зарегистрироваться в консоль:

return result;

Вот что должен выглядеть ваш окончательный код:

const puppeteer = require('puppeteer'); 
let scrape = async () =\> { 
const browser = await puppeteer.launch({headless: false}); 
const page = await browser.newPage(); 
await page.goto('[http://books.toscrape.com/catalogue/a-light-in-the-attic\_1000/index.html](http://books.toscrape.com/catalogue/a-light-in-the-attic_1000/index.html)'); 
await page.waitFor(1000); 
const result = await page.evaluate(() =\> { 
let title = document.querySelector('h1').innerText; 
let price = document.querySelector('.price\_color').innerText; 
return {title,price}});
browser.close(); 
return result; 
};

scrape().then((value) =\> { 
console.log(value); 
// Success! 
});

Теперь вы можете запустить файл узла, введя следующее в консоль:

node scrape.js// { title: 'A Light in the Attic', price: '£51.77' }

Вы должны увидеть название и цену выбранной книги, возвращенной на экран! Вы только что соскабливал в Интернете!

Сделать это совершенным

Теперь, чтобы соскрести все названия книги с самой домашней страницы, для начинающих было бы немного сложнее. Тем не менее, это предоставляет идеальную возможность для вас практиковать новые навыки соскоб!

Подсказка: главное различие между этой проблемой и предыдущим примером является необходимость в петле через кучу результатов. Вот как вы можете настроить свой код, чтобы сделать это:

const result = await page.evaluate(() =\> { 
 let data = []; // Create an empty array 
 let elements = document.querySelectorAll('xxx'); 
 // Select all 
 // Loop through each proudct 
 // Select the title 
 // Select the price data.push({title, price}); 
 // Push the data to our array return data; 
 // Return our data array});

Заключение

В этой статье мы поняли, как мы можем соскребать данные, используя Nodejs & Cuppeteer независимо от типа веб-сайта. Не стесняйтесь комментировать и спросите меня что-нибудь. Вы можете следовать за мной на Twitter и Средний Отказ Спасибо за чтение и нажмите кнопку «Нравится»! 👍.

Дополнительные ресурсы

И есть список! На данный момент вы должны чувствовать себя комфортно, написав свой первый веб-скребок, чтобы собрать данные с любого веб-сайта. Вот несколько дополнительных ресурсов, которые вы можете найти полезным во время вашего Scraping Traint:

Список бесплатных веб-инструментов Scraping 10 лучших провайдеров жилых доверений Документация Щелки Руководство по веб-сосконию