Grooveshark — еще больше функций веб-приложения бесплатно

в 23:59, , рубрики: javascript, веб-приложения, Веб-разработка, информационная безопасность, реверс-инжиниринг, метки: , ,

Прошло немало времени с тех пор, как замечательный веб-сервис 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


* - обязательные к заполнению поля


https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js