Освоєння Ajax: Частина 8. Використання XML у запитах і відповідях (вихідні коди)

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


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


Сервер не може багато сказати (іноді)


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


Клієнт говорить парами "ім'я / значення"


Як ви пам'ятаєте з попередньої статті, клієнтові не потрібно використовувати XML в більшості випадків, тому що він може посилати запити, використовуючи пари "ім'я / значення". Тобто ви могли б послати, наприклад, таке ім'я: name = Jennifer. Можна скомпонувати ці значення, просто додаючи між парами амперсанд (&), наприклад: name = Jennifer & job = president. Використовуючи простий текст і ці пари – "ім'я / значення", клієнт легко може посилати серверу запити з численними значеннями. Дуже рідко з'являється необхідність додаткового структурування, яке надає XML.


Фактично, майже всі причини, за якими може знадобитися посилати XML серверу, можна розподілити на дві основні категорії:



Сервери не можуть відправляти пари "ім'я / значення" (стандартним чином)


Коли ви надсилаєте пари «ім'я / значення», Web-браузер, який посилає запити і відповідає на цей запит платформа, на якій розміщується програма-сервер, об'єднуються, щоб перетворити ці пари в дані, з якими програма-сервер може працювати. Практично кожна технологія серверної частини – від сервлетів Java до PHP або Perl, або Ruby on Rails – надає широкий спектр засобів для отримання значень на основі імені. Тому отримання аттрибута name – завдання тривіальна.


Але ситуація змінюється, коли напрямок передачі даних змінюється на протилежне. Якщо сервер відповідає додатком рядком name = Jennifer & job = president, у клієнта немає стандартизованого, простого способу розбити її на пари "ім'я / значення» і потім розбити кожну пару на ім'я і значення. Вам доведеться розбивати повернені дані вручну. Якщо сервер поверне відповідь, відразу складений з пар «ім'я / значення», то буде ненабагато простіше (а може бути навіть складніше) його інтерпретувати, ніж будь-яка відповідь з елементами, розділеними крапкою з комою, або символами конвеєризації "/", або ж будь-якими іншими нестандартними знаками форматування.







 




Дайте мені кілька пробілів!


У більшості HTTP-запитів керуюча послідовність символів% 20 використовується для представлення одного пробілу. Тому рядок "Live Together, Die Alone" буде пересилатися по HTTP як Live% 20Together,% 20Die% 20Alone.


Тоді виходить, що немає простого способу використовувати звичайний текст у відповідях і змушувати клієнта отримувати цю відповідь і інтерпретувати його стандартним чином, принаймні, коли він містить складні значення. Якщо ваш сервер просто відсилає назад, скажімо, число 42, то простий текст ідеально підходить. Але що робити, якщо потрібно відіслати назад останні рейтинги для телешоу Lost, Alias і Six Degree, причому все відразу? І хоча ви можете знайти безліч способів відправити відповідь, використовуючи звичайний текст (див. кілька прикладів в лістингу 1), жоден з них не буде інтерпретуватися без певної роботи на клієнтської частини, і жоден з них не стандартизовано.


Лістинг 1. Відповідь сервера для телерейтингів (різні версії)





show = Alias & ratings = 6.5/show = Lost & ratings = 14.2/show = Six% 20Degrees & ratings = 9.1

Alias=6.5&Lost=14.2&Six%20Degrees=9.1

Alias/6.5/Lost/14.2/Six%20Degrees/9.1


І хоча не надто складно зрозуміти, як розбити ці рядки відповіді, клієнт повинен проаналізувати і розділити рядок, грунтуючись на точках з комою, знаках рівності, вертикальних рисах і амперсанд. Ледве Чи це хороший спосіб написати ясний код, який інші розробники зможуть легко зрозуміти і підтримувати.


Введення XML


Коли ви зрозумієте, що у сервера немає стандартного способу для відповіді клієнтові парами «ім'я / значення», необхідність використання XML стане досить очевидною. Коли надсилаються дані на сервер, пари «ім'я / значення» – Чудовий вибір, так як сервер може легко інтерпретувати ці пари; те ж саме вірно і для повернення даних з використанням XML. Ви бачили застосування DOM для розпізнавання структури XML в декількох попередніх статтях, а в наступній статті дізнаєтеся, як JSON надає для цього ще один спосіб. І, що найголовніше, ви можете розглядати XML як простий текст і отримувати значення таким чином. Тому є кілька шляхів отримання XML-відповіді від сервера, і за допомогою досить стандартного коду витягти дані і використовувати їх в клієнті.


Додатковим бонусом можна вважати простоту розуміння XML. Більшість людей, які вміють програмувати, легко зрозуміють сенс даних в лістингу 2.


Лістинг 2. Відповідь сервера для телерейтингів (в XML)




                

