Навіщо нам потрібен SSI?, Різне, Інтернет-технології, статті

Михайло Мельников,
Web-studio Cherry-Design

А! Так Ви навіть і не знаєте, що це таке? І, тим більше, не розумієте, навіщо він Вам потрібний? Що ж, значить, Ви прийшли, куди треба. Сьогодні тут усім пояснюють – навіщо їм потрібен SSI:

Як усі нормальні люди, спочатку розшифруємо абревіатуру SSI – Server Side Includes або, по-російськи, – включення на стороні сервера. Зрозуміло? Ні? Ну, тоді розповім детальніше:

SSI – це директиви, що вставляються прямо в HTML-код і службовці для передачі вказівок Wев-серверу. Зустрічаючи такі директиви, які, до речі, називаються SSI-вставками, Web-сервер інтерпретує їх і виконує відповідні дії. Які, запитаєте Ви? А от, наприклад: вставка HTML-фрагмента з іншого файлу, динамічне формування сторінок залежно від деяких змінних (наприклад, типу броузера) та інші не менш приємні речі.

Переваги SSI проявляються, коли нам потрібно підтримувати досить великий за обсягом сайт, що має певну структуру й повторювані елементи коду на всіх сторінках. Взагалі, при застосуванні серверних включень сайт зручно розглядати як складається з окремих блоків, кожен з яких відповідає за свою частину сторінки. Ці блоки практично незмінні й повторюються від сторінки до сторінки. У ці блоки можна винести такі елементи сторінки як: головне меню, рекламні вставки, що повторюються елементи оформлення сторінок і т.д. Фізично ці блоки являють собою просто HTML-файли, що містять частину коду, потрібну для виконання їх завдання.

Для того, щоб сервер знав, що сторінка не звичайна, а містить SSI-директиви, вона має спеціальне розширення: *. Phtml або *. Shtm, наявність якого і змушує web-сервер попередньо обробляти сторіночки. Взагалі, розширення може бути будь – залежно від конфігурації web-сервера, але в основному застосовується саме *. Phtml.

Повна сторінка формується web-сервером на льоту, збираючи код сторіночки з таких ось блоків. Для того, щоб вказати серверу, який блок потрібно вставити і в якому місці сторінки, використовується спеціальна форма запису у вигляді коментаря. Ось така:

<!--#command param="value" --> де # - ознака початку SSI-вставки; command - SSI-команда; param - параметри SSI-команди.

SSI-команд налічується близько десятка, але я розповім лише про самих вживаних. Найпопулярніша команда – це команда включення вмісту одного файлу в інший:

<!--#include virtual="/path/file.ssi" --> де include - команда вставки; virtual - параметр, що визначає, як трактувати шлях - як абсолютний (file)  або як відносний (virtual); "/ Path / file.ssi" - шлях до включається файлу.

Результатом її виконання буде вставка вмісту файлу file.ssi в місці появи даної директиви. При перегляді сформованого исходника HTML-файла ми не побачимо жодних ознак SSI, т.к. даний механізм діє абсолютно прозоро для броузерів, вони отримують виключно коректний HTML-код.

Наступна команда – це команда установки значення змінної:

<!--#set var="pic" value="picture.gif" --> де var - команда установки значення змінної; pic - ім'я змінної; picture.gif - значення змінної.

В даному випадку ми визначили змінну з ім’ям pic і привласнили їй строкове значення “picture.gif”. Значення змінної pic тепер доступно усередині SSI-вставки, і ми можемо його використовувати на нашу розсуд. Наприклад, використовуючи одну і ту ж SSI-вставку, але з різними значеннями визначеної в ній змінної, ми отримаємо різні результати. Перед тим, як показати реальний приклад використання змінних в SSI-включеннях, я розповім про деякі командах, що застосовуються при роботі з змінними. По-перше, це команда друку значення змінної:

<!--#echo var="pic" -->

Її виконання призведе до того, що в місці появи команди надрукується значення змінної pic, тобто “Picture.gif”.

