Прошло немало времени с тех пор, как замечательный веб-сервис Grooveshark — онлайн-радио, проигрыватель и поисковик музыки — перешел с Flash-интерфейса на HTML5. Как и прежде, сервис сопровождается рекламнымы баннерами на четверть экрана, и часть функций проигрывателя была доступна только платным подписчикам.
Как постоянному его пользователю и как веб-разработчику, склонному к реверс-инжинирингу, мне стало интересно, насколько удастся «открыть» этот новый веб-интерфейс.
Открытие Grooveshark началась около года назад (задолго до того, как мне посчастливилось получить аккаунт на хабре), и с тех пор архитектура веб-интерфейса была частично переработана, поэтому часть описанного уже стала историей. Но, несмотря на это, актуальная версия по-прежнему позволяет провести описанные манипуляции.
Разведка
Прежде чем начать движение к цели, было необходимо определить, с чем предстоит иметь дело.
Веб-интерфейс Grooveshark реализован с использованием JavaScript, HTML и CSS в лучших традициях современных веб-приложений. В качестве основной библиотеки используется jQuery. В основе некоторых элементов интерфейса — компоненты jQuery UI.
CSS против рекламы
Первое, что бросалось в глаза — это реклама, которой не место на небольшом экране ноутбука. Её нужно было скрыть в первую очередь, при этом не поломав само приложение.
Сейчас существует несколько дополнений к браузерам, которые реализуют блокирование рекламы и других выбранных пользователем элементов на веб-страницах. Самое популярное из них, как заявлено на сайте дополнения — Adblock Plus — оно доступно для Firefox и Chrome. Есть решения и для Internet Explorer.
В комментарии к предыдущей статье о Grooveshark было предложено дополнение для Chrome, но к настоящему моменту по ссылке, к сожалению, лишь страница с ошибкой, что ничего не найдено.
О вреде глобальных переменных
Дальнейший анализ и разработку было решено проводить в Chrome — к тому времени он уже был моим основным браузером для веб-серфинга, и Developer Tools уже были намного приятнее в использовании, чем довольно медлительная связка Firefox+Firebug. Все описанные манипуляции можно также проводить в любом браузере, предоставляющем JavaScript-консоль в контексте страницы.
После анализа глобальных переменных (свойств объекта window)
(function () { for (var x in window) if (window.hasOwnProperty(x)) { console.log(x); } }());...
$
jQuery
_
GS
...
был обнаружен интересный объект GS — по-видимому, аббревиатура от GrooveShark. А в нем — объект user со свойством IsPremium: false. Вот это находка!
Не было печали — апдейтов накачали
При обновлении приложения обновилась и структура объектов. Но, к счастью пользователей и несчастью разработчиков, открыть подписку заново не составило большого труда.
Результаты
Практические советы разработчикам
Автор: sompylasar
