Издательский дом ООО "Гейм Лэнд"ЖУРНАЛ ХАКЕР #111, МАРТ 2008 г.

Серфинг с умом!

Степан «Step» Ильин (step@gameland.ru)

Хакер, номер #111, стр. 111-038-1

Несколько ловких приемчиков от редакторов «Хакера»

Просто браузер - это все, что нужно для серфинга! Зачем заморачиваться с какими-то непонятными плагинами, онлайн-сервисами и прочей ерундистикой, если браузер отлично показывает странички, выполняет скрипты и запоминает пароли? Так, вероятно, думает самый обычный пользователь. Но нам-то с тобой известно, каково это - проводить в Сети по 6 часов в день, когда с серфингом связаны работа, пен-тест сайтов и веб-скриптов, общение с единомышленниками! Вот тут как раз и не помешает взять на вооружение несколько хитрых приемчиков, которые мы для тебя подготовили.

Ответь мне, знаешь ли ты работу противнее, чем та, которая требует изо дня в день одни и тех же тупых механический действий типа отслеживания запросов к какому-то конкретному сайту? Думаю, вряд ли! Я бы в таком случае если бы и не сменил работу, то уж точно задумался, как весь этот процесс можно автоматизировать, свести свое участие в действиях к минимуму. В статье «Путь он все делает сам» мы уже рассказывали тебе о том, как можно запрограммировать выполнение практически любой последовательности действий на компьютере, однако в случае с работой в браузере задача сильно усложняется. Обучить упомянутые в статье программы AutoIt и Automize распознавать на HTML-страницах тэги, самим заполнять формы, передавать нужные параметры бесконечным веб-скриптам... Нет, пожалуй, это невозможно. Я всерьез задумался над этой проблемой, ежемесячно для каждого выпуска DVD-приложения в журналу вручную закачивая апдейты и заплатки для разных версий Windows. Это совсем несложно один раз, но, повторяясь каждый месяц, начинает сильно напрягать. Решение нашлось довольно быстро.

Упрощаем рутинную работу в Сети

В сентябре прошлого года корпорация IBM запустила новый бесплатный онлайновый сервис, решительно заявляя о том, что он сможет выполнять часть рутинной работы пользователей. Причем работы самой разнообразной, той, что пожелают сами пользователи. Смысл разработки заключался в предоставлении интерфейса, позволяющего пользователям пошагово записать последовательность действий, которые они регулярно выполняют, а также механизма, который эту последовательность будет воспроизводить. Разработанная в исследовательском центре IBM Almaden Research, служба получила название CoScripter (services.alphaworks.ibm.com/coscripter).

Для задания последовательности действий теоретически можно использовать специальный скриптовый язык. Однако к такому геморройному методу едва ли кто-то прибегает, потому как намного удобнее процесс так называемого демонстрационного обучения. Ты показываешь CoScripter то, что нужно сделать, и уже в следующий раз он все повторяет сам. Другой вопрос: как ему это показать? Для того чтобы упросить процесс и сделать его наиболее прозрачным для пользователя, разработчики создали специальный плагин для Firefox. После авторизации на сервисе и установки плагина в правом нижнем углу браузера появляется значок CoScipter'а. Кликнув по нему, ты увидишь специальную панель сервиса, где отображаются собственно разработанные и релевантные скрипты, а также сценарии, рекомендуемые создателями ресурса.

Для того чтобы записать свой собственный макрос, необходимо нажать на кнопку New, далее - Record, после чего в нужной вкладке браузера начать выполнять действия, требующие автоматизации. Например, часть задачи, описанной мной выше, можно решить так: вызвать Google, набрать в поле поиска «microsoft download», перейти по первому линку, нажать на сайте Microsoft кнопку Advanced search, выбрать категорию Windows Updates и режим отображения результатов по 50 элементов на странице, после чего начать поиск. В это время в панели CoScripter будут отображаться все новые и новые шаги сценария. Результатом будет следующий код:

Windows Updates

* go to "www.google.com"

* enter "microsoft downloads" into the "Google Search" textbox

* click the "Google Search" button

* click the "Microsoft Download" link

* click the "Advanced Search" link

