Отправляет email-рассылки с помощью сервиса Sendsay
  Все выпуски  

Веб-разработка? Это просто! Букмарклеты или как скачать аудиофайлы с сайта vkontakte?


Букмарклеты или как скачать аудиофайлы с сайта vkontakte?

Сегодня я собираюсь рассказать про одну интересную технологию, как мне кажется, с большим будущим. Называется эта технология bookmarklets(букмарклеты). Букмарклет - это маленькая JavaScript-программа, оформленная в виде javascript-ссылки и вызываемая как браузерная закладка. Итак, мы знаем, что в атрибуте href гипертекстовой ссылки можно указать url любой существующей страницы, обычно url этот выглядит примерно так <a href='http://address.org/path/index.html'>ссылка</a>, в данном случае http: - это указание протокола обмена, а все остальное - указание сервера, пути к файлу, и имени файла, к которому обратится браузер после клика на ссылке. Так вот, существует ряд протоколов, таких как, например, http: (протокол гипертекстового обмена), ftp:(протокол обмена файлами), file:(протокол загрузки локальных файлов пользователя).

Помимо этого существует еще один интересный протокол javascript:, который мы и будем использовать для создания букмарклетов. Выглядит это примерно так:

<a href='javascript:alert('Hello, world');'>букмарклет</a> при щелчке по этой ссылке, выполнится команда alert('Hello, world'); Проверьте, как это работает.

Попробуем теперь перетащить эту ссылку в панель закладок браузера, или щелкнув на ней правой кнопкой добавить ее в закладки. После того, как ссылка сохранена в закладки, можно в любой момент выбрать ее и выполнить.

Попробуем немного усложнить нашу закладку, пусть тепреь она выводит адрес документа из которого она вызвана. Вот этот букмарклет:

<a href='javascript:alert(document.location);'>Адрес текущей страницы</a>.

Добавьте эту ссылку (Адрес текущей страницы) в закладки и вызовите ее, открыв предварительно в браузере какую-нибудь интернет-страницу, например сайт Яндекса. Вы увидите всплывающее оповещение с указанием адреса текущей страницы. Из этого можно сделать один очень важный вывод: букмарклет, вызванный из браузера, как закладка, выполняется в контексте текущей, открытой в браузере страницы. А этот факт дает нам неограниченный доступ к изменению данных на странице, и к извлечению из страницы любых данных, вплоть до полной замены содержимого этой страницы.

К сожалению, длина скрипта, сохраняемого в закладке ограничена. Причем, для разных браузеров она разная. Не углубляясь в различия между браузерами, можно сказать, что длина эта ограничена для различных браузеров от 488 до 2084 символов, что не может не огорчить. В принципе, для несложных букмарклетов нам хватит и этой длины, но что делать, если нам хочется большего? Что если мы хотим написать скрипт, который производит достаточно сложную обработку загруженной страницы, и в 2 кБ скрипта нам никак не уложиться?

Для этого можно использовать способ, заключающийся в следующем: сам букмарклет представляет собой небольшой скрипт, у которого есть лишь одно предназначение - загрузить основной скрипт и запустить его на выполнение.

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

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

Продолжение статьи "Букмарклеты или как скачать аудиофайлы с сайта vkontakte?" и многие другие статьи про тонкости веб-разработки Вы можете прочитать на сайте "Веб-разработка? Это просто!".


В избранное