Чем сделать скриншот сайта

Алексей,

16 марта 2016 16:47

Если перед вами стоит задача сделать скриншот сайта, то есть несколько вариантов

Для себя: самый простой вариант - плагин для хрома
На стороне сервера, то с помощью phantomjs Правда не всегда цепляет шрифты, js повешенный на события естественно не срабатывает, но в целом страницу можно получить.
На стороне клиента можно попробовать html2canvas. Шрифты цепляет, но проблемы с версткой и js.

Пример для phantomjs

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

Пример для html2canvas (понадобится html2canvasproxy.php) js скрипт для получения скриншота и отправки его на сервер

html2canvas(document.body, {	 
	proxy: 'html2canvasproxy.php', 
	onrendered: function(canvas) {		 
		$.post('/html2canvas.php', {filename: 'screenshot1', img: canvas.toDataURL('image/png').replace(/data:image\/png;base64,/, '')});	 
	  }
});

php скрипт для сохранения скриншота

$img = base64_decode($_REQUEST['img']);
$filePath = $_SERVER['DOCUMENT_ROOT'].'/screenshots/'.$_REQUEST['filename'].'.png'; 
file_put_contents($filePath, $img);

Есть вопросы или нашли ошибку? Напишите комментарий (можно без регистрации), отвечать стараюсь быстро.

Опубликовано 16 марта 2016 | Обновлено 31 декабря 2016

разработчику, полезное