Используя объекты XMLHttpRequest

Safari, Инструментальная панель и основанная на WebKit поддержка приложений JavaScript XMLHttpRequest объект. XMLHttpRequest (часто сокращаемый как XHR), позволяет Вам легко выбирать содержание от сервера и использовать его в Вашей веб-странице или виджете, не требуя перезагрузки страницы.

Например, можно использовать XHR для обновления страницы результатов поиска хранилища так, чтобы, когда пользователь вводит почтовый индекс, сайт мог вывести на экран хранилища в разумном расстоянии. Щелчок по хранилищу мог тогда заполнить определенное отделение содержания подробными данными о том хранилище.

Конечно, Вы могли сделать любую из этих вещей без XHR (путем требования полностраничной загрузки или включением информации о каждом хранилище в стране на единственной странице), но XHR обеспечивает способ сделать это более эффективно с меньшим количеством пропускной способности.

Введение в XMLHttpRequest

XMLHttpRequest объект JavaScript, предоставленный WebKit, выбирающим данные через HTTP для использования в Вашем коде JavaScript. Это настраивается для получения данных XML, но может использоваться для выполнения любого Запроса HTTP. Данные XML сделаны доступными в Объекте DOM, позволяющем Вам использовать стандартные операции DOM, как обсуждено в Использовании Объектной модели документа От JavaScript, извлечь данные из ответа запроса.

Как правило, Вы определяете XMLHttpRequest опции объекта и обеспечивают onload или onreadystatechange обработчик, затем отправьте запрос. Когда запрос завершен, Вы работаете или с текстом ответа запроса или с его ответом XML, как обсуждено в Ответах XMLHttpRequest.

Определение объекта XMLHttpRequest

Создать новый экземпляр XMLHttpRequest объект, вызовите конструктора объекта с new ключевое слово и сохраняет результат в переменной, как это:

var myRequest = new XMLHttpRequest();

После создания нового XMLHttpRequest объект, вызвать open инициализировать запрос:

myRequest.open("GET", "http://www.apple.com/");

open метод требует двух параметров: метод HTTP и URI данных для выборки. Также может потребоваться еще три параметра: асинхронный флаг, имя пользователя и пароль. По умолчанию, XMLHttpRequest выполняется асинхронно.

После открытия запроса использовать setRequestHeader обеспечить любые дополнительные HTTP-заголовки для запроса, как это:

myRequest.setRequestHeader("Cache-Control", "no-cache");

Для обработки различных состояний запроса установите функцию-обработчик для onreadystatechange событие:

myRequest.onreadystatechange = myReadyStateChangeHandlerFunction;

Если единственное состояние, которым Вы обеспокоены, loaded состояние (состояние 4), попытайтесь использовать onload событие вместо этого:

myRequest.onload = myOnLoadHandlerFunction;

Когда запрос будет готов, используйте send метод для отправки его:

myRequest.send();

Если Ваш запрос отправляет содержание, как строка или Объект DOM, передайте его в как параметр send метод.

Ответы XMLHttpRequest

После того, как Вы отправите свой запрос, можно прервать его с помощью abort метод:

myRequest.abort();

Если Вы обеспечили onreadystatechange обработчик, можно запросить запрос для нахождения его текущего состояния с помощью readyState свойства:

var myRequestState = myRequest.readyState;

A readyState значение 4 средние значения, которые загрузило содержание. Это подобно обеспечению onload обработчик, который вызывают когда запрос readyState равняется 4.

Когда запрос закончен, загрузившись, можно запросить его состояние HTTP с помощью status и statusText свойства:

var myRequestStatus = myRequest.status;
var myRequestStatusText = myRequest.statusText;

Кроме того, можно выбрать заголовки ответа HTTP запроса с помощью getResponseHeader метод:

var aResponseHeader = myRequest.getResponseHeader("Content-Type");

Для получения списка всех заголовков ответа для запроса использовать getAllResponseHeaders:

var allResponseHeaders = myRequest.getAllResponseHeaders();

Для получения ответа запроса XML как Объект DOM используйте responseXML свойство:

var myResponseXML = myRequest.responseXML;

Этот объект реагирует на стандартные методы DOM, как getElementsByTagName. Если ответ не находится в допустимом формате XML, используйте responseText свойство для доступа к ответу необработанного текста:

var myResponseText = myRequest.responseText;

Соображения безопасности

В Safari, XMLHttpRequest объект может только выполнить запросы к http и https URIs в том же домене как веб-страница.

Как исключение, однако, начинаясь с Safari 4.0, веб-сайт может позволить содержанию, подаваемому другими веб-сайтами запрашивать данные от определенного http и https URLs на их серверах.

Используя XMLHttpRequest для запросов перекрестного сайта

