CoderCastrov logo
CoderCastrov
Роботизированныйпроцессавтоматизации

Автоматизация взаимодействий с помощью Puppeteer

Автоматизация взаимодействий с помощью Puppeteer
просмотров
4 мин чтение
#Роботизированныйпроцессавтоматизации

Все лайки, комментарии и упоминания, которые я получаю в Instagram, от реальных людей? К сожалению, нет.

В этой статье я объясню, что такое и как работает бот для взаимодействий в Instagram. И если вы любопытны, оставайтесь, потому что я покажу вам, как вы можете создать свой собственный.

Сначала самое главное,

Что такое бот?

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

Имея это в виду, цель бота для взаимодействий - автоматизировать, например, лайки, комментарии и т.д.

Отлично, но...

Какие инструменты существуют для автоматизации задач?

Среди наиболее известных технологий есть:

Selenium, Cypress, Cucumber и т.д. Но в этом случае мы сосредоточимся на инструменте, предоставляемом Google: Puppeteer.

Puppeteer является одной из самых новых технологий по сравнению с альтернативами и, следовательно, он получает преимущества от последних достижений в технологии веб-браузеров. Еще одним преимуществом Puppeteer является то, что он является OpenSource, поэтому, помимо поддержки со стороны Google, у нас есть сообщество, которое ежедневно вносит улучшения.

Отлично, а что насчет моего бота? Давайте к этому перейдем.

Начальная настройка

Давайте посмотрим, как мы можем автоматизировать вход в Instagram.

Инициализируем проект NodeJs с помощью следующей команды:

npm init

Укажем имя нашего проекта, в данном случае ‘my-first-bot’.

В качестве каталога ввода мы установим scraper.js’.

В разделе ‘scripts’ укажем следующую команду:

"scripts": {
     "start": "node scraper.js"
 },

У нас будет файл с именем _‘package.json’ со следующим содержимым:

{
 "name": "my-first-bot",
 "version": "1.0.0",
 "description": "A instagram bot",
 "main": "scraper.js",
 "scripts": {
     "start": "node scraper.js"
 },
 "author": "Abel Maroñas",
 "license": "ISC"
}

Затем установим зависимости: Puppeteer и Puppeteer Core. Введем эти команды в консоли и установим:

npm i puppeteer puppeteer-core

Создадим файл в корне с именем ‘scraper.js’ и на данный момент у нас должна быть такая структура:

Конфигурация бота

Нашей целью является создание экземпляра браузера, чтобы перейти на Instagram и авторизоваться в нашем боте.

После подготовки наших файлов, мы импортируем Puppeteer и определяем две асинхронные функции в файле 'scraper.js': launchBrowser и loginToInstagram.

//scraper.js
const puppeteer = require("puppeteer");

async function launchBrowser() {
    
}

async function loginToInstagram() => {
   
}

Puppeteer предоставляет нам API для управления Chrome, в данном случае Chromium.

Для этого мы используем функцию 'launch', которая запускает экземпляр этого браузера, и устанавливаем свойство 'headless' в false, чтобы видеть поведение бота. Если не установить его на true, он будет выполняться в фоновом режиме.

Затем мы вызываем функцию 'newPage', которая открывает новую вкладку, и используем функцию 'goto', чтобы перейти на главную страницу Instagram.

Наконец, мы вызываем функцию 'loginToInstagram' и передаем ей параметр 'page', чтобы использовать содержимое этой страницы:

//scraper.js
function launchBrowser () {
    const browser = await puppeteer.launch({ headless: false });
    const page = await browser.newPage();

    await page.goto("https://www.instagram.com/");

    await loginToInstagram(page);
}

Теперь давайте настроим процесс автоматизации для заполнения полей имени пользователя и пароля, которые требуются для входа в Instagram.

Для этого мы будем использовать три функции Puppeteer:

Мы находим нужные селекторы (имя пользователя, пароль и кнопка входа) и передаем их в качестве параметров:

//scraper.js
async function loginToInstagram(page) {
    await page.waitForSelector("input[name='username']");
    await page.type('input[name="username"]', "your_username");
    await page.type('input[name="password"]', "your_password");
    await page.click('button[type="submit"]');
}

Наконец, давайте вызовем функцию 'launchBrowser':

//scraper.js
const puppeteer = require("puppeteer");

async function launchBrowser () {
    const browser = await puppeteer.launch({ headless: false });
    const page = await browser.newPage();

    await page.goto("https://www.instagram.com/");

    loginToInstagram(page);
}

async function loginToInstagram(page) {
    await page.waitForSelector("input[name='username']");
    await page.type('input[name="username"]', "your_username");
    await page.type('input[name="password"]', "your_password");
    await page.click('button[type="submit"]');
}

launchBrowser();

Запустите 'npm run start' и, если все прошло хорошо, у вас должен открыться браузер с вашей лентой Instagram, без необходимости вводить учетные данные! ... По крайней мере, не в этот момент.

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

Мы можем автоматизировать, например, нажатие кнопки "Нравится" на публикации, имея селектор кнопки:

async function giveLike(page) {
    let likeButtonSelector = "section ._aamw > button._abl-"
    await page.waitForSelector(likeButtonSelector);
    await page.$eval(likeButtonSelector, (el) => el.click());
}

Или размещение комментария:

async function addComment(page) {
    let commentTextArea = "textarea._ablz._aaoc";
    let commentButton = "button._acan._acao._acas";
    await page.waitForSelector(commentTextArea);
    await page.type(commentTextArea, "I'm not a bot! 👀");

    await page.$eval(commentButton, (el) => el.click());
}

Учтите, что Instagram время от времени меняет названия классов элементов, поэтому эти селекторы могут не работать.

Я поделюсь ссылкой, которая показывает, как получить их: Получение селектора элемента.

И вот ссылка на официальную документацию, чтобы продолжить изучение.

Заключительные выводы

Мы видим, что Puppeteer способен автоматизировать процессы простым и понятным способом.

Помимо создания ботов для автоматического взаимодействия, мы можем использовать его в нашей рабочей среде для тестирования функциональности и поведения. Получать последние новости из наших любимых газет, получать продукты с разных веб-сайтов для сравнения их цен и т. д. Единственное ограничение - наше воображение.

Большое спасибо за прочтение этого поста. Если вы хотите, чтобы я более подробно рассмотрел эту тему или у вас есть какие-либо вопросы, оставьте их в комментариях!

Приветствия!