JavaScript. Подробное руководство, 6-е издание, стр. 282

 request.send(JS0N.stringify(data));

}

18.1.3.3. Запросы с данными в формате XML

Иногда для представления передаваемых данных также используется формат XML. Данные в запросе информации о пиццерии можно было бы передавать не в формате представления данных форм и не в формате JSON представления JavaScript-объектов, а в формате XML-документа. Тело такого запроса могло бы иметь следующий вид:

<query>

 <find zipcode="02134" radius="1km"> pizza </find>

</query>

Во всех примерах, встречавшихся до сих пор, аргументом метода

send()

объекта

XMLHttpRequest

была строка или значение null. В действительности же этому методу можно также передать объект Document XML-документа. Пример 18.8 демонстрирует, как создать объект

Document

простого XML-документа и использовать его в качестве тела НТТР-запроса.

Пример 18.8. Выполнение запроса HTTP POST с XML-документом в качестве тела

<b>// Параметры поиска &quot;что&quot;, &quot;где&quot; и &quot;радиус&quot; оформляются в виде XML-документа // и отправляются по указанному URL-адресу. При получении ответа вызывает // указанную функцию</b>

function post()uery(url, what, where, radius, callback) {

 var request = new XMLHttpRequest();

 request.open("POST", url); // Методом POST на указанный url

 request.onreadystatechange = function() { // Простой обработчик

 if (request.readyState === 4 && callback) callback(request);

 };

 // Создать XML-документ с корневым элементом <query>

 var doc = document.implementation.createDocument("", "query", null);

 var query = doc.documentElement; // Элемент <query>

 var find = doc.createElement("find"); // Создать элемент <find>

 query.appendChild(find); // И добавить в <query>

 find.setAttribute("zipcode", where); // Атрибуты <find>

 find.setAttribute("radius”, radius);

 find.appendChild(doc.createTextNode(what)); // И содержимое <find>

 // Отправить данные в формате XML серверу.

<b>  // Обратите внимание, что заголовок Content-Type будет установлен автоматически, </b>

 request.send(doc);

}

Обратите внимание, что пример 18.8 не устанавливает заголовок «Content-Type» запроса. Когда методу

send()

передается XML-документ, то объект

XMLHttpRequest

автоматически установит соответствующий заголовок «Content-Type», если он не был установлен предварительно. Аналогично, если передать методу

send()

простую строку и не установить заголовок «Content-Type», объект

XMLHttpRequest

автоматически добавит этот заголовок со значением «text/plain; charset=UTF-8». Программный код в примере 18.1 явно устанавливает этот заголовок, но в действительности для данных в простом текстовом виде этого не требуется.

18.1.3.4. Выгрузка файлов

Одна из особенностей HTML-форм заключается в том, что, если пользователь выберет файл с помощью элемента

<input type="file">

, форма отправит содержимое этого файла в теле POST-запроса. HTML-формы всегда позволяли выгружать файлы, но до недавнего времени эта операция была недоступна в прикладном интерфейсе

XMLHttpRequest

. Прикладной интерфейс, определяемый спецификацией «ХНН2», позволяет выгружать файлы за счет передачи объекта

File

методу

send().

В данном случае нельзя создать объект с помощью конструктора

File():

сценарий может лишь получить объект

File

, представляющий файл, выбранный пользователем. В броузерах, поддерживающих объекты

File

, каждый элемент

<input type="file">

имеет свойство

files

, которое ссылается на объект, подобный массиву, хранящий объекты

File

. Прикладной интерфейс буксировки (drag-and-drop) (раздел 17.7) также позволяет получить доступ к файлам, «сбрасываемым» пользователем на элемент, через свойство

dataTransfer.files

события «drop». Поближе с объектом

File

мы познакомимся в разделах 22.6 и 22.7. А пока будем рассматривать объект

File

как полностью непрозрачное представление выбранного пользователем файла, пригодное для выгрузки методом

send().

В примере 18.9 представлена ненавязчивая JavaScript-функция, добавляющая обработчик события «change» к указанным элементам выгрузки файлов, чтобы они автоматически отправляли содержимое любого выбранного файла методом POST на указанный адрес URL.

Пример 18.9. Выгрузка файла посредством запроса HTTP POST

<b>// Отыскивает все элементы &lt;input type=”file&quot;&gt; с атрибутом data-uploadto</b>

<b>// и регистрирует обработчик onchange, который автоматически отправляет </b>