Html5, об'єкт xmlhttprequest

Додавання в наш інструментарій серверного програмування представляє невелику проблему. З одного боку, вибір мови серверного програмування не має значення за умови, що він може працювати з чисто HTML5-сторінками (а всі ці мови можуть). Але з іншого боку, безглуздо влазити по вуха в вивчення нової технології, яку ви не плануєте використовувати або не підтримувану вашим веб-хостом. А хороших мов серверного програмування предостатньо, включаючи PHP, ASP.NET. Ruby, Java, Python і багато інших.

Об'єкт XMLHttpRequest спочатку був створений корпорацією Microsoft для того, щоб поліпшити веб-версію своєї програми електронної пошти Outlook, але він поступово поширився на всі сучасні браузери. В даний час він є основною частиною більшості сучасних веб-додатків.

Об'єкт XMLHttpRequest є ідеальним інструментом для отримання даних з веб-сервера. Далі наведено кілька прикладів даних, які можна отримати з веб-сервера за допомогою цього об'єкта:

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

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

Кращий спосіб розібратися з об'єктом XMLHttpRequest - це почати експериментувати з ним. Цим ми і займемося в наступних розділах, розглянувши два простих прикладу.

Відправлення запиту веб-сервера

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

Html5, об'єкт xmlhttprequest

При натисканні кнопки "Запитати у сервера" веб-сторінка створює об'єкт XMLHttpRequest і відправляє два числа на веб-сервер. Веб-сервер відпрацьовує простий сценарій, який виконує математичну операцію над числами, і відправляє відповідь назад на веб-сторінку.

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

створення сценарію

Сценарій PHP створюється як простий текстовий файл (WebCalculator.php) і має наступну структуру:

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

Навіть якщо ви і не експерт по PHP, у вас, швидше за все, не буде труднощів розібратися, що цей код робить. Насамперед ми отримуємо два числа, відправлені веб-сторінкою. Знак долара ($) позначає змінну, тому код створює дві змінні: $ num1 і $ num2. Значення для змінних код витягує з вбудованою в PHP колекції, яка називається $ _GET. Ця колекція містить всю інформацію з URL, за допомогою якої було запитано даний сценарій.

Наприклад, якщо помістити сценарій PHP в файл WebCalculator.php, рядок із запитом цього сценарію буде виглядати так:

В даному випадку URL містить дві одиниці інформації в кінці (в частині URL, що називається рядком запиту - query string). Значення першої змінної в цій частині, number1, так само 34, а другий, number2, так само 58. Початок рядка запиту позначається знаком питання (?), А кожна наступна змінна - знаком амперсанда ().

Коли код PHP починає виконуватися, він витягує цю інформацію з URL і зберігає її в колекції $ _GET, де вона доступна для наступних операцій. (Більшість платформ серверного програмування підтримує модель, подібну до цієї. Наприклад, в технології ASP.NET ця інформація зберігається в колекції Request.QueryString.)

Ветерани HTML знають, що дані на веб-сервер можна відправляти двома способами - за допомогою рядка запиту або вставкою їх в тіло запиту. У будь-якому випадку дані кодуються однаково, і доступ до них на сервері надається схожим чином. Наприклад, в PHP дані, передані в тілі запиту, поміщаються в колекцію $ _POST.

Отримавши ці два числа, сценарій PHP просто підсумовує їх. Останній крок - відправити результати назад веб-сторінці, яка подала запит. Ці результати можна було б обернути в розмітку HTML або навіть в пристосовану для даних розмітку XML, але це буде занадто. Для даного прикладу, і простого тексту буде цілком достатньо. Але незалежно від обраного формату даних, все, що потрібно для їх відправки - це проста PHP-команда echo.

Отже, сценарій складається з усього чотирьох рядків PHP-коду. Але цього достатньо, щоб встановити основний шаблон: веб-сторінка задає веб-серверу питання, а веб-сервер надає відповідь на це питання.

Звернення до веб-сервера

Другим кроком буде створення сторінки, яка за допомогою об'єкта XMLHttpRequest використовує сценарій PHP. Структура сторінки показана нижче:

Схожі статті