Змінна може брати участь у виразах, в цьому випадку перед нею ставиться знак ‘$’, який показує, що це саме змінна, а не просто текст. Ось приклад:

<!--#set var="A" value="123" -->
<!--#set var="B" value="$A456" -->

Після такого присвоєння мінлива B буде містити рядок “123456”. Якщо ж в текст знадобиться просто вставити знак ‘$’ або який-небудь з інших спеціальних знаків, то його потрібно випередити слешем, ось так: ‘\ $’. У деяких випадках для уникнення двозначності значення змінної може бути укладена у фігурні дужки: “$ {A}”.

Більш складне застосування змінних можливо з використанням умовних операторів, що мають наступну форму написання:

<!--#if expr="condition" -->
<!--#elif expr="condition" -->
<!--#else -->
<!--#endif --> де condition - умова для порівняння.

В залежності від результатів перевірки ми можемо підставити той чи інший фрагмент коду. Припустимо, ми можемо проаналізувати тип броузера користувача і залежно від цього видати або код для Netscape Navigator-а, або Internet Explorer-а. Це може виявитися корисним в деяких випадках, коли неможливо зробити сторінку, яка коректно відображалася б в обох броузерах. Ось приклад використання умовного оператора:

<!--#set var="Monday" -->
<!--#if expr="$Monday " --> 

Сьогодні понеділок. <!--#else -->

Що завгодно, але не понеділок. <!--#endif -->

В даному випадку умовою перевірки є існування змінної $ Monday і, залежно від цього, підстановка того чи іншого HTML-коду.

Тепер давайте розглянемо реальний приклад застосування SSI для формування складного документа з декількох SSI-вставок. Спочатку напишемо текст основного HTML-документа, вважаючи, що SSI-вставки знаходяться в каталозі / ssi:

index.phtml


<!--#set var="keywords" value="SSI, SHTML, CGI, Apache" --> 
<!--#include virtual="ssi/_header.phtml" --> Тут знаходиться текст нашої сторінки.
<!--#include virtual="ssi/_footer.phtml" -->

Тепер напишемо код для цих SSI-вставок:

_header.phtml

<html>
<head>
<title><!--#echo var="title" --></title>
<meta name="keywords" content="<!--#echo var="keywords" -->">
<meta name="description" content="<!--#echo var="description" -->">
</head>
<body>

_footer.phtml

</body>
</html>

Як бачите, основний документ гранично спрощений і складається з директив, що встановлюють значення змінних title, keywords і description, які й будуть підставлені в код сторінки при обробці SSI-вставок, визначають код для верхньої і нижньої частин сторінки. Реальний код SSI-вставок зазвичай набагато складніше і може включати в себе більшу кількість визначених змінних і складних умов, що формують остаточний вид сторінки.

Перша перевага SSI з погляду дизайнера полягає в тому, що при такому підході web-майстру, занімающімуся підтримкою сайту, можна не боятися випадково зіпсувати дизайн. Елементи складної верстки приховані за рахунок використання SSI, і підтримка вмісту сторінок стає набагато більш легким і приємним справою.

Друге, не менш важлива перевага, – це можливість миттєвої заміни дизайну сайту, що не вимагає перероблення сторінок з інформаційним змістом сайту. Для зміни дизайну досить переписати SSI-вставки, що формують зовнішній вигляд сайту. В нашому випадку це файли _header.phtml і _footer.phtml.

Ось, коротко те, що можна розповісти про SSI. Якщо Вас це зацікавило, то можливо Вам буде цікаво прочитати статтю на сайті web-клубу, де про це написано більш докладно і наведено повний список SSI-директив з прикладами.

Схожі статті:


Сподобалася стаття? Ви можете залишити відгук або підписатися на RSS , щоб автоматично отримувати інформацію про нові статтях.

Коментарів поки що немає.

Ваш отзыв

Поділ на параграфи відбувається автоматично, адреса електронної пошти ніколи не буде опублікований, допустимий HTML: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>

*

*