Автор: Leonid Filatov
Эксклюзивно для форума: xss.pro
Часть: [2/2]
Ссылка на первую статью: xss.pro/threads/126089/
Сегодня мы в очередной раз создадим Брут/Чекер, который будет входить в аккаунт и парсить имя владельца аккаунта и кол-во поинтов.
Общая информация по разработке конфигов для OpenBullet 2 из моих статей:
Дополнительно:
ПОРЯДОК ДЕЙСТВИЙ:
Итак, на этом с настройкой закончили. Теперь приступим к созданию самого скрипта!
Для начала нам как и раньше нужно найти отдельную страницу входа (если она существует на сайте). Для чего это в софте на эмуляции браузера?
ШАГ 1. ДОБАВЛЯЕМ КУБИК "NAVIGATE TO" [ОТКРЫВАЕМ СТРАНИЦУ ВХОДА]:
Этот кубик непосредственно загружает ссылку на страницу авторизации.
Нажимаем "Start" и видим, что у нас открылась нужная нам страница:
ШАГ 2. ДОБАВЛЯЕМ КУБИК "WAIT FOR ELEMENT" [ЖДЁМ ПОЯВЛЕНИЯ ПОЛЯ ВВОДА EMAIL]:
Кубик, который мы используем сейчас - выполняет функцию "Ждуна селекторов". Таким образом скрипт поймёт, что страница точно загрузилась. Я предлагаю зацепиться за элемент с окном ввода "Email", потому что таким образом скрипт увидит, что поле для ввода электронной почты успешно загрузилось, а значит и страница загрузилась и это будет сигналом для того, что можно начинать вводить Email и Pass от аккаунта. но для начала поймём как вообще правильно создавать устойчивый XPath для поиска необходимого элемента.
Теперь давайте для начала найдём как вообще выглядит этот элемент на странице. Как обычно в моих уроках будем использовать браузер Mozilla Firefox:
Отлично! У нас есть информация о том, какой элемент нам нужно ожидать! Теперь добавляем кубик "Wait For Element".
ШАГ 3. ДОБАВЛЯЕМ КУБИК "TYPE HUMAN" [ВВОДИМ USERNAME]:
Этот кубик позволяет скрипту эмулировать печатание реального человека. Если вашему скрипту нужно ввести текст в каком-либо поле, будь то вход на сайт, или же отправка сообщения, то лучше всегда использовать не просто "Type", а именно "Type Human". Потому что сайты как правило любят, чтобы текст вводился не моментально (CTRL+C / CTRL+V), а постепенно, прямо как это делает реальный человек.
Но помните, что я сказал обратить внимание на баг в OpenBullet 2 версии 0.3.2 в самом начале статьи? Если забыли, то посмотрите выше (в самом начале выделено красным).
Именно из-за этого бага мы в этот раз мы будем использовать НЕ XPATH, А РЕЖИМ SELECTOR!
Для начала давайте преобразуем наш XPATH из прошлого шага в SELECTOR, после чего уже будем использовать его в нашем кубике.
Теперь добавляем кубик "Type Human":
Нажимаем "Start" и видим, что скрипт успешно ввёл USERNAME:
ШАГ 4. ДОБАВЛЯЕМ КУБИК "TYPE HUMAN" [ВВОДИМ PASSWORD]:
Повторяем тоже самое, что мы сделали в предыдущем шаге, только делаем это с полем ввода пароля. Я не буду опять показывать как найти и скопировать код поля ввода пароля.
Но я бы советовал вам просить ChatGPT сначала сделать XPATH, а потом из этого XPATH уже сделать SELECTOR. Почему-то так результат выходит лучше.
В этом нам поможем следующий Prompt:
Теперь добавляем кубик "Type Human":
ШАГ 5. ДОБАВЛЯЕМ КУБИК "CLICK" [ЖМЕМ НА КНОПКУ LOGIN]:
Теперь после ввода нужных нам данных нам нужно нажать на кнопку входа в аккаунт. Давайте разберем код элемента нужной нам кнопки.
Как мы можем видеть, то мы можем закрепиться к этому элементу по id="btnLogin". Это будет хорошим и стабильным выбором.
Делаем SELECTOR так же, как в предыдущем шаге.
Теперь добавляем кубик "Click":
Нажимаем "Start" и видим, что скрипт успешно ввёл USERNAME, PASSWORD и нажал на кнопку LOGIN:
Так же видим, что в браузере после попытки входа в аккаунт мы увидили страницу с содержимым:
Я специально ввёл НЕВАЛИДНЫЕ данные, ведь это поможем нам "поймать" определние для "BAD". (Узанём, что выдаёт нам сайт после НЕУДАЧНОГО входа.)
Конкретно в нашем случае будем вычислять BAD по тексту ""Message" : "Unable to log on"
Теперь войдём под ВАЛИДНЫМИ данными:
После успешного входа мы получили страницу с таким содержимым:
А вот GOOD мы будем определять по тексту "Redirect" : "MyAccount/Dashboard"
ШАГ 6. ДОБАВЛЯЕМ КУБИК "WAIT FOR NAVIGATION" [ОЖИДАНИЕ ЗАГРУЗКИ СТРАНИЦЫ ПОСЛЕ АВТОРИЗАЦИИ]:
В OpenBullet 2, кубик Wait for Navigation отвечает за ожидание завершения перехода на новую страницу или загрузки контента после выполнения действий, которые инициируют навигацию (например, нажатие на кнопку, отправка формы). Он полезен для того, чтобы гарантировать, что скрипт не будет продолжать выполнение до тех пор, пока не завершится процесс загрузки новой страницы или не обновится текущая.
Этот кубик помогает избежать ошибок, связанных с попыткой взаимодействовать с элементами на странице до их полной загрузки. Таким образом мы точно будем знать, что страница с результатом нашего входа точно была загружена!
ШАГ 7. ДОБАВЛЯЕМ КУБИК "GET DOM" [ПОЛУЧАЕМ КОД СТРАНИЦЫ ПОСЛЕ АВТОРИЗАЦИИ]:
Кубик Get DOM извлекает и сохраняет весь HTML-код текущей страницы, что позволяет анализировать или искать нужные данные в полученном коде страницы, которую открыл скрипт в предыдущем шаге.
ШАГ 8. ДОБАВЛЯЕМ КУБИК "KEYCHECK" [ОПРЕДЕЛЕНИЕ GOOD/BAD]:
Вы уже должны знать из моих ранних статей что это за кубик и какие функции он выполняет. Поэтому просто скажу как заполнить.
ШАГ 8.1. ДОПОЛНЯЕМ КУБИК "KEYCHECK" [ДОП. ОПРЕДЕЛЕНИЕ GOOD/BAD]:
Во время тестирования скрипта выяснилось, что иногда скрипт после успешного входа в аккаунт редиректит не на такую страницу, которую мы получили на пятом шаге, а напрямую в личный кабинет! Вот пример:
Давайте добавим дополнительное определение GOOD в наш кубик "Keycheck". Я уже вижу, что на этой странице мы можем зацепиться за элемент, в котором находятся все данные о транзакциях пользоватя. Можете его найти по надписи "My Transactions".
Почему именно этот элемент? Да потому что только авторизованный пользователь будет видеть такой блок, логично же
Теперь смотрим на код элемента и видим, что вся информация о транзакциях находится в элементе, который содежрит в себе id="myaccount-transactions-latest"
Теперь просто добавляем в кубик (НЕ СОЗДАЁМ НОВЫЙ) "Keycheck" это значение. Нам не нужен XPATH/SELECTOR в этой ситуации, ведь нам нужно просто найти это "словосочетание" в коде страницы. Просто повторяйте за скриншотом ниже.
Таким образом мы научили наш скрипт обрабатывать два исхода событий.
Нажимаем "Start" и видим, что скрипт успешно отработал и завершился со статусом "SUCCESS":
ШАГ 9. ДОБАВЛЯЕМ КУБИК "NAVIGATE TO" [ОТКРЫВАЕМ СТРАНИЦУ С ДАННЫМИ ОБ АККАУНТЕ]:
Теперь нам нужно добавить те действия, которые произойдут после того, как мы успешно вошли в аккаунт. В прошлой статье на этапе 1 мы поставили такие настройки, чтобы OB2 закрывал окна браузера в случае если мы получим статус FAIL, BAN или ERROR, а вот после SUCCESS у нас браузер не закрывается, ведь аккаунт, а значит и экземпляр браузера нам ещё будет нужен, чтобы спарсить имя владельца аккаунта и кол-во поинтов на аккаунте, закроем мы его сами в самом конце работы скрипта!
Для успешного парсинга нужных данных как обычно ищем странцу, с которой эти данные можно спарсить.
Теперь нам нужно сделать так, чтобы скрипт 100% открывал страницу Dashboard, ведь нам нужно получить код с этой страницы, чтобы спарсить с неё нужно информацию (имя и кол-во поинтов). А у нас она открывается только в 50% случаев (после авторизации). Для этого добавляем кубик "Navigate To".
ШАГ 10. ДОБАВЛЯЕМ КУБИК "WAIT FOR ELEMENT" [ЖДЁМ ПОЛНОЙ ЗАГРУЗКИ DASHBOARD]:
На данном этапе нам нужно дождаться полной загрузки страницы Dashboard, поэтому опять используем наш "Ждун селекторов". По сути повторяем шаг 2.
В шаге 8.1 мы уже по сути нашли всё, что нам нужно, а именно элемент "id="myaccount-transactions-latest"", который отвечает за блок с последними транзакциями на аккаунте во вкладке Dashboard.
Теперь давайте просто сделаем для него XPATH.
Создаём кубик "Wait For Element":
ШАГ 11. ДОБАВЛЯЕМ КУБИК "GET DOM" [ПОЛУЧАЕМ КОД СТРАНИЦЫ DASHBOARD]:
Мы успешно перешли на страницу Dashboard, дождались появления нужного нам элемента, а это значит что страница загружена полностью и готова к работе. Теперь мы должны получить HTML код страницы Dashboard.
Нажимаем "Start" и видим, что скрипт вошёл в аккаунт, открыл страницу Dashboard и после чего сохранил HTML код страницы в переменную "ACCOUNT_DETAILS":
ШАГ 12. ДОБАВЛЯЕМ КУБИК "PARSE" [ПАРСИМ ИМЯ ВЛАДЕЛЬЦА АККАУНТА ИЗ ПОЛУЧЕННОГО HTML КОДА]:
Мы уже почти у финиша, осталось всего лишь распарсить нужные нам значения из кода и положить их в переменные. Давайте найдём в каком элементе у нас лежит имя.
Как вы могли увидеть на шаге 11 - имя владельца нашего аккаунта "Debby Macfarlane". Давайте найдём этот текст в нашем коде.
Теперь мы имеем представление, что имя лежит вот в этом элементе:
А именно между <span class="textfitted" style="font-size: 30px;"> и </span>
Если вы уже читали мои статьи, то вам на ум сразу должно прийти, что мы просто можем вырезать этот текст через "LR" в кубике "Parse". Но если вам вы не читали, то просто повторяйте за мной.
ШАГ 13. ДОБАВЛЯЕМ КУБИК "PARSE" [ПАРСИМ КОЛ-ВО ПОИНТОВ НА АККАУНТЕ ИЗ ПОЛУЧЕННОГО HTML КОДА]:
Нам не нужно получать DOM сайта ещё раз, ведь он уже лежит в нужной нам переменной (ACCOUNT_DETAILS). Просто повторяем предыдущий шаг с небольшими отличиями.
Добавляем кубик "Parse":
ШАГ 14. ДОБАВЛЯЕМ КУБИК "CLOSE BROWSER" [ЗАВЕРШАЕМ РАБОТУ]:
На этом логика работы нашего скрипта заканчивается. Добавляем последнее действие "Close Browser", чтобы закрыть экземпляр браузер Chrome. Это нужно для экономии ресурсов, а так же это поможет избежать "Висящих" процессов браузеров.
Жмём "Save" и сохраняем наш конфиг.
В ОДНОПОТОЧНОМ РЕЖИМЕ:
Как обычно прямо в редакторе скрипта "Start" и видим, что скрипт успешно зашёл на аккаунт, спарсил все необходимые данные, закрыл браузер и завершил поток со статусом "Success".
В МНОГОПОТОЧНОМ РЕЖИМЕ:
Я уже объяснял как запускать конфиг полноценно и в многопотоке в конце этой статьи - xss.pro/threads/125492/
Есть только одно отличие:
Следует учесть, что ИНОГДА нужно включать обратно Headless режим. Как это сделать смотрите в первой статье - xss.pro/threads/126089/. (Этап 1.)
После включения Headless режима вы не будете видеть запущенных браузеров Chrome, т.к всё будет выполняться в фоновом режиме. Это будет экономить ресурсы ПК и вообще удобнее в разы.
Но учтите, что не все сайты дадут вам работать в Headless режиме! Они это палят и иногда присекают, поэтому это опциональная функция.
В принципе можете включить Headless режим и запустить скрипт в редакторе кода в один поток (где мы добавляем кубики) ради теста.
РЕЗУЛЬТАТ:
У меня в многопотоке и в Headless режиме все успешно работает на нашем целевом сайте. Вот часть того, что мне удалось сбрутить:
Я надеюсь, что я дал вам понимание что такое Puppeteer и как он вообще работает, ведь это было по сути самой главной целью этого цикла статей.
В ближайшем скорее всего напишу ещё статью по обходу капчи через OB2 + Puppeteer, я думаю это будет полезно при разработке ботов, но скорее всего это будет одной из последних статей по OB2.
На это тоже есть свои причины, ведь у меня в планах большой цикл статей по Browser Automation Studio (BAS), а для него нужно подготовить грамотную структуру, чтобы вводить в тему постепенно, т.к возможностей, а значит и информации там больше.
Буду благодарен вашему лайку, так я увижу, что мой материал действительно интересен людям!
Если вам есть что добавить по теме разработки на OpenBullet 2, например, полезные советы по маскировке браузера, чтобы сайты не распознавали бота, или другая интересная информация - пожалуйста, делитесь в этой или других темах. Я всегда рад узнать что-то новое, как, думаю, и многие участники форума!
Не буду изменять своим традициям и для особо любопытных оставляю исходник!
Всем удачи, свидимся!
Эксклюзивно для форума: xss.pro
Часть: [2/2]
Ссылка на первую статью: xss.pro/threads/126089/
Предисловие.
Всем трям! В первой части мы с вами настроили OpenBullet 2 для работы с Puppeteer - популярного фреймворка для автоматизации браузера Chrome. Разобрались, как подготовить OB2 для полноценной эмуляции браузера. В следующих шагах мы попробуем применить эти настройки на практике и создадим наш первый скрипт для автоматизации простых действий. Готовы? Тогда вперёд!
Сегодня мы в очередной раз создадим Брут/Чекер, который будет входить в аккаунт и парсить имя владельца аккаунта и кол-во поинтов.
Что нам понадобится в этом уроке?
Знания:
Общая информация по разработке конфигов для OpenBullet 2 из моих статей:
- Ссылка на первую статью: xss.pro/threads/125338/
- Ссылка на вторую статью: xss.pro/threads/125492/
- Ссылка на третью статью: xss.pro/threads/125906/
- Ссылка на первую статью: xss.pro/threads/126089/
- Сегодня нашей целью выступит Канадская версия сайта GameStop - GameStop.ca.
Дополнительно:
- Валидный аккаунт от сайта GameStop.ca. Регистрируем сами на временную почту, либо находим аккаунт в логах.
- Любая (даже бесплатная) нейросеть (ChatGPT/Gemini/Sonnet). Если вы уже читали мои ранние статьи, то знаете, что с помощью них я составляю XPath для поиска нужных мне элементов на странице.
- На момент разработки скрипта для статьи мною была обнаружена ошибка в Open Bullet 2 версии 0.3.2. Она не позволяет использовать XPath для выполнения функций "Click" и "Type/Type Human", просто вылетает критическая ошибка при старте конфига. Именно по этому в данной статье помимо XPath мы будем использовать ещё и режим "Selector" для поиска нужных элементов.
- Если вы читаете эту статью в будущем, когда уже есть новые версии, то попробуйте использовать только XPath для поиска элементов.
Этап 0. Подготовка конфига.
В первой части статьи мы уже запустили небольшой скрипт, который открыл нам страницу нашего форума (xss.pro). Но дело в том, что там мы не добавили одну важную настройку, а именно - установку случайного User-Agent для каждого экземпляра браузера! (Простите, я просто забыл). Поэтому на этом этапе мы сейчас ПРАВИЛЬНО НАСТРОИМ конфиг, а на следующем этапе уже приступим к созданию самого скрипта.
ПОРЯДОК ДЕЙСТВИЙ:
- Настраиваем конфиг для работы с прокси и работы с базами вида email:pass. Это мы делали во второй статье (xss.pro/threads/125492/) в разделе "Этап 0.1. Настройка конфига."
- Делаем всё тоже самое, что делали в предыдущей статье (xss.pro/threads/126089/) в разделе "Этап 1. Настройка OpenBullet 2 для работы с Puppeteer."
- Добавляем USERNAME и PASSWORD в переменные как во второй статье (xss.pro/threads/125492/) в разделе "Этап 1. Сохраняем USERNAME и PASSWORD в переменные."
- Добавляем кубик "Random User-Agent", выбираем User-Agent для Windows и сохраняем в переменную "USER_AGENT".
- Теперь добавляем кубик "Open Browser".
- Добавляем кубик "Clear Cookies", в поле Website вписываем ссылку "https://www.gamestop.ca/"
- Добавляем кубик "Set User-Agent" и в поле "User Agent" вводим переменную <USER_AGENT> в которую мы сохранили наш случайный юзерагент!
Этап 1. Создание конфига.
Для начала нам как и раньше нужно найти отдельную страницу входа (если она существует на сайте). Для чего это в софте на эмуляции браузера?
- Это нужно для того, чтобы скрипт не сильно нагружал наш компьютер, ведь мы помним, что делаем скрипт, который будет работать на движке Google Chrome, а это значит если мы выставим даже 40 потоков, то считайте что у вас будет открыто 40 активных экземпляров браузера в которых всегда будет что-то грузится, вводится текст и так далее, что даст по голове многим ПК!
- Вы только представьте, допустим вы ходите на главную страницу GameStop.ca, после чего сайту нужно загрузить вообще все картинки, скрипты, анимации, стили и т.д, что являетя довольно таки ёмким процессом по потреблению ресурсов и трафика, особенно когда у вас не один, а 40 таких браузеров!
- Дальше, поле того как мы загрузили главную страницу нам нужно будет ещё добавить несколько лишних действий, чтобы в итоге прийти на страницу, ссылку на которую мы просто можем найти заранее, а именно "gamestop.ca/Account/Login". Так не проще ли нам сразу открыть эту страницу и начать сразу вводить логин и пароль? Верно, в 90% случаев именно так и будет проще!
ШАГ 1. ДОБАВЛЯЕМ КУБИК "NAVIGATE TO" [ОТКРЫВАЕМ СТРАНИЦУ ВХОДА]:
Этот кубик непосредственно загружает ссылку на страницу авторизации.
- Label: SITE LOADING
- Loaded Event: Load
- Timeout: 60000 - Даём скрипту минуту на загрузку страницы. Если не успеет загрузить страницу входа, то поток завершится.
ШАГ 2. ДОБАВЛЯЕМ КУБИК "WAIT FOR ELEMENT" [ЖДЁМ ПОЯВЛЕНИЯ ПОЛЯ ВВОДА EMAIL]:
Кубик, который мы используем сейчас - выполняет функцию "Ждуна селекторов". Таким образом скрипт поймёт, что страница точно загрузилась. Я предлагаю зацепиться за элемент с окном ввода "Email", потому что таким образом скрипт увидит, что поле для ввода электронной почты успешно загрузилось, а значит и страница загрузилась и это будет сигналом для того, что можно начинать вводить Email и Pass от аккаунта. но для начала поймём как вообще правильно создавать устойчивый XPath для поиска необходимого элемента.
Теперь давайте для начала найдём как вообще выглядит этот элемент на странице. Как обычно в моих уроках будем использовать браузер Mozilla Firefox:
- Наводим на поле ввода Email, нажимаем ПКМ и жмём "Inspect (Q)".
- После чего мы видим, что браузер показывает нам код элемента, который принадлежит окну ввода Email.
- Наша задача - создать максимально устойчивый путь до элемента с помощью XPath. Просто поймите, что нам нужно указать скрпипту максимально устойчивый и долговечный путь до элемента, ведь таким образом наш скрипт будет максимально долговечным. Нужно использовать только статичные элементы, А НЕ ДИНАМИЧЕСКИЕ.
- Пример динамического элемента: "class="form-input-njaSHsQ32". Где мы видим что в элементе есь набор символов "njaSHsQ32", скорее всего при каждом обновлении страницы этот набор символов будет меняться, поэтому у нас не получится создать скрипт, который всегда будет ждать или кликать на этот элемент. ведь он всегда будет разный.
- Пример статичного элемента: Конкретно в нашем случае мы видим, что в нашем элементе есть input id="UserName" и name="UserName". Именно за этот код мы и можем зацепиться.
- Теперь составить XPath нам как обычно поможет ChatGPT! Для начала скопируем код элемента, жмем ПКМ на наш элемент, который выделен синим и тыкаем "Edit As HTML".
- После чего копируем код элемента, открываем ChatGPT и пишем ей такой prompt:
HTML:
Код элемента:
<input data-val="true" data-val-regex="Invalid Email Address" data-val-regex-pattern="^[-!#$%&'*+\/0-9=?A-Z^_a-z{|}~](\.?[-!#$%&'*+\/0-9=?A-Z^_a-z{|}~])*@[a-zA-Z0-9](-?[a-zA-Z0-9])*(\.[a-zA-Z](-?[a-zA-Z0-9])*)+$" data-val-required="The E-mail field is required" id="UserName" name="UserName" placeholder=" " type="text" value="" aria-describedby="UserName-error" aria-invalid="true">
Задача:
Создай XPath для этого элемента. Он должен находить элемент по input data-val="true" и name="UserName". Учти, что это XPATH для OpenBullet 2. Пойми все его особенности и сделай качественный XPATH.- После чего получаем в ответ нужный нам XPath:
Код:
//input[@data-val='true' and @name='UserName']- Label: EMAIL INPUT FIELD WAITING
- Find By: XPath - Указываем скрипту какой из методов поиска элементов будем использовать.
- Identifier: //input[@data-val='true' and @name='UserName'] - Путь до элемента на странице (XPath).
- Visible: Ставим галочку в чекбокс - Скрипт будет ждать, пока элемент станет ВИДЕН на странице.
- Timeout: 60000
- Теперь жмем "Start" и смотрим в лог. Мы видим следующее: скрипт успешно открывает браузер, заходит на страницу авторизации GameStop.ca, ждёт нужный нам элемент и после чего завершается.
ШАГ 3. ДОБАВЛЯЕМ КУБИК "TYPE HUMAN" [ВВОДИМ USERNAME]:
Этот кубик позволяет скрипту эмулировать печатание реального человека. Если вашему скрипту нужно ввести текст в каком-либо поле, будь то вход на сайт, или же отправка сообщения, то лучше всегда использовать не просто "Type", а именно "Type Human". Потому что сайты как правило любят, чтобы текст вводился не моментально (CTRL+C / CTRL+V), а постепенно, прямо как это делает реальный человек.
Но помните, что я сказал обратить внимание на баг в OpenBullet 2 версии 0.3.2 в самом начале статьи? Если забыли, то посмотрите выше (в самом начале выделено красным).
Именно из-за этого бага мы в этот раз мы будем использовать НЕ XPATH, А РЕЖИМ SELECTOR!
Для начала давайте преобразуем наш XPATH из прошлого шага в SELECTOR, после чего уже будем использовать его в нашем кубике.
- Пишем ChatGPT следующий prompt:
Код:
XPATH:
//input[@data-val='true' and @name='UserName']
Задача:
Возьми этот XPATH для OpenBullet 2 и создай из него SELECTOR, который будет находить этот элемент! Учти, что это SELECTOR для OpenBullet 2. Пойми все его особенности и сделай качественный SELECTOR.- После чего получаем в ответ нужный нам SELECTOR:
Код:
input[data-val='true'][name='UserName']- Label: USERNAME INPUT
- Find By: Selector
- Identifier: input[data-val='true'][name='UserName']
- Text: <USERNAME> - текст из переменной, в которую мы сохранили наш юзернейм. Если не поняли как это, то читаем другие статьи.
ШАГ 4. ДОБАВЛЯЕМ КУБИК "TYPE HUMAN" [ВВОДИМ PASSWORD]:
Повторяем тоже самое, что мы сделали в предыдущем шаге, только делаем это с полем ввода пароля. Я не буду опять показывать как найти и скопировать код поля ввода пароля.
Но я бы советовал вам просить ChatGPT сначала сделать XPATH, а потом из этого XPATH уже сделать SELECTOR. Почему-то так результат выходит лучше.
В этом нам поможем следующий Prompt:
HTML:
Код элемента:
<input data-val="true" data-val-required="The Password field is required" id="Password" name="Password" placeholder=" " type="password" value="" aria-describedby="Password-error" aria-invalid="true">
Задача:
Создай XPath для этого элемента. Он должен находить элемент по id="Password" и name="Password". Учти, что это XPATH для OpenBullet 2. Пойми все его особенности и сделай качественный XPATH.
После чего из этого XPATH сделай SELECTOR для OpenBullet 2. Пойми все его особенности и сделай качественный SELECTOR.
Ничего не объясняй, просто выполни задачу.- После чего получаем в ответ нужный нам SELECTOR:
Код:
input#Password[name='Password']- Label: PASSWORD INPUT
- Find By: Selector
- Identifier: input#Password[name='Password']
- Text: <PASSWORD>
ШАГ 5. ДОБАВЛЯЕМ КУБИК "CLICK" [ЖМЕМ НА КНОПКУ LOGIN]:
Теперь после ввода нужных нам данных нам нужно нажать на кнопку входа в аккаунт. Давайте разберем код элемента нужной нам кнопки.
Как мы можем видеть, то мы можем закрепиться к этому элементу по id="btnLogin". Это будет хорошим и стабильным выбором.
- После чего получаем в ответ нужный нам SELECTOR:
Код:
button#btnLogin- Label: CLICK LOGIN
- Find By: Selector
- Identifier: button#btnLogin
- Mouse Button: Left - Ну с этой функцией я думаю всё понятно, указывает скрипту что ему нужно жмать (ПКМ/ЛКМ).
- Index: 0 - Если скрипт найдёт на странице, например, два элемента с таким же SELECTOR (например две кнопки на странице), то мы можем указать скрипту на какую именно кнопку по счёту нажимать. Отсчёт начинается с нуля.
- Click Count: 1 - Кол-во кликов, которое скрипт должен сделать по элементу.
- Time Between Clicks: 0 - Задержка между кликами (если их несколько).
JSON:
{ "Result": "KO", "Message" : "Unable to log on. Please make sure the username and password are for a valid user" }Конкретно в нашем случае будем вычислять BAD по тексту ""Message" : "Unable to log on"
Теперь войдём под ВАЛИДНЫМИ данными:
После успешного входа мы получили страницу с таким содержимым:
JSON:
{ "Result": "LogOnForLoyalty", "Redirect" : "MyAccount/Dashboard", "UserId" : "bf6b7b90-9632-4e57-8a41-769853546f23", "CartValue" : "0", "LoyaltyLevel" : "1" }ШАГ 6. ДОБАВЛЯЕМ КУБИК "WAIT FOR NAVIGATION" [ОЖИДАНИЕ ЗАГРУЗКИ СТРАНИЦЫ ПОСЛЕ АВТОРИЗАЦИИ]:
В OpenBullet 2, кубик Wait for Navigation отвечает за ожидание завершения перехода на новую страницу или загрузки контента после выполнения действий, которые инициируют навигацию (например, нажатие на кнопку, отправка формы). Он полезен для того, чтобы гарантировать, что скрипт не будет продолжать выполнение до тех пор, пока не завершится процесс загрузки новой страницы или не обновится текущая.
Этот кубик помогает избежать ошибок, связанных с попыткой взаимодействовать с элементами на странице до их полной загрузки. Таким образом мы точно будем знать, что страница с результатом нашего входа точно была загружена!
- Label: LOGIN WAITING
- Load Event: Load
- Timeout: 60000
ШАГ 7. ДОБАВЛЯЕМ КУБИК "GET DOM" [ПОЛУЧАЕМ КОД СТРАНИЦЫ ПОСЛЕ АВТОРИЗАЦИИ]:
Кубик Get DOM извлекает и сохраняет весь HTML-код текущей страницы, что позволяет анализировать или искать нужные данные в полученном коде страницы, которую открыл скрипт в предыдущем шаге.
- Label: GET LOGIN RESULT
- Output variable: LOGIN_RESULT_PAGE_CODE
ШАГ 8. ДОБАВЛЯЕМ КУБИК "KEYCHECK" [ОПРЕДЕЛЕНИЕ GOOD/BAD]:
Вы уже должны знать из моих ранних статей что это за кубик и какие функции он выполняет. Поэтому просто скажу как заполнить.
- Label: LOGIN STATUS CHECK
- Ban if no match: Ставим галочку в чекбокс.
- Во вкладке "Keychains" два раза жмём на "Add".
- В первом появившемся окне ставим "Result Status" на "Fail". Потом жмём "String", вместо "data.SOURCE" нам нужно выбрать нашу переменную "LOGIN_RESULT_PAGE_CODE" из шага 7, чтобы этот кубик обрабатывал данные именно из этой переменной. В появившемся поле напротив "Contains" пишем Unable to log on
- Во втором появившемся окне ставим "Result Status" на "Success". А в остальном делаем всё по аналогии с предыдущим шагом, только в поле поле напротив "Contains" пишем уже "Redirect" : "MyAccount/Dashboard"
ШАГ 8.1. ДОПОЛНЯЕМ КУБИК "KEYCHECK" [ДОП. ОПРЕДЕЛЕНИЕ GOOD/BAD]:
Во время тестирования скрипта выяснилось, что иногда скрипт после успешного входа в аккаунт редиректит не на такую страницу, которую мы получили на пятом шаге, а напрямую в личный кабинет! Вот пример:
Почему именно этот элемент? Да потому что только авторизованный пользователь будет видеть такой блок, логично же
Нажимаем "Start" и видим, что скрипт успешно отработал и завершился со статусом "SUCCESS":
ШАГ 9. ДОБАВЛЯЕМ КУБИК "NAVIGATE TO" [ОТКРЫВАЕМ СТРАНИЦУ С ДАННЫМИ ОБ АККАУНТЕ]:
Теперь нам нужно добавить те действия, которые произойдут после того, как мы успешно вошли в аккаунт. В прошлой статье на этапе 1 мы поставили такие настройки, чтобы OB2 закрывал окна браузера в случае если мы получим статус FAIL, BAN или ERROR, а вот после SUCCESS у нас браузер не закрывается, ведь аккаунт, а значит и экземпляр браузера нам ещё будет нужен, чтобы спарсить имя владельца аккаунта и кол-во поинтов на аккаунте, закроем мы его сами в самом конце работы скрипта!
Для успешного парсинга нужных данных как обычно ищем странцу, с которой эти данные можно спарсить.
- Ещё на восьмом шаге видим, что в коде страницы имеется после успешной авторизации имеется строка Redirect" : "MyAccount/Dashboard". Это говорит нам о том, что после того, как мы вошли в аккаунт нас должно редиректить на ссылку "https://www.gamestop.ca/MyAccount/Dashboard".
- Почему-то Puppeteer в OB2 не всегда редиректит нас после авторизации, но мы уже обработали два исхода событий, наш скрипт определяет GOOD/BAD корректно и с редиректом на Dashboard и без него. (см. Шаг 8 и Шаг 8.1)
- Давайте просто найдём страницу с данными своими ручками. Заходим в аккаунт и видим, что после авторизации нас кидает на страницу "https://www.gamestop.ca/MyAccount/Dashboard".
Теперь нам нужно сделать так, чтобы скрипт 100% открывал страницу Dashboard, ведь нам нужно получить код с этой страницы, чтобы спарсить с неё нужно информацию (имя и кол-во поинтов). А у нас она открывается только в 50% случаев (после авторизации). Для этого добавляем кубик "Navigate To".
- Label: SITE LOADING
- Loaded Event: Load
- Timeout: 60000
ШАГ 10. ДОБАВЛЯЕМ КУБИК "WAIT FOR ELEMENT" [ЖДЁМ ПОЛНОЙ ЗАГРУЗКИ DASHBOARD]:
На данном этапе нам нужно дождаться полной загрузки страницы Dashboard, поэтому опять используем наш "Ждун селекторов". По сути повторяем шаг 2.
В шаге 8.1 мы уже по сути нашли всё, что нам нужно, а именно элемент "id="myaccount-transactions-latest"", который отвечает за блок с последними транзакциями на аккаунте во вкладке Dashboard.
- Пишем в ChatGPT:
HTML:
Код элемента:
<div id="myaccount-transactions-latest" class="col-sm-5" data-loaded="true">
Задача:
Создай XPath для этого элемента. Он должен находить элемент по id="myaccount-transactions-latest". Учти, что это XPATH для OpenBullet 2. Пойми все его особенности и сделай качественный XPATH. Ничего не объясняй, просто выполни задачу.- Получаем наш XPATH:
Код:
//div[@id='myaccount-transactions-latest']- Label: DASHBOARD LOADING WAITING
- Find By: XPath
- Identifier: //input[@data-val='true' and @name='UserName'] - Путь до элемента на странице (XPath).
- Visible: Ставим галочку в чекбокс - Скрипт будет ждать, пока элемент станет ВИДЕН на странице.
- Timeout: 60000
ШАГ 11. ДОБАВЛЯЕМ КУБИК "GET DOM" [ПОЛУЧАЕМ КОД СТРАНИЦЫ DASHBOARD]:
Мы успешно перешли на страницу Dashboard, дождались появления нужного нам элемента, а это значит что страница загружена полностью и готова к работе. Теперь мы должны получить HTML код страницы Dashboard.
- Label: GET ACCOUNT DETAILS
- Output variable: ACCOUNT_DETAILS
ШАГ 12. ДОБАВЛЯЕМ КУБИК "PARSE" [ПАРСИМ ИМЯ ВЛАДЕЛЬЦА АККАУНТА ИЗ ПОЛУЧЕННОГО HTML КОДА]:
Мы уже почти у финиша, осталось всего лишь распарсить нужные нам значения из кода и положить их в переменные. Давайте найдём в каком элементе у нас лежит имя.
Как вы могли увидеть на шаге 11 - имя владельца нашего аккаунта "Debby Macfarlane". Давайте найдём этот текст в нашем коде.
- Для этого вставляем в поисковое поле справа снизу наше имя и жмём "Search".
- После чего видим, что имя успешно нашлось в коде.
HTML:
<h2 class="headline" style="white-space: nowrap;"><span class="textfitted" style="font-size: 30px;">Debby Macfarlane</span></h2>Если вы уже читали мои статьи, то вам на ум сразу должно прийти, что мы просто можем вырезать этот текст через "LR" в кубике "Parse". Но если вам вы не читали, то просто повторяйте за мной.
- Label: PARSE NAME
- Output variable: NAME
- Is Capture: Ставим галочку в чекбокс.
- Input: Выбираем переменную ACCOUNT_DETAILS (см. шаг 11)
- LR: Ставим галочку в чекбокс.
- Left Delim: <span class="textfitted" style="font-size: 30px;">
- Right Delim: </span>
ШАГ 13. ДОБАВЛЯЕМ КУБИК "PARSE" [ПАРСИМ КОЛ-ВО ПОИНТОВ НА АККАУНТЕ ИЗ ПОЛУЧЕННОГО HTML КОДА]:
Нам не нужно получать DOM сайта ещё раз, ведь он уже лежит в нужной нам переменной (ACCOUNT_DETAILS). Просто повторяем предыдущий шаг с небольшими отличиями.
- Видим, что у нас в Dashboard есть надпись "100 Points"
- Опять ищем через поле "Search" текст "100 Points".
- Понимаем, что число поинтов находится между <span class="points"> и </span>
Добавляем кубик "Parse":
- Label: PARSE POINTS
- Output variable: POINTS
- Is Capture: Ставим галочку в чекбокс.
- Input: Выбираем переменную ACCOUNT_DETAILS (см. шаг 11)
- LR: Ставим галочку в чекбокс.
- Left Delim: <span class="points">
- Right Delim: </span>
ШАГ 14. ДОБАВЛЯЕМ КУБИК "CLOSE BROWSER" [ЗАВЕРШАЕМ РАБОТУ]:
На этом логика работы нашего скрипта заканчивается. Добавляем последнее действие "Close Browser", чтобы закрыть экземпляр браузер Chrome. Это нужно для экономии ресурсов, а так же это поможет избежать "Висящих" процессов браузеров.
Этап 2. Тестирование конфига.
В ОДНОПОТОЧНОМ РЕЖИМЕ:
Как обычно прямо в редакторе скрипта "Start" и видим, что скрипт успешно зашёл на аккаунт, спарсил все необходимые данные, закрыл браузер и завершил поток со статусом "Success".
В МНОГОПОТОЧНОМ РЕЖИМЕ:
Я уже объяснял как запускать конфиг полноценно и в многопотоке в конце этой статьи - xss.pro/threads/125492/
Есть только одно отличие:
Следует учесть, что ИНОГДА нужно включать обратно Headless режим. Как это сделать смотрите в первой статье - xss.pro/threads/126089/. (Этап 1.)
После включения Headless режима вы не будете видеть запущенных браузеров Chrome, т.к всё будет выполняться в фоновом режиме. Это будет экономить ресурсы ПК и вообще удобнее в разы.
Но учтите, что не все сайты дадут вам работать в Headless режиме! Они это палят и иногда присекают, поэтому это опциональная функция.
В принципе можете включить Headless режим и запустить скрипт в редакторе кода в один поток (где мы добавляем кубики) ради теста.
РЕЗУЛЬТАТ:
У меня в многопотоке и в Headless режиме все успешно работает на нашем целевом сайте. Вот часть того, что мне удалось сбрутить:
marxdaoust@gmail.com:owo69DIO | NAME = Maxime Daoust | POINTS = 0 Points
Simdelarosbil@hotmail.com:Mimonlane2 | NAME = simon carron | POINTS = 100 Points
ger.1815@gmail.com:JTNel$0n1815 | NAME = Gerald Nelson | POINTS = 50 Points
arujan123thebest@gmail.com:Boeing777x | NAME = Arujan Kathirkanthan | POINTS = 390 Points
shawnkinglock02@gmail.com:Shawn02Shawn02 | NAME = Shawn Kinglock | POINTS = 135 Points
mattpbk@rogers.com:#Ottawa2026$ | NAME = Matt Pulleyblank | POINTS = 30 Points
clark_debby@hotmail.comebster999*** | NAME = Debby Macfarlane | POINTS = 100 Points
leescarter8@gmail.com:Bacons13 | NAME = Carter Lees | POINTS = 4,604 Points
Simdelarosbil@hotmail.com:Mimonlane2 | NAME = simon carron | POINTS = 100 Points
ger.1815@gmail.com:JTNel$0n1815 | NAME = Gerald Nelson | POINTS = 50 Points
arujan123thebest@gmail.com:Boeing777x | NAME = Arujan Kathirkanthan | POINTS = 390 Points
shawnkinglock02@gmail.com:Shawn02Shawn02 | NAME = Shawn Kinglock | POINTS = 135 Points
mattpbk@rogers.com:#Ottawa2026$ | NAME = Matt Pulleyblank | POINTS = 30 Points
clark_debby@hotmail.com
ebster999*** | NAME = Debby Macfarlane | POINTS = 100 Pointsleescarter8@gmail.com:Bacons13 | NAME = Carter Lees | POINTS = 4,604 Points
Подводим итоги.
Написание этой статьи заняло у меня немного больше времени, чем я планировал. По сути мы тут использовали некоторые знания из ранних статей, но всё же есть небольшие отличия, поэтому хотелось разжевать как можно подробнее.
Я надеюсь, что я дал вам понимание что такое Puppeteer и как он вообще работает, ведь это было по сути самой главной целью этого цикла статей.
В ближайшем скорее всего напишу ещё статью по обходу капчи через OB2 + Puppeteer, я думаю это будет полезно при разработке ботов, но скорее всего это будет одной из последних статей по OB2.
На это тоже есть свои причины, ведь у меня в планах большой цикл статей по Browser Automation Studio (BAS), а для него нужно подготовить грамотную структуру, чтобы вводить в тему постепенно, т.к возможностей, а значит и информации там больше.
Буду благодарен вашему лайку, так я увижу, что мой материал действительно интересен людям! Если вам есть что добавить по теме разработки на OpenBullet 2, например, полезные советы по маскировке браузера, чтобы сайты не распознавали бота, или другая интересная информация - пожалуйста, делитесь в этой или других темах. Я всегда рад узнать что-то новое, как, думаю, и многие участники форума!Не буду изменять своим традициям и для особо любопытных оставляю исходник!
Код:
Ссылка -> mega.nz/file/xHcTFSzR#FxsC7aOeGZVMREplsbbPfuuDLfnBAgJZy3P5XW_shkc
Пароль от архива -> xss.pro (обязательно большими буквами)
Конфиг закидывать по пути -> OpenBullet2\UserData\ConfigsВсем удачи, свидимся!
