@Twost13 сен 2011 в 10:19

Создание полноразмерных скриншотов web-ресурсов

3 мин

13K

Веб-разработка *

Из песочницы

+57

Комментарии 41

@3fir 13 сен 2011 в 10:32

В примере, при переходе по ссылке на созданный скрин, выползает 404.

@Twost 13 сен 2011 в 10:35

напишите, пожалуйста URL, скриншот которого Вы хотели сделать.

@3fir 13 сен 2011 в 10:36

efir.biz
kandagar.com

Два попробовал.

@Twost 13 сен 2011 в 10:47

Прошу прощения. Мой слабенький VDS не выдержал хабр-эффекта! =)

Как только восстановлю — обновлю пост.

@3fir 13 сен 2011 в 10:48

А теперь сразу по ссылке отображается «No input file specified.» :)

@Evengard 13 сен 2011 в 10:50

Костылястый такой костыль… PhantomJS не канает? ( habrahabr.ru/blogs/javascript/116789/ )

@Twost 13 сен 2011 в 10:53

Я описал один из вариантов.

Про PhantomJS почитаю подробнее позднее.

З.Ы. я не уверен, но есть подозрение, что PhantomJS будет некорректно работать с flash на сайтах.

@Evengard 13 сен 2011 в 10:56

Судя по документации ( code.google.com/p/phantomjs/wiki/Interface ) он и Flash прекрасно подхватит с правильным ключиком запуска. А так мы избавимся от лишнего «жруна» — Xvfb. Тем более на каждый скрин поднимать заново Xvfb, это же жесть какая жесть…

@TheAlien 13 сен 2011 в 11:06

Ну как бы все равно придется использовать Xvfb
Иначе Фантом вам скажет: [WARNING] phantomjs: cannot connect to X server
(мы же говорим о скрининге с консоли на сервачке, да?)

@Evengard 13 сен 2011 в 11:10

Кхм, действительно. Однако, в любом случае по-моему лучше не мучать Xvfb-run на каждый запуск а запустить один инстанс Xvfb ( Xvfb :0 -screen 0 640x480x24 & ) и уже в нём запускать любую из утилиток ( DISPLAY=:0 myLovelyUtility )

Почему то думал, что PhantomJS умеет таки без Иксов рендерить, сорри

@Twost 13 сен 2011 в 10:50

Пример временно недоступен. Я убрал скрипт, пока восстановлю серверную часть.

P.S. пример по ссылке — это пока не полноценно работающий сервис, это лишь пример реализации действий, указанных в статье.

@TheAlien 13 сен 2011 в 10:51

Я когда-то писал фактически аналогичную статью. )

@Twost 14 сен 2011 в 01:38

Действительно, реализация схожая.

Спасибо за комментарий.

@alexmuz 13 сен 2011 в 10:54

Проверил из консоли: работает! Правда хотелось бы побыстрее… Получается от 5 до 30 сек в зависимости от УРЛа.

@printf 13 сен 2011 в 11:13

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

@Twost 14 сен 2011 в 01:42

Основная причина в длительном создании скриншота — доступность сайта, который скриншотится.
Это ведь равносильно тому, что мы запросим сайт через браузер.

Подумаю над решением проблемы.

Спасибо за комментарий.

@frig 13 сен 2011 в 11:30

А как у него со шрифтами? Экспериментировал со скриншотерами, но шрифты так и не удалось добить.

@TheAlien 13 сен 2011 в 11:46

У меня в профиле есть линк сайта si**t.in (не рекламлю,), на котором все скриншоты (на страницах, где описаны конкретные сайтики) сделаны через Кутикапт. Вот можете по ним и судить.

@frig 13 сен 2011 в 11:51

Спасибо. Посмотрел — тоже самое что было и у меня. Шрифты похожи, но при внимательном рассмотрении видно, что не те :(. Смотрю под виндой.

@Twost 14 сен 2011 в 01:42

Я заметил проблему с шрифтами только на китайском сайте-аукционе.

Спасибо за комментарий.

@frig 14 сен 2011 в 06:52

Мне не удалось добиться полного сходства с тем, что я вижу у себя в firefox или в хроме. Все равно есть отличия. Использовал я, правда, решение с запуском firefox в xvfb. Потому и интересно, на сколько точным получается совпадение скриншотов с виндой.

@MadJeck 13 сен 2011 в 11:53

Можно написать приложение на python с использование qt-webkit будет более гибкое решение. В свое время перепробывал для pr-cy.ru много готовых решений, ниодно не устроило.

@FFF 13 сен 2011 в 14:09

CutyCapt использует qt-webkit, решение на C++ в некоторых случаях более стабильно, чем на python, но оба из них, конечно, имею право на жизнь :)