<ratings>
<show>
<title>Alias</title>
<rating>6.5</rating>
</show>
<show>
<title>Lost</title>
<rating>14.2</rating>
</show>
<show>
<title>Six Degrees</title>
<rating>9.1</rating>
</show>
</ratings>


У коді лістингу 2 не потрібно ламати голову щодо того, що означає певна крапка з комою або апостроф.


Отримання XML від сервера


Так як ця серія статей фокусується на клієнтській стороні роботи Ajax, то я не буду вдаватися в деталі того, як може генерувати відповідь у вигляді XML серверна частина. Проте вам потрібно знати про деякі особливості того, як клієнт отримує XML.


По-перше, ви можете розглянути XML-відповідь від сервера двома основними способами:



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


Лістинг 3. Приклади телерейтингів, відформатовані в XML




                

<ratings>
<show>
<title>Alias</title>
<rating>6.5</rating>
</show>
<show>
<title>Lost</title>
<rating>14.2</rating>
</show>
<show>
<title>Six Degrees</title>
<rating>9.1</rating>
</show>
</ratings>


Робота з XML як зі звичайним текстом


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


У цій ситуації ви використовуєте властивість responseTest вашого об'єкта запиту, точно також як і у випадку, коли сервер посилає вам не XML-форматований відповідь (див. лістинг 4).


Лістинг 4. Вважаємо XML звичайним текстовим відповіддю з сервера




                

function updatePage() {
if (request.readyState == 4) {
if (request.status == 200) {
var response = request.responseText;

/ / Отримуємо відповідь з сервера у форматі XML
alert(response);
}
}
}






 




Перегляньте попередні статті


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


У цьому фрагменті коду updatePage() – Це зворотний виклик, а request – Це об'єкт XMLHttpRequest. І в підсумку ви ставите відповідь сервера в змінну response. Якщо б ви вивели на екран значення цієї змінної, то отримали б щось схоже на лістинг 5. (Зауважу, що зазвичай код, представлений в лістингу 5 – це одна довга рядок; тут він розбитий на кілька рядків для зручності.)


Лістинг 5. Значення змінної response




                

<ratings> <show> <title> Alias </ title> <rating> 6.5 </ rating>
</ Show> <show> <title> Lost </ title> <rating> 14.2 </ rating> </ show> <show>
<title> Six Degrees </ title> <rating> 9.1 </ rating> </ show> </ ratings>


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


Тут ви можете використовувати функцію JavaScript split для того, щоб розбити ці дані, і основні кошти управління рядком, щоб отримати імена елементів і їх значення. Звичайно, це додаткові зусилля, та ігнорування того факту, що ви витратили багато часу, вивчаючи DOM раніше в цій серії статей. Тому я закликаю вас запам'ятати, що ви можете використовувати XML-відповідь сервера за допомогою responseText, Але вам не варто використовувати цей підхід для отримання XML-даних, якщо можна використовувати DOM, що ви і побачите далі.


Щоб побачити це в дії, подивіться на лістинг 6. Цей код схожий на лістинг 4, але, замість того, щоб використовувати властивість responseText, Зворотній зв'язок використовує властивість responseXML. Це властивість, доступне в XMLHttpRequest, Повертає відповідь сервера у формі DOM-документа.


Розглядаємо XML як XML


Хоча ви можете розглядати відповідь сервера в XML-форматі, як і будь-який інший текстовий відповідь, зовсім необов'язково робити саме так. По-перше, якщо ви чесно прочитали попередні статті, ви знаєте, як використовувати DOM, JavaScript-дружній API, з якими ви можете управляти XML. Що ще краще, JavaScript і об'єкт XMLHttpRequest надають властивість, яке чудово підходить для отримання XML-відповіді від сервера, і його отримання у формі об'єкта Document DOM.


Лістинг 6. Розгляд XML як XML




                

function updatePage() {
if (request.readyState == 4) {
if (request.status == 200) {
var xmlDoc = request.responseXML;

/ / Працюємо з xmlDoc, використовуючи DOM
}
}
}


Тепер у вас є DOM Document, і ви можете працювати з ним, як і з будь-яким іншим XML. Наприклад, ви можете взяти всі елементи show, Як в лістингу 7.


Лістинг 7. Вибір всіх елементів show




                

function updatePage() {
if (request.readyState == 4) {
if (request.status == 200) {
var xmlDoc = request.responseXML;

var showElements = xmlDoc.getElementsByTagName(“show”);
}
}
}


Якщо ви вже знайомі з DOM, то вам і це буде знайомим. Ви можете використовувати будь-які методи DOM, про які ви вже дізналися, і легко керувати XML, отриманим від сервера.


Ви можете також, звичайно, вставити стандартний код JavaScript. Наприклад, ви можете написати цикл повторення по всіх елементах show, Як в лістингу 8.


Лістинг 8. Цикл за show-елементів




                

