Вставка случайного элемента в html страницу средствами SSI

Случайная выборка на SSI

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

Если на вашем хостинге есть PHP или CGI и вы знаете как с ними управляться, то эта статья вам не нужна. И даже если не очень знаете, то имеется большое число готовых PHP\CGI скриптов, решающих эту задачу.

Но проблема в том, что на некоторых хостингах (особенно бесплатных) не включены PHP\CGI. Тогда задачу случайного вывода элемента обычно возлагают на Java script. Это не лучшее решение. Во-первых, у некоторых пользователей Java выключена и они не увидят ваших усилий. А те юзеры, у которых Java включена будут вынуждены сгружать к себе весь массив (текстов или фотографий), что увеличивает время загрузки, и потом обрабатывать его сгруженным Java script`ом на своем компьютере. То есть при Java script мы зависим от настроек пользователя, ширины его канала и загрузки компьютера. Нехорошо.

Чтобы этого не было, надо, чтобы сервер сразу отдал пользователю готовую страницу, которую не надо дополнительно обрабатывать. Но, как мы помним, PHP\CGI у нас нет, или мы не можем ими пользоваться. Что остается? Единственная возможность использовать SSI (server side include).

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

AddHandler server-parsed .shtml .shtm .html .htm

в файле .htaccess. При этом SSI директивы будут исполняться и в html\htm файлах. Такой способ включения SSI хостеры обычно не рекомендуют (он увеличивает нагрузку на сервер), но бывают случаи, когда иного выхода нет.

 

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

Довольно просто на SSI можно реализовать следующую логику: "Если последняя цифра секунд текущего времени оканчивается на 0, то показать картинку 0.jpg, если на 1 – 1.jpg, ..... если на 9 – 9.jpg". Ясно, что это не совсем случайный выбор. Но посетитель сайта этого не заметит. Каждый его заход будет в различное (и случайное) время, следовательно и картинку он получит практически случайную.

Вот SSI код (левый столбец зеленым шрифтом, справа только пояснения, не входящие в код), реализующий псевдослучайную выборку из 10 картинок:

<!-- Старт вставки случайной картинки //--> Начало
<!--#config timefmt="%S" -->
<!--#set var="NUM_SEC" value="$DATE_LOCAL" -->
Получаем текущее время от сервера
 в формате секунд
<!--#if expr="$NUM_SEC = /0$/" -->
<img border="0" src="0.jpg">
Если цифра секунд кончается на 0,
 то вставить в код страницы :
<img border="0" src="0.jpg">
<!--#elif expr="$NUM_SEC = /1$/" -->
<img border="0" src="1.jpg">
<!--#elif expr="$NUM_SEC = /2$/" -->
<img border="0" src="2.jpg">
<!--#elif expr="$NUM_SEC = /3$/" -->
<img border="0" src="3.jpg">
<!--#elif expr="$NUM_SEC = /4$/" -->
<img border="0" src="4.jpg">
<!--#elif expr="$NUM_SEC = /5$/" -->
<img border="0" src="5.jpg">
<!--#elif expr="$NUM_SEC = /6$/" -->
<img border="0" src="6.jpg">
<!--#elif expr="$NUM_SEC = /7$/" -->
<img border="0" src="7.jpg">
<!--#elif expr="$NUM_SEC = /8$/" -->
<img border="0" src="8.jpg">
<!--#elif expr="$NUM_SEC = /9$/" -->
<img border="0" src="9.jpg">
То же самое, что и предыдущем пункте,
 только по очереди проверяем цифры
от 1 до 9. И вставляем в html описание соответствующей цифре картинки
<!--#endif -->
<!-- Конец вставки случайной картинки //-->
Выход

Вот этот код в текстовом файле.

Результаты работы данного скрипта можно увидеть на www.dl2kq.de, им меняется картинка в центре страницы. В коде же страницы увидеть ничего нельзя – все делает сервер, отдавая пользователю только 1 строку результата своей работы – вставляемую картинку.

Вместо описания картинок (то, что в вышеприведенном коде имеет вид <img border="0" src="0.jpg">) может быть вставлен любой кусок html кода, например, текст приветствия или цитаты.

Если элементов меньше, чем 10 (например 5), то их просто вставляют дважды. Например, 1-я картинка вставляется в 0-ю и в 5-ю секунды, 2-я – в 1-ю и в 6-ю секунды, и т.п.

Если элементов больше 10, то можно использовать не одну последнюю, а две цифры секунд. При этом можно вставлять до 60-ти элементов. Изменения в коде при этом минимальные: сначала copy-paste увеличить число строк до 60 и изменить запись секунд с одной на две цифры. Так:


<!-- Старт вставки случайного текста //-->
<!--#config timefmt="%S" -->
<!--#set var="NUM_SEC" value="$DATE_LOCAL" -->
<!--#if expr="$NUM_SEC = /00$/" -->
  Вставляемый текст 0
<!--#elif expr="$NUM_SEC = /01$/" -->
  Вставляемый текст 1
<!--#elif expr="$NUM_SEC = /02$/" -->
   Вставляемый текст 2
....
<!--#elif expr="$NUM_SEC = /59$/" -->
    Вставляемый текст 59
<!--#endif -->
<!-- Конец вставки случайного текста //-->
 

 Результаты работы данного скрипта можно увидеть на www.dl2kq.de, им выбирается анекдот слева. В коде же страницы увидеть ничего нельзя – все делает сервер, отдавая пользователю только выбранный анекдот.



Bonn, 13.09.2010 На главную - Main page >>