Асинхронне завантаження за допомогою XML

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

Незважаючи на те, що ми не можемо скоротити час, який минає від передачі запиту серверу до отримання відповіді від нього, існують способи передачі запитів в асинхронному режимі; при цьому користувач може продовжувати роботу з програмою. Першою спробою вирішити подібну задачу була взаємодія у фоновому режимі з використанням елементів I Frame. Згодом було знайдено найкраще рішення – використання об'єкта XMLHttpRequest. Нижче ми розглянемо обидві технології.

2.5.1. Елементи IFrame

З появою четвертої версії браузерів Netscape Navigator і Microsoft Internet Explorer стали доступні засоби DHTML, які забезпечують можливість компонування програми. Природним розширенням системи кадрів HTML став елемент I Frame. У його назвіперша буква умовно означає inline (вбудований), тобто. Фрейм є елементом іншого документа, а чи не його повноправним "сусідом". IFrame представляється як елемент деревоподібної структури DOM, а це означає, що його можна переміщати, змінювати розміри і навіть приховати, причому решта сторінки залишиться видимою. Факт, що з елементом I Frame можна пов'язувати стилі

IFrame

Розділ 2. Знайомство з Ajax

Мал. 2.5. Послідовність подій, що виникають при асинхронній взаємодії документа із сервером. В результаті дій користувача формується асинхронний запит серверу від прихованого об'єкта (IFrame або XMLHttpRequest). Метод дуже швидко повертає керування, блокуючи інтерфейс лише на короткий період часу (цей інтервал виділено сірим кольором). Функція зворотного дзвінка здійснює розбір відповіді сервера і потім оновлює інтерфейс користувача

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

Подібно до інших елементів DOM, IFrame можна оголосити у складі сторінки або згенерувати програмно, викликавши document . createElement (). У простих ситуаціях, коли нам потрібен один невидимий елемент IFrame для завантаження даних, ми можемо оголосити його як частину документа та отримати доступ до нього із програми, викликавши document. getElementByld(), як показано у лістингу 2.6.