Получение заголовков (HTTP-headers) страницы при помощи Java-script

В журнале Smashing Magazine наткнулся на скрипт (плагин для jQuery), позволяющий автоматически рядом с ссылками указывать размер файла, на который указывает эта ссылка. Оказалось, что этот скрипт в своей работе использует полезный сервис, под названием json-head, который на входе принимает любой URL, а на выходе в формате JSON отдает заголовки, которые получил от сервера.

Анализируя эти заголовки можно на стороне клиента придумать много полезных фишек, кроме указания размера документа, на который ведет ссылка, можно, например, подсвечивать ссылки на недавно обновленные страницы (заголовок "Last-Modified") или нерабочие ссылки (анализ переменной "status_code").

Все те же действия можно проделывать и не используя сторонние сервисы, но в таком случае опрос удаленных серверов и анализ заголовков придется реализовать на стороне своего сервера, со всеми вытекающими отсюда достоинствами (независимость от сторонних сервисов и того, включена на стороне клиента поддержка Java-script или нет) и недостатками (в случае большого количества запросов забанят ip вашего сервера, а не ip сервера http://json-head.appspot.com ну и необходимость разработки собственного решения).

Кстати, с помощью этого сервиса, совершенно случайно выяснил, что Гугл работает с использованием веб-сервера собственной разработки — gws, по данным из Википедии на этом ПО работает 9,3% всех сайтов в интернете, то есть Гугл — это и есть почти 10% интернета!

Пример использования

Пример приведу на основе скрипта, указывающего размер документа, на который ведет ссылка. Работать со скриптом просто, его надо скачать и подключить к своей странице:

<script src="jquery.js" type="text/javascript" charset="utf-8"></script>
<script src="addSizes.js" type="text/javascript" charset="utf-8"></script>

После чего все ссылки на файлы с расширениями *.mp3, *.pdf, *.doc будут дополнены информацией о размерах файлов.

Внимание! Важно учитывать то, что информация о размере файла берется из HTTP-заголовка "Content-Length", некоторые веб-сервера могут его не отдавать и для ссылок на файлы с таких серверов размер указан не будет.

Скрипт addSizes.js можно легко модифицировать под свои цели, например можно добавить показ размера для всех внешних ссылок, для этого строчку:

$('a[href$=".pdf"], 'a[href$=".doc"], a[href$=".mp3"], a[href$=".m4u"]).each(function(){

нужно доработать таким образом:

$('a[href$=".pdf"], 'a[href$=".doc"], a[href$=".mp3"], a[href$=".m4u"], a[target$=_blank]').each(function(){

Кроме того, я рекомендую заменить строчку:

link.after(' (' + type + ' ' + length + ' ' + lengthUnits + ')');

на:

link.after(' <span class="filesize">(' + type + ' ' + length + ' ' + lengthUnits + ')</span>');

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

Работающий пример находится здесь: http://romka.eu/examples/autosize/index.html, в нем я, кроме вывода информации о размере документа, добавил вывод даты его последнего изменения, в случае если нет заголовка "Content-Length".

P.S. Хотите быстрее всех получать информацию об обновлениях на этом сайте? Тогда подпишитесь на RSS-канал ;)