function updatePage() {
if (request.readyState == 4) {
if (request.status == 200) {
var xmlDoc = request.responseXML;

var showElements = xmlDoc.getElementsByTagName(“show”);
for (var x=0; x<showElements.length; x++) {
/ / Ми знаємо, що перший нащадок show – це title, а другий – rating
var title = showElements[x].childNodes[0].value;
var rating = showElements[x].childNodes[1].value;

/ / Тепер робіть що хочете з show, title і ratings
}
}
}
}


За допомогою цього достатньо простого коду, ми розглянули XML як XML, а не просто невідформатований текст, і трохи використовували DOM і JavaScript для обробки відповіді сервера. Ще більш важливо те, що ми працювали зі стандартизованим форматом – XML – замість формату з розділяють комами або парами "ім'я / значення" розділеними вертикальними рисами. Іншими словами, ми використовували XML там, де це мало сенс, і уникли цього в інших випадках, як, наприклад, у відправці запиту на сервер.


XML на сервері: короткий приклад


Хоча я практично не говорив про те, як генерувати XML на сервері, варто розглянути короткий приклад без докладних коментарів, просто щоб ви могли придумати якісь свої власні способи того, що робити в такій ситуації. У лістингу 9 показаний простий PHP-сценарій, який видає XML у відповідь на запит, імовірно від асинхронного клієнта.


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


Лістинг 9. Сценарій PHP, який повертає XML




                

<?php

/ / Підключаємося до бази даних MySQL
$ Conn = @ mysql_connect ("mysql.myhost.com", "username", "secret-password");
if (!conn)
die(“Error connecting to database: ” . mysql_error());

if (!mysql_select_db(“television”, $conn))
die(“Error selecting TV database: ” . mysql_error());

/ / Отримуємо рейтинги з усіх шоу в базі даних
$select = “SELECT title, rating”;
$from = ” FROM ratings”;
$queryResult = @mysql_query($select . $from);
if (!$queryResult)
die(“Error retrieving ratings for TV shows.”);

/ / Даємо знати клієнтові, що повертаємо XML
header(“Content-Type: text/xml”);
echo “<?xml version=”1.0″ encoding=”utf-8″?>”;
echo “<ratings>”;

while ($row = mysql_fetch_array($queryResult)) {
$title = $row[“title”];
$rating = $row[“rating”];

echo “<show>
echo “<title>” . $title . “</title>”;
echo “<rating>” . $rating . “</rating>”;
echo “</show>”;
}

echo “</ratings>”;

mysql_close($conn);

?>


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


Інші варіанти інтерпретації XML


Крім варіантів роботи з XML у вигляді неформатованого тексту або за допомогою DOM, є ще один дуже популярний спосіб, про який важливо згадати. Це JSON (JavaScript Object Notation) – вільний текстовий формат, який входить до комплекту з JavaScript. У цій статті не вистачить місця, щоб розповісти про JSON, тому я повернуся до нього через кілька місяців, можливо, ви почуєте про нього, як тільки згадаєте про XML або Ajax, так що тепер ви будете знати, про що говорять ваші колеги.


Загалом, все, що ви можете робити з JSON, ви можете робити з DOM і навпаки; вибір підходу залежить від особистих переваг і конкретного застосування. Тепер давайте зупинимося на DOM і ознайомимося з ситуацією отримання відповіді сервера. Я присвячу пару статей обговоренню JSON, і тоді ви зможете зробити вибір між ним і DOM при використанні в своєму додатку. Так що налаштуйтеся: ще більше інформації про XML чекає на вас у наступних статтях.


Висновок


Я говорив про XML майже безупинно, але все ще висвітлив тільки мінімум вкладу XML в роботу з Ajax. У наступній статті я більш детально розгляну особливі випадки, в яких ви повинні відправляти XML (і ви дізнаєтеся, в якому з цих випадків треба також отримувати XML назад). Зокрема, ви вивчіть Web-сервіси – як власні, так і такі API, як Google – у світлі роботи з Ajax.


Ваше завдання на найближчий час – обміркувати, в яких випадках є сенс використовувати XML у своєму додатку. Часто, якщо ваш додаток добре працює, то XML не представляє з себе нічого, крім модної технології, яка додасть вам головного болю, і ви повинні встояти перед спокусою використовувати її тільки для того, щоб сказати «а я у своєму додатку використовую XML».


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


Більш того, зрозумійте, що чим більше ви дізнаєтеся про технології пов'язаних з Ajax, тим більш обережним потрібно бути у своїх рішеннях. Звичайно, цікаво писати Web 2.0-додатки (і в наступних статтях я повернуся до призначеного для користувача інтерфейсу і покажу вам ще більш цікаві речі), але необхідно бути впевненим, що ви не додаєте модні технології на працюючу Web-сторінку, просто щоб вразити своїх друзів. Я знаю, що ви можете написати хороший додаток, так що не сидіть і просто зробіть це. Коли ви закінчите, повертайтеся за наступною статтею і ще більшою кількістю інформації з XML.


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


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

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

Ваш отзыв

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

*

*