По большей части, XMLHttpRequest возразите работам тот же путь, когда используется способом перекрестного сайта. Существует несколько исключений, как бы то ни было.

  • cookie — поскольку код JavaScript не находится в том же домене, не возможно установить или считать cookie для того домена.

  • аутентификационные маркеры — Как с cookie, не возможно добавить или считать информацию аутентификации для удаленного домена.

  • Referer заголовок — поскольку это может содержать конфиденциальную информацию о пути, Referer заголовок не отправляется в удаленный сайт. Можно, однако, проверить Origin заголовок для определения доменного имени относящейся страницы.

  • другие заголовки — Большинство HTTP-заголовков явно вычищается и при отправке и получении. Отправляющиеся единственные заголовки:

    • Accept— список разделенных запятой значений интернет-значений Типа среды (как определено в RFC 1590), которые приемлемы как ответ для запроса. Они могут быть тегированы с качественными значениями для указания предпочтения, каждый заменяет другого вводом с клавиатуры.

      Например, Примите: text/html, text/plain;q=.5 указывает, что вызывающая сторона предпочитает данные HTML с подразумеваемым качеством 1, но также примет данные простого текста с явным качеством 0.5

      Второе поле может быть заменено звездочкой (*) подстановочный символ (Accept: text/*, например). Первое поле может также быть подстановочным знаком, если и только если второе поле содержит подстановочный знак (Accept: */*).

    • Accept-Language— список разделенных запятой значений естественных языков, предпочтенных пользователем, дополнительно тегированным с качеством, оценивает за каждый язык. Значения языкового тега определяются RFC 1766.

      Например, Accept-Language: de, en-gb;q=.5, es указывает, что пользователь предпочитает немецкий или испанский язык с подразумеваемым качеством 1, но будет терпеть британский вариант английского языка с явным качеством 0.5.

    • Content-Language— естественный язык содержания запроса (en-US, например), как определено RFC 1766.

    • Content-Type— интернет-Тип среды для данных в запросе (Content-Type: text/html, например), как определено в RFC 1590.

    • Origin— отправленный браузером для указания домена, от которого был отправлен запрос. Это поле содержит часть непути URL (http://example.com, например).

    Единственные заголовки, которые Ваш сценарий может ожидать получать от сервера (после того, как браузер отфильтрует их):

    • Host— обеспечивает имя хоста и номер порта сервера, отправляющего ответ.

    • Cache-Control— предоставляет кэширующуюся информацию политики.

    • Content-Language— список разделенных запятой значений естественного языка содержания (en-US, например), как определено RFC 1766.

    • Content-Type— интернет-Тип среды для данных в ответе (Content-Type: text/html, например), как определено в RFC 1590.

    • Expires— дата и время, в которой должен быть отброшен любой кэш этих данных. Формат даты указан RFC 1123.

    • Last-Modified— новая дата и время, когда было изменено содержание документа. Формат даты указан RFC 1123.

    • Pragma— используемый для дополнительных специфичных для реализации директив, которые могут примениться к промежуточным веб-кэшам, браузеру, и т.д.

    Все другие заголовки могут быть вычищены.

Заголовки запроса управления доступом

Прежде, чем выполнить фактический запрос, браузер сначала отправляет OPTIONS запросите к серверу, чтобы спросить, позволяется ли отправить фактический запрос. Следующие заголовки отправляются браузером как часть этого запроса и могут использоваться сценариями на удаленном веб-сервере при решении, позволить ли запрос:

Origin

Содержит часть непути ресурса, обращающегося с просьбой (например, http://example.com).

Access-Control-Request-Method

Содержит метод, который будет использовать фактический запрос (GET или POST, например).

Access-Control-Request-Headers

Указывает, какие HTTP-заголовки будут отправлены в фактическом запросе.

Заголовки ответа управления доступом

Прежде, чем выполнить фактический запрос, браузер сначала отправляет OPTIONS запросите к серверу, чтобы спросить, позволяется ли отправить фактический запрос. Следующие заголовки могут быть отправлены удаленным веб-сервером (или сценарии, работающие на том сервере) в ответ на этот запрос для управления политиками доступа перекрестного сайта:

Access-Control-Allow-Origin

Указывает, что определенный источник может получить доступ к ресурсу. Значение может быть любой определенным источником (http://example.com, например) или звездочка (*) подстановочный знак, позволяющий любому домену получать доступ к ресурсу.

Access-Control-Max-Age

Указывает, сколько времени браузер должен продолжать кэшировать принятие сайта запросов от других доменов. Если Ваш сайт только позволяет запросы от других доменов после некоторого определенного квитирования пользователем, например, Вы могли бы установить это в короткое значение.

Access-Control-Allow-Credentials

Указывает, что запрос может быть выполнен с учетными данными. Единственное допустимое значение true. Для запрещения учетных данных опустите этот заголовок.

Access-Control-Allow-Methods

Обеспечивает метод запроса, который сценарий может использовать для будущих запросов (GET или POST, например). Действительные методы определяются в RFC 2616. Это поле может быть указано несколько раз для разрешения многократных методов.

Access-Control-Allow-Headers

Обеспечивает имя поля заголовка, которое у клиента есть разрешение использовать в фактическом запросе.