* select "Windows Security & Updates" from the "Category:"'s "Category:" listbox

* select "50" from the "Results Per Page:" listbox

* click the "Results Per Page:"'s "Go" button

Полученному сценарию можно дать имя и сохранить его в базе данных, причем пользователь может поставить пометку Private, для того чтобы запретить доступ к нему другим участникам сервиса. Все! Теперь, этот скрипт легко вызвать прямо из той же панели или же из любого другого браузера, просто залогинившись на сайте IBM.

Конечно, я привел очень примитивный пример, но даже его вполне достаточно для демонстрации возможностей этой замечательной разработки. А способен он на многое! Можно, например, проверять электронную почту, автоматизировать поиск билетов на многочисленных сайтах авиакомпаний, записать последовательность действий для того, чтобы добраться до сильно спрятанного внутреннего раздела сайта (если сделать это напрямую из URL не получается, скажем, из-за antileach-системы. Таким образом, юзеры могут избежать постоянного повторения рутинных операций вручную. Открытые скрипты интегрируются в wiki-ресурс и могут применяться несколькими пользователями совместно. Кстати говоря, перед тем как приступать к разработке своего собственного скрипта, нелишним будет проверить, не опередил ли кто-нибудь тебя. База сохраненных сценариев постоянно растет.

Улучшаем страницы со стороны клиента!

Приходила ли тебе в голову мысль о том, что часто посещаемый тобой сайт можно было бы улучшить, добавив ему функциональности, о которой разработчики, возможно, даже и не задумываются? Сказать по правде, меня такие идеи посещают постоянно. Ну, скажем, здорово было бы, если во время просмотра гаджетов в отдельной ненавязчивой панельке выводился бы список с наиболее выгодными предложениями в онлайн-магазинах. Сложно? Да ничего подобного, идея более чем реализуемая, и для этого даже не придется ничего изобретать!

Для того чтобы воплотить замысел в жизнь, опять-таки понадобится Firefox, хотя подойдет и любой другой браузер, построенный на движке Gecko, например Epiphany или Mozilla Suite. Именно с ними совместимо специальное расширение Greasemonkey (www.greasespot.net), которое позволяет изменять просматриваемые страницы буквально на лету. Вернее, сам аддон никоим образом их не трогает, и после его установки ты ничего не заметишь. Но он позволяет запускать Java-скрипты, которые как раз и производят все изменения! Их можно использовать, чтобы исправлять ошибки в визуализации какого-либо ресурса или чтобы подгонять его под себя, а можно добавить ему новую функциональность или комбинировать данные с нескольких ресурсов. Все зависит только от твоей фантазии! При этом все изменения, вносимые скриптами для Greasemonkey, будут казаться частью оригинальной веб-страницы. Вот лишь несколько примеров того, что можно сделать:

  • совместить Gmail и Google reader, чтобы вместе с письмами показывались RSS-подписки;
  • отображать список предложений с ценами при просмотре какого-либо товара в инете;
  • удалять рекламу со множества сайтов, включая назойливые popup'ы и текстовую рекламу Google;
  • автоматически заполнять формы;
  • связывать контент страницы с коррелированной информацией с других ресурсов;
  • сохранять FLV с youtube.com и аналогов одним кликом мыши.

Что такое скрипт?

Пользовательский скрипт (сценарий) — это просто часть программного кода на языке JavaScript, которая рассказывает Greasemonkey, где и когда она должно быть запущена. Каждый пользовательский скрипт предназначен для конкретной страницы, сайта или группы сайтов, при этом он может сделать все, на что способен JavaScript. По сути, он может делать даже больше, потому что Greasemonkey предоставляет специальные функции, которые доступны только для подобных сценариев.

Скрипты можно как выбрать из огромнейшего депозитария, так и написать самому. Давай сначала разберемся с первым вариантом. Наибольшая коллекция скриптов, написанная разными людьми для решения самых разнообразных задач, располагается по адресу http://userscripts.org. Объясняю, как это работает: сначала ты устанавливаешь саму Greasemonkey, после чего заходишь на сайт userscripts.org, выбираешь нужный скрипт и жмешь прямо на страничке кнопку Install this script. Вот и все: браузер сам поймет, что ты хочешь задействовать этот сценарий. Я, например, установил скрипт для быстрой загрузки видео на ресурсе в vkontakt.ru и сценарий для раскрытия всех веток комментариев в ЖЖ.

Пишем скрипт сами!

Хорошим подспорьем в деле написания скриптов для Greasemonkey является книжка «Dive into Greasemonkey» (www.diveintogreasemonkey.org). Книга, некогда опубликованная авторитетным издательством O'Reilly, сейчас распространяется в инете абсолютно бесплатно. Единственная проблема в том, что часть информации в ней уже устарела, поэтому книгу рекомендую использовать только в качестве основы. В большей степени понадобится информация о JavaScript, потому как любой сценарий для Greasemonkey разрабатывается именно на этом языке. Обязательное условие для любого скрипта — это формат имени, состоящий из имени скрипта и суффикса .user.js. Файлы, не отвечающие этому критерию, «обезьянка» попросту не признает.

Для того чтобы показать, как выглядит скрипт, напишем простенький сценарий, который при посещении страницы будет выводить всплывающее окошко с надписью «Hello world!». Он будет состоять из одной строчки на JavaScript:

alert("Hello, world!");

Сохраняем файл, например, в hello.user.js и drag'n'drop'ом переносим его в окно Firefox'а. Greasemonkey моментально унюхает приготовленное ей лакомство и предложит установить сценарий. Повода отказываться я не вижу. По умолчанию скрипт применяется для всех сайтов сразу, поэтому всплывающее окошко ты увидишь при посещении любого сайта. Сделать так, чтобы скрипт выполнялся при посещении строго определенных ресурсов, можно, указав так называемые метаданные.

// @name Наш пример!

// @namespace http://youngpup.net/userscripts

// @description Выводит окошко с сообщением

// @include http://xakep.tld/*

// @include http://www.xakep.tld/*

// ==/UserScript==

alert("Hello, world!");

Думаю, смысл каждой из переменных метаданных понятен из названия. Единственное, что необходимо отметить, - во время описания области действия скрипта мы использовали звездочку, обозначающую любой символ, а также служебную последовательность tld (top level domain), указывающую на то, что вместо нее может стоять обозначение любого домена первого уровня (.com, .ru и т.д.).

Важно понять, что Greasemonkey инжектирует скрипт внутрь страницы, как если бы он был вставлен туда веб-мастером во время разработки страницы. Поэтому возможности таких скриптов фактически ничем не ограничены, хотя некоторые нюансы все-таки есть. Учить JavaScript'у мы тебя сейчас, естественно, не будем (обрати внимание на выносы, где приведены ссылки на качественные мануалы для начинающих). Но еще один пример обязательно рассмотрим.

Осознав когда-то, что я не в состоянии синхронизировать закладки между всеми своими компьютерами, я стал использовать для их хранения небезызвестный онлайн-сервис del.icio.us. Отличный ресурс всем меня устраивал, за исключением того, что среди букмарков нередко попадались посторонние рекламные линки. Ну что ж, надо было пробовать от них избавиться! После беглого изучения страницы стало ясно, что спонсорские линки размещаются в блоке <div>.. <div>, относящемся к классу sponsored. Следовательно, для того чтобы удалить их, нужно было всего ничего - найти все такие блоки и в параметрах отображения сделать их невидимыми. Весь скрипт состоит из одной строчки кода на JS:

// ==UserScript==

// @name del.icio.us ads remover

// @namespace http://www.xakep.com.com

// @description Скрипт удаляет рекламу с del.icio.us

// @include http://del.icio.us/*

// ==/UserScript==

document.getElementById("sponsored").style.display = "none";

Способы отладки сценария

Написать сложный скрипт без единой ошибки и так, чтобы он сразу заработал, почти нереально. Поэтому скрипт, хочешь ли ты того или нет, придется отлаживать. Но вот загвоздка: по умолчанию никаких сообщений об ошибках не выводится, и даже встроенная в Mozilla Firefox консоль JavaScript будет молчать как партизан. Для того чтобы включить отображение всех ошибок, необходимо вызвать конфиг браузера (набрав в адресной строке about:config) и задать для параметров javascript.options.showInConsole и javascript.options.strict значение true. Помимо этого можно использовать функции GM_log или замечательный плагин для отладки Firebug (www.getfirebug.com). В последнем случае в нужных местах скрипта необходимо поставить следующую строчку кода:

unsafeWindow.console.log("Link: %o", document.links[0])

Словом, вариантов много.

Думай

В нижней части сайта www.userscripts.org приведена замечательная фраза: «Because it's your web». Потому что это твой веб! Не какого-то там дяди, а твой! Ты вправе сам выбирать, в каком виде получать информацию, как делать это более эффективно. А теперь ты знаешь, как это реализовать!

Greasemonkey и Opera

Несмотря на то что расширение Greasemonkey предназначено для браузеров, построенных на движке Gecko, разработанные для него скрипты можно использовать и в Opera! Дружно говорим спасибо разработчикам этого замечательного браузера, которые включили в состав своего продукта самые важные функции и в том числе поддержку сторонних скриптов! Как это использовать? Сохраняем нужный JS-скрипт в отдельную папку, после этого, находясь на сайте, где его нужно применить, кликаем в контекстном меню на «Изменить настройки узла...». Появляется окошко с несколькими вкладками, из которых выбираем «Сценарии» и в нижней форме «Файлы пользователя JavaScript» указываем папку со скриптом. Вот, собственно, и все!

Полезные скрипты для Greasemonkey

Linkify ting

Очень часто ссылки, ведущие на исходящие ресурсы, не обозначаются тэгом <a href> (чтобы в переменных окружениях не афишировать,откуда перешел пользователь). Этот очень простой скрипт просматривает HTML-код, ищет по шаблону кусочки текста, похожие на ссылки, и оформляет их соответствующим образом.

LJ Instant Comment

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

Google Thumbnails

Добавляет графическую превьюшку для каждой страницы в результатах поиска Google.

Videoembed

Позволяет закачать видео с большинства видеохостигов, включая YouTube, Google Video, Vimeo (всего 21 сервисов).

Rutube Downloader

К сожалению, Videoembed не дружит с отечественным Rutube, но этот скрипт способен исправить положение.

LookItUp2

С помощью этого скрипта можно быстро найти информацию в Wikipedia или любом другом источнике, просто выделив нужное слово на текущей странице.

Folders4Gmail

Сценарий предназначен для тех, кто так и не привык к системе меток в Gmail и хочет использовать привычную иерархию папок-каталогов.

Gmail Beautifier 2.3

Скрипт прячет всю рекламу в Gmail, расширяет поле письма, удаляет слово beta из логотипа и всячески улучает веб-морду почтовика, добавляя пару полезных кнопочек.

Gmail Addons

Это еще один скрипт, который значительно расширяет интерфейс Gmail, интегрируя его с Google Calendar.

RSS+Atom Feed Subscribe Button Generator

Если в коде страницы где-то прописана ссылка на RSS/ATOM-фид, то этот скрипт тут же выдаст линк для твоего агрегатора.

LJ Thread Unfolder

LJ Thread Unfolder предназначен для нашего любимого ЖЖ и нужен для того, чтобы открывать все ветки комментариев в одном месте (по умолчанию каждую ветку нужно открыть вручную).

Google Ad Remover

Сценарий удаляет рекламу со страниц результатов поиска Google.

Userscripts.org Rank by Popularity

А этот простенький скрипт упростит поиск популярных (а значит, полезных) скриптов на сайте Userscripts.org. Чем популярнее скрипт, тем больше соответствующих иконок будет рядом с ним отображаться.

INFO

Если ранее с аддонами для Огненного Лиса ты дела не имел, то знай, что ничего сложного в этом нет. Достаточно зайти в Firefox'е на сайт сервиса и кликнуть download CoScripter, после чего следовать предложенным инструкциям.

WARNING

В депозитарии скриптов для «обезьянки» встречаются вредоносные скрипты, являющиеся модификациями вполне безопасных и полезных сценариев, но с вкраплениями кода, которые воруют твои cookie. Будь осторожен!

WWW

Содержание