Могу ли я использовать Puppeeter, чтобы делать полные скриншоты страниц + включать нумерацию страниц для 15K веб-страниц?

Question

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

Хотя я понимаю, что делать несколько скриншотов с помощью Puppeteer возможно, я также хочу сделать скриншоты FULL PAGE; и в идеале включать любые дополнительные страницы, разбитые на страницы, в один и тот же файл.

Как я могу это сделать?

Answer 1

Короткий ответ: да, можно. Я не уверен в производительности, но нет никаких технических ограничений для достижения желаемого с кукловодом.

Длинный ответ: сделать это красиво и чисто, возможно, будет непросто. Кроме того, он требует определенных навыков, чтобы сделать его устойчивым к ошибкам. Было бы неплохо иметь какой-то механизм повторения случайно неудачных процессов. Однако самая простая реализация:

1. Храните эти 15k веб-страниц где-нибудь, например, в файле.csv, коллекции базы данных или так далее.
2. Загрузите все записи в вашем приложении структурированным образом, например, в виде списка экземпляров класса, как показано ниже:

class WebpageProcess {
  private status = 'NOT_STARTED';
  
  public url;
  
  constructor(url) {
    this.url = url;
  }
  
  public function setSuccess() {
    this.status = 'SUCCESS';
  }
  
  public function setFailure() {
    this.status = 'FAILED';
  }
  
  public function getStatus() {
    return this.status;
  }
}

3. Перейдите к каждой из веб-страниц итеративно, одну за другой, дождитесь полной загрузки страницы и сделайте снимок экрана.
4. Если необходимо, переименуйте файл, пометьте его или добавьте метаданные.
5. Если процесс завершился успешно, измените статус на SUCCESS.
6. Если процесс не удался, пометил это FAILED.
7. В конце сгенерируйте отчет о том, сколько процессов завершилось ошибкой, и перечислите их все.

Чтобы сделать снимок экрана, вы должны использовать метод page.screenshot() с флагом fullPage: true. Документация: https://github.com/GoogleChrome/puppeteer/blob/master/docs/api.md

Однако некоторые люди в Интернете жалуются, что эта функция не всегда работает хорошо. Вместо этого рекомендуется использовать библиотеку npmpuppeteer-full-page-screenshotэто решает проблему. Вы должны сами поиграть с ним и проверить, работает он у вас или нет.