stringtranslate.com

XMLHttpRequest

XMLHttpRequest ( XHR ) — это API в форме объекта JavaScript , методы которого передают HTTP- запросы от веб-браузера к веб-серверу . [1] Методы позволяют браузерному приложению отправлять запросы на сервер после завершения загрузки страницы и получать информацию обратно. [2] XMLHttpRequest — это компонент программирования Ajax . До появления Ajax основными механизмами взаимодействия с сервером были гиперссылки и отправка форм , часто заменяющие текущую страницу другой. [2]

История

Концепция XMLHttpRequest была задумана в 2000 году разработчиками Microsoft Outlook . [3] Затем эта концепция была реализована в браузере Internet Explorer 5 (2001). Однако исходный синтаксис не использовал XMLHttpRequest идентификатор . Вместо этого разработчики использовали идентификаторы ActiveXObject("Msxml2.XMLHTTP")и ActiveXObject("Microsoft.XMLHTTP"). [4] Начиная с Internet Explorer 7 (2006), все браузеры поддерживают XMLHttpRequestидентификатор. [4]

В настоящее время этот XMLHttpRequestидентификатор является фактическим стандартом во всех основных браузерах, включая движок компоновки Mozilla Gecko (2002), [5] Safari 1.2 (2004) и Opera 8.0 (2005). [6]

Стандарты

Консорциум Всемирной паутины (W3C) опубликовал рабочий проект спецификации для объекта XMLHttpRequest 5 апреля 2006 года. [7] [a] 25 февраля 2008 года W3C опубликовал рабочий проект спецификации уровня 2. [8] Уровень 2 добавил методы для отслеживания хода событий, разрешения межсайтовых запросов и обработки потоков байтов. В конце 2011 года спецификация уровня 2 была включена в исходную спецификацию. [9]

В конце 2012 года WHATWG взяла на себя разработку и поддерживает живой документ с использованием Web IDL . [10]

Использование

