Как сделать скриншот сайта с помощью PhantomJS?

Как сделать скриншот сайта с помощью PhantomJS?

· jQuery и JavaScript и Разработчикам · 1 мин чтения

PhantomJS — это удобный инструмент для тестирования веб-приложений, который может также быть использоваться для скрапинга данных. В этой записи я покажу вам как сделать скриншот с его помощью. 

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

Полное руководство по установке PhantomJS можете найти в записи — Как установить/обновить PhantomJS в Ubuntu 14.04?.

Делаем скриншот в PNG, JPEG, GIF или PDF

Создаем скрипт, назовем его github.js и напишем туда следующее.

var page = require('webpage').create();
page.open('http://github.com/', function() {
  page.render('github.png');
  phantom.exit();
});

Теперь запустим скрипт.

phantomjs github.js

После запуска, PhantomJS должен зайти на GitHub, сделать скриншот главной страницы и завершить сессию.

После чего в папке где находится github.js должен появиться PNG файл github.png.

Кроме PNG вы можете сохранять JPEG, GIF, и PDF.

Как быть с SVG?

Все просто. Для этого можно воспользоваться rasterize.js, который показывает более корректный рендеринг картинок с дополнительными параметрами.

Например, командой ниже:

phantomjs rasterize.js http://ariya.github.io/svg/tiger.svg tiger.png

Вызывается rasterize.js с двумя параметрами.

Первый — это ссылка на картинку или сайт (http://ariya.github.io/svg/tiger.svg).

Второй — это название файла для сохранения (tiger.png).

Сделать PDF страницы

Это сделать так же легко.

phantomjs rasterize.js 'http://en.wikipedia.org/w/index.php?title=Jakarta&printable=yes' jakarta.pdf

В конечном результате вы получите jakarta.pdf файл, который будет включать в себя всею информацию из ссылки.

Бонус

Я недавно писал запись про парсинг топ новостей с Яндекса в этой записи. Посмотрите, может вам будет интересно 😉

Вывод

PhantomJS очень прост в настройках. Создание скриншота у вас займет не больше минуты. О том как это сделать, я рассказал вам в этой записи. Если вы знаете более актуальные или интересные способы, буду рад вас выслушать в комментариях.

Если у вас возникли какие-либо вопросы, пишите их ниже к этой записи, постараюсь ответить.

Комментарии