@dodarium 13 сен 2011 в 12:50

Ещё у вас не на всех сайтах flash работает.

@bezumkin 13 сен 2011 в 13:07

У меня есть свой маленький проектик, типа «домашняя страничка» с любимыми ссылками.

Когда переделывал его в очередной раз — сделал автоснятие скриншотов с помощью wkhtml.

Главное достоинство — рендер страниц посредством webkit. Flash так и не смог завести, хотя, говорят, это возможно.

Посмотреть в работе можно тут, если будет интересно — расскажу как прикручивать wkhtml себе на сайт.

@bezumkin 13 сен 2011 в 13:13

Ссылки не вставились.

Сайт wkhtmltopdf — code.google.com/p/wkhtmltopdf/
Мой сайтик, где можно глянуть пример работы — webstartpage.ru

P.S.
С некоторых пор не могу пользоваться тегами — никак не привыкну.

@bezumkin 13 сен 2011 в 13:27

wkhtmltopdf — code.google.com/p/wkhtmltopdf/

@Kengry 13 сен 2011 в 13:26

Мечтаю о приложинии, которое бы умело не только создавать полноразмерные скриншоты сайтов, но и готовить их к печати. А именно: увеличивать изображения без потери качества и без каких либо алгоритмов, просто увеличивая размеры пикселей в 2,3,4 и так далее раз.

Сейчас это приходится делать в фотошопе, принскриня увеличенное изображение. Неудобно.

@Proxmiff 13 сен 2011 в 13:54

А зачем принтскринить увеличенное изображение и вставлять в фотошоп? Можно же в нем прямо и увеличить :)

@Kengry 13 сен 2011 в 14:29

Если из маленького изображения сделать большое, то оно сильно потеряет в качестве.

@Proxmiff 13 сен 2011 в 14:40

> без потери качества и без каких либо алгоритмов
В фотошопе это делается так:
1. Image > Image Size…
2. Выбираем нужный размер и dpi принтера, режим интерполяции Nearest Neighbor

i55.tinypic.com/316sv9e.png

@Kengry 13 сен 2011 в 15:01

Круть! Спасибо .)

@Proxmiff 13 сен 2011 в 18:13

Не за что :) Можно, в принципе, написать такое расширение для Хрома. Если что, скину в личку.

@Evengard 13 сен 2011 в 18:37

Да статью на Хабре на тему сделайте, интересно же.

@tigrazone 13 сен 2011 в 15:39

Скриншот страницы в компоненте WebBrowser www.delphiexpert.ru/view_lesson.php?id=58
сохраняет скриншот окна
можно дописать перемещение невидимое окна чтоб охватить все зоны и сохранить в 1 файл
я уже доработал чтоб JPEG был прогрессивный и можно устанавливать качество его
можно сохранять в тот же PNG, затем фрактально к примеру увеличивать и сохранять в нужном формате

ТИГРА, автор tigrazone.narod.ru/AISPLIT.ZIP

@tigrazone 13 сен 2011 в 14:28

Скриншот страницы в компоненте WebBrowser www.delphiexpert.ru/view_lesson.php?id=58

@Bodigrim 13 сен 2011 в 14:36

В Ubuntu 11.04 CutyCapt можно и не собирать из исходников, он уже доступен из стандартного репозитория.

sudo apt-get install xvfb cutycapt

xvfb-run --server-args="-screen 0, 1024x768x24" cutycapt --url=http://habrahabr.ru --out=habrahabr_ru.jpg

@vit1251 15 сен 2011 в 22:43

Что-то задавался такой же проблемой и решил вам рассказать озамечтельной системе тестирования Selenium. В ней есть модули для создания скриншотов страниц, а поддержка языков позволяет написать небольшой Database Queue Thread, который будет опрашивать базу и делать скриншоты и складывать их куда Вы пожелаете.

P.S. Помоему гораздо более простой вариант чем городить различные фреймбуферные декстопы… Опять же это всего лишь вариант если уж действительно так надо скриншоты делать…

@mihmig 19 сен 2011 в 19:17

Скажите, а с помощью screen и xvfb можно сделать «висящее в фоне» GUI приложение?

@rudolff 20 сен 2011 в 15:39

А чем отличается полный скриншот по длине и ширине от захвата окна браузера?

@bRUtality 26 сен 2011 в 07:02

А вы пробовали решить проблему для страничек/сайтов, где требуется авторизация?

Зарегистрируйтесь на Хабре, чтобы оставить комментарий