Обычно отправка запроса с помощью XMLHttpRequest состоит из нескольких этапов программирования. [11]

  1. Создайте объект XMLHttpRequest, вызвав конструктор :
    константный запрос = новый XMLHttpRequest ();    
  2. Вызовите метод «open», чтобы указать тип запроса, определить соответствующий ресурс и выбрать синхронную или асинхронную операцию:
    запрос.open ( 'GET' , '/api/message' , true /* асинхронно * / ) ;   
  3. Для асинхронного запроса установите прослушиватель, который будет уведомлен при изменении состояния запроса:
    запрос .onreadystatechange = прослушиватель ;  
  4. Инициируйте запрос, вызвав метод «send»:
    запрос . отправить ();
  5. Реагировать на изменения состояния в прослушивателе событий. Если сервер отправляет данные ответа, по умолчанию они фиксируются в свойстве "responseText". Когда объект прекращает обработку ответа, он переходит в состояние 4, состояние "done".
    function listener () { // Проверяем, выполнен ли запрос и успешно ли он выполнен. if ( request . readyState == 4 && request . status == 200 ) console . log ( request . responseText ); // Отображаем текст. }             

Помимо этих общих шагов, XMLHttpRequest имеет множество опций для управления тем, как отправляется запрос и как обрабатывается ответ. Пользовательские поля заголовка могут быть добавлены к запросу, чтобы указать, как сервер должен его выполнить, [12] и данные могут быть загружены на сервер, предоставив их в вызове «send». [13] Ответ может быть проанализирован из формата JSON в готовый к использованию объект JavaScript или обработан постепенно по мере его поступления, а не ждать весь текст. [14] Запрос может быть прерван преждевременно [15] или установлен как неудачный, если он не будет завершен в течение указанного времени. [16]

Кросс-доменные запросы

На раннем этапе развития Всемирной паутины было обнаружено, что можно нарушить безопасность пользователей, используя JavaScript для обмена информацией с одного веб-сайта на другой, менее авторитетный. Поэтому все современные браузеры реализуют одну и ту же политику происхождения , которая предотвращает множество таких атак, таких как межсайтовый скриптинг . Данные XMLHttpRequest подпадают под действие этой политики безопасности, но иногда веб-разработчики хотят намеренно обойти ее ограничения. Иногда это происходит из-за законного использования поддоменов, например, создание XMLHttpRequest со страницы, созданной с помощью foo.example.comfor information from, bar.example.comобычно завершается ошибкой.

Существуют различные альтернативы для обхода этой функции безопасности, включая использование JSONP , Cross-Origin Resource Sharing (CORS) или альтернативы с плагинами, такими как Flash или Silverlight (оба сейчас устарели). XMLHttpRequest Cross-origin указан в спецификации W3C XMLHttpRequest уровня 2. [17] Internet Explorer не реализовывал CORS до версии 10. Две предыдущие версии (8 и 9) предлагали схожую функциональность через API XDomainRequest (XDR). CORS теперь поддерживается всеми современными браузерами (настольными и мобильными). [18]

Протокол CORS имеет несколько ограничений с двумя моделями поддержки. Простая модель не позволяет устанавливать пользовательские заголовки запросов и пропускает файлы cookie . Кроме того, поддерживаются только методы запроса HEAD, GET и POST , а POST допускает только следующие типы MIME : "text/plain", "application/x-www-urlencoded" и " multipart/form-data ". Первоначально поддерживался только "text/plain". [19] Другая модель определяет, когда запрашивается одна из непростых функций, и отправляет предварительный запрос [20] на сервер для согласования функции.

Получить альтернативу

Поток программы с использованием асинхронных обратных вызовов XHR может представлять трудности с читаемостью и обслуживанием. ECMAScript 2015 (ES6) добавил конструкцию обещания для упрощения асинхронной логики. С тех пор браузеры реализовали альтернативный fetch()интерфейс для достижения той же функциональности, что и XHR, используя обещания вместо обратных вызовов.

Fetch также стандартизирован WHATWG. [21]

Пример

fetch ( '/api/message' ) . then ( response => { if ( response . status != 200 ) throw new Error ( 'Запрос не выполнен' ); return response . text (); }) . then ( text => { console . log ( text ); });                  

Смотрите также

Ссылки

  1. ^ Махемофф, Майкл (2006). Шаблоны проектирования Ajax . O'Reilly. стр. 92. ISBN 978-0-596-10180-0. В Javascript отсутствует переносимый механизм для общей сетевой коммуникации[.] ... Но благодаря объекту XMLHttpRequest, ... Код Javascript может выполнять HTTP-вызовы обратно на свой исходный сервер[.]
  2. ^ ab Махемофф, Майкл (2006). Шаблоны проектирования Ajax . O'Reilly. стр. 92. ISBN 978-0-596-10180-0.
  3. ^ "Статья об истории XMLHTTP от оригинального разработчика". Alexhopmann.com. 2007-01-31. Архивировано из оригинала 2009-01-30 . Получено 2009-07-14 . Реальность такова, что клиентская архитектура GMail, по-видимому, следует грубому проекту реализации Exchange 2000 Outlook Web Access для IE5 и более поздних версий, которая была выпущена еще в 2000 году.
  4. ^ ab Махемофф, Майкл (2006). Шаблоны проектирования Ajax . O'Reilly. стр. 93. ISBN 978-0-596-10180-0.
  5. ^ "Архив новостей от Mozillazine с указанием даты выпуска Safari 1.2". Weblogs.mozillazine.org. Архивировано из оригинала 2009-06-02 . Получено 2009-07-14 .
  6. ^ "Пресс-релиз с указанием даты выпуска Opera 8.0 с веб-сайта Opera". Opera.com. 2005-04-19 . Получено 2009-07-14 .
  7. ^ "Спецификация объекта XMLHttpRequest из рабочего проекта W3C уровня 1, выпущенного 5 апреля 2006 г.". W3.org . Получено 14 июля 2009 г.
  8. ^ "Спецификация объекта XMLHttpRequest из рабочего проекта W3C уровня 2, выпущенного 25 февраля 2008 г.". W3.org . Получено 14 июля 2009 г.
  9. ^ "XMLHttpRequest Editor's Draft 5 декабря 2011 г.". w3.org . Получено 5 декабря 2011 г. .
  10. ван Кестерен, Энн (19 февраля 2024 г.). XMLHttpRequest Уровень жизни (Отчет) . Проверено 9 апреля 2024 г.
  11. ^ Холденер, Энтони Т. III (2008). Ajax: The Definitive Guide . стр. 70–71, 76.
  12. ^ ван Кестерен 2024, 3.5.2.
  13. ^ ван Кестерен 2024, 3.5.6.
  14. ^ ван Кестерен 2024, 3.6.9.
  15. ^ ван Кестерен 2024, 3.5.7.
  16. ^ ван Кестерен 2024, 3.5.3.
  17. ^ "XMLHttpRequest Level 2" . Получено 2013-11-14 .
  18. ^ "Могу ли я использовать Cross-Origin Resource Sharing?" . Получено 2013-11-14 .
  19. ^ "XDomainRequest - Ограничения, ограничения и обходные пути" . Получено 2013-11-14 .
  20. ^ "7.1.5 Запрос кросс-источника с предварительным сканированием" . Получено 25.04.2014 .
  21. ^ "Выбрать стандарт".

Примечания

  1. Стандарт был отредактирован Энн ван Кестерен из Opera Software и Дином Джексоном из W3C.

Внешние ссылки