Лекції з дисципліни "Веб-дизайн"

Лекція 4: Веб-програмування

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

Клієнт-серверна архітектура додатку характерна наявністю в системі одного або кількох серверів та одного або кількох клієнтів. Сервер і клієнт є окремими частинами розподіленої інформаційної системи, до яких відносять як програмну так і апаратну її складову.

Як правило, клієнтська частина додатків спілкується з користувачем за допомогою користувацького інтерфейсу, формуючи параметри користувацького запиту, після чого запит відправляється на сервер. Серверна частина приймає запит, виконує всі необхідні обчислення і відправляє результат назад до клієнта.

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

•Протокол HTTP (HyperText Transfer Prоtocоl). Прикладний мережний протокол на базі стеку TCP/IP, який призначено для передачі гіпертексту.

•Веб-клієнт - Інтернет браузер.

•Веб-сервер - додаток, який вміє обробляти HTTP запити. Найбільш популярними веб-серверами є сервер Apache, який працює під управлінням серверної операційної системи UNIX і Internet Information Server (IIS), що функціонує під управлінням серверної версії Microsoft Windows.

Особливості веб-програмування

Контекст виконання

Якщо у випадку із звичайним "настільним" додатком контекст його виконання представлено структурами даних, які розміщені в оперативній пам'яті в рамках одного процесу на клієнтській машині, то в разі веб-програмування все дещо складніше:

1.Контекст виконання поділено на всіх учасників розподіленої системи, і вони зобов'язані його поділяти та синхронізувати між собою.

2.Контекст виконання теоретично існує лише під час формування та обробки одного клієнт-серверного запиту. Життєвий цикл всіх структур даних в оперативній пам'яті обмежено не всім періодом роботи клієнта з веб-додатком, а часом підготовки, відправки та обробки одного HTTP запиту.

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

Адже stateless (без стану) модель використання сервера, коли система не зберігає свого стану між запитами, а "прокидається" тільки тоді, коли запит необхідно обробити, є більш надійною в порівнянні зі stateful (з підтримкою стану) моделлю. Це так, оскільки вихід з ладу апаратної або системної програмної частини сервера може привести до непередбачуваної поведінки веб-додатку лише у випадку, якщо цей збій станеться в момент обробки запиту.

Також, елементарно може не вистачити оперативної пам'яті для обслуговування великої кількості клієнтських запитів, за умови, що кожному сеансу необхідно забезпечити можливість зберігати і відновлювати свій стан.

Тим не менше, зовсім без контексту виконання, що розділяється між запитами в деяких завданнях обійтися досить складно, оскільки під час обчислень часто доводиться працювати з ресурсами, звернення до яких може займати багато часу. Для зменшення подібних витрат найбільш критичні ресурси розробники вважають за краще зберігати - в оперативній пам'яті веб-сервера.

Способи управління станом веб-додатку

Оскільки додаток забезпечує спілкування клієнта і сервера, то і контекст ділиться на клієнтський і серверний. Далі перелічено способи збереження і відновлення контексту виконання (стану сеансу роботи) веб-додатку на стороні клієнта і на стороні сервера.

Контекст виконання на стороні клієнта можна зберігати:

•В оперативній пам'яті програми клієнта (браузері). З виходом HTML5 для цих цілей в браузерах має з'явитися підтримка сервісів SessionStorage і LocalStorage. Це дуже розумно, оскільки використовується оперативна пам'ять клієнта, а не сервера, який "один на всіх". З іншого боку, не всі дані можна зберігати на стороні клієнта, оскільки не всі дані можна перетворити в текстовий формат і передати на сервер.

•В невеликих фрагментах текстових даних, що зберігаються на стороні клієнта - cookies. Cookies зберігаються в текстових файлах, у розділах, виділених операційною системою для зберігання різної інформації користувачів. Ці дані передаються кожного разу до сервера в заголовках HTTP запиту. Окремим недоліком цього способу є те, що застосування cookies може бути заборонено клієнтом.

Контекст виконання на стороні сервера можна зберігати:

•В області оперативної пам'яті, що виділяється веб-сервером (Apache, IIS) і називається стан додатка. Ці дані доступні з всіх сторінок веб-додатку для всіх його користувачів.

•В області оперативної пам'яті, що називається стан сеансу. На відміну від стану додатка ця область виділяється окремо для кожного користувача і зберігається протягом сеансу його роботи з веб-додатком (від моменту переходу на сторінку програми та до моменту закриття останньої його сторінки).

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

Ще одним досить надійним способом зберігання даних стану сеансу є використання елементів HTML розмітки. Додаток на стороні клієнта може силами того ж JavaScript і DOM створити приховані елементи з прихованими полями, про існування яких буде знати тільки сервер. Сервер, у свою чергу, обробить ці дані і в них же помістить відповідь, якщо це необхідно.

Взаємодія різних компонентів.

Проблема стандартизації і уніфікації взаємодії різних програмних компонентів складних програмних продуктів властива не лише для веб-додатків. Сучасні настільні додатки також складаються з різних бібліотек, які можуть бути написані різними розробниками і з використанням різних програмних платформ і мов програмування. Для універсального способу спілкування таких компонентів між собою провідними компаніями-розробниками створюються відповідні стандарти і технології, наприклад Component Object Model (COM) і. NET Framework від компанії Microsoft або архітектура Common Object Request Broker Architecture (CORBA), що просувається консорціумом OMG.

Елементам веб-додатку також доводиться спілкуватися між собою, але їх спілкування відбувається на відстані (не в рамках одного процесу). З метою організації обміну інформацією між клієнтом і сервером часто використовують XML, який добре підходить для опису будь чого, що має яскраво виражену структуру. XML поміщають в тіло HTTP запиту і відправляють на сервер.

Мова XML - це універсальний будівельний матеріал, придатний для вирішення абсолютно різних завдань, тому на її базі створюються спеціалізовані мови - протоколи мережної взаємодії, які надалі стають загальноприйнятими стандартами. До таких протоколів слід віднести:

•Web Services Description Language (WSDL) - мова опису інтерфейсів веб-сервісів

•Simple Object Access Protocol (SOAP) - протокол обміну структурованими повідомленнями між компонентами розподіленої інформаційної системи.

Найчастіше повідомлення SOAP являють собою сигнатуру віддалених викликів процедур і функцій (методів) веб-сервісу з параметрами та без. Безумовно, для написання найпростіших веб-додатків, побудовою клієнта і сервера яких займається один програміст або одна група програмістів необов'язково використовувати всі ці надбудови, але якщо створюється Інтернет ресурс, клієнтами якого повинні стати не лише користувачі, але і веб-додатки, що створені іншими компаніями, то в процесі його розробки краще дотримуватися загальноприйнятих стандартів.

Області застосування веб-програмування

Веб-дизайн

Розробка дизайну і функціональності графічного користувацького інтерфейсу веб-додатку, що створено  за допомогою мови розмітки гіпертексту і супутніх технологій.

•Основи HTML/XHTML. Універсальна мова розмітки XML.

•Шаблоны и макеты. Тут втілено рішення типових завдань, з якими часто мають справу веб-дизайнери: створення макету або шаблону Інтернет сторінки, меню, елементів керування закладками, ієрархічної навігації типу "дерево" і багато іншого.

•HTML5.  Нововведення, які почнуть підтримуватися всіма сучасними браузерами після того, як HTML5 офіційно отримає статус рекомендації консорціуму W3C.

Програмування на стороні клієнта

Тема веб-програмування на стороні клієнта безпосередньо пов'язана з веб-дизайном, але винесена окремим пунктом

•JavaScript. Популярна мова, що підтримується всіма сучасними браузерами. На HTML сторінку додають JavaScript код і використовують об'єктно-орієнтованих підхід при написанні користувацьких сценаріїв.

•jQuery. Бібліотека, написана на JavaScript, до складу якої входить величезна кількість корисних функцій для роботи з об'єктною моделлю завантаженої веб сторінки: від редагування вмісту сторінки до створення різних візуальних ефектів.

•AJAX. Технологія створення динамічних веб сторінок на основі асинхронного завантаження гіпертексту (результат асинхронного виконання HTTP запитів) в окремі області поточної сторінки. Технології AJAX використовують JavaScript та бібліотеки jQuery.

Програмування на стороні сервера

Програмна обробка параметрів HTTP запитів, перевірка коректності переданих даних, робота з серверними базами даних тощо.

•PHP. Найбільш популярний засіб веб-програмування на стороні сервера. PHP підтримується більшістю хостинг-провайдерами.

•ASP.NET. Технологія веб-програмування від компанії Microsoft. Середовище ASP.NET дозволяє створювати веб-додатки так само легко, як і звичайні програми. До мінусів ASP.NET можна віднести, що вона розмиває для розробника межі між звичайним програмуванням і веб-програмуванням, і програміст не відчуває, як саме працює його додаток.