Xmlhttprequest делает отправку HTTP -запроса очень простым. Вам просто нужно просто создать экземпляр объекта запроса, открыть URL, а затем отправить запрос. После того, как передача завершена, результирующий статус HTTP и возвращаемое содержимое ответа также можно получить из объекта запроса.
Запросы, сгенерированные Xmlhttprequest, могут быть получены двумя способами, асинхронным режимом или синхронным режимом. Тип запроса определяется значением Async, третьего параметра метода Open () этого объекта xmlhttprequest. Если значение этого параметра является false, запрос xmlhttprequest выполняется в синхронном режиме, в противном случае процесс будет завершен в асинхронном режиме.
Два режима связи: синхронные и асинхронные запросы:
Синхронизировать запросы
Запросы на синхронизацию в основном потоке блокируют страницу, и из -за плохого опыта пользователя, запросы на синхронизацию в основном потоке некоторых последних браузеров были устарели. В редких случаях Xmlhttprequests с использованием синхронного режима будет более подходящим, чем использование асинхронного режима.
1. При использовании xmlhttprequest в работнике синхронные запросы являются более подходящими, чем асинхронные запросы.
Код на домашней странице:
<script type = "text/javascript"> var omyworker = new Worker ("mytask.js"); omyworker.onmessage = function (oevent) {alert ("Работник сказал:" + oevent.data); }; omyworker.postmessage ("hello"); </script> myfile.txt (файл, который синхронизирует запрошенный объект xmlhttprequest): привет мир !!Включает код работника: mytask.js
self.onmessage = function (oevent) {if (oevent.data === "hello") {var oreq = new xmlhttprequest (); oreq.open ("get", "myfile.txt", false); // синхронное запрос oreq.send (null); self.postmessage (oreq.responsetext); }};Примечание. Поскольку работник используется, запрос на самом деле асинхронно.
Аналогичные методы могут быть использованы, чтобы позволить сценариям взаимодействовать с сервером в фоновом режиме и предварительно загружать определенное содержание. Проверьте использование веб -работников для получения более подробной информации
2. ситуация, когда необходимо использовать синхронные запросы
В редких случаях могут использоваться только синхронные режимы xmlhttprequest. Например, в Window.onunload и Window.onbeUnload Обработка событий. Использование асинхронного Xmlhttprequest в функции обработчика событий Unload на странице вызовет проблему: когда ответ возвращается, страница больше не существует, и все переменные и функции обратного вызова были разрушены. Результат может вызвать только ошибку, «функция не определена». Решение состоит в том, чтобы использовать запрос в режиме синхронизации здесь, чтобы страница не была закрыта до завершения запроса.
window.onbeforeunload = function () {var oreq = new xmlhttprequest (); oreq.open ("get", "logout.php? nick =" + Escape (myName), false); // синхронное запрос oreq.send (null); if (oreq.responsetext.trim ()! == "Выход"); {// «Выйти» - это возвратный возврат данных «Выход не удался, вы хотите вручную выполнить выход?»; }};Асинхронная просьба
Если вы используете асинхронный режим, когда данные полностью запрошены, будет выполнена указанная функция обратного вызовов. При выполнении запроса браузер обычно может выполнять другие транзакции.
3. Пример: создайте стандартный метод для чтения внешних файлов
В некоторых требованиях необходимо прочитать несколько внешних файлов. Это стандартная функция. Эта функция использует объект xmlhttprequest для асинхронных запросов. Это также позволяет вам указать другую функцию обратного вызова после завершения каждого чтения файла.
Функция LoadFile (SURL, Timeout, fcallback / *, пройти в параметре 1, пройти в параметре 2 и т. Д. * /) {var apassargs = array.prototype.slice.call (аргументы, 3), oreq = new xmlhttprequest (); oreq.ontimeout = function () {console.log ("Timeout."); } oreq.onreadystateChange = function () {if (oreq.readystate === 4) {if (oreq.status === 200) {fcallback.apply (oreq, apassargs); } else {console.log ("error", oreq.statustext); }}}; oreq.open ("Get", Surl, True); oreq.timeout = timeout; oreq.send (null);}Использование функции загрузочного файла:
функция ShowMessage (smsg) {alert (smsg + this.responsetext);} loadfile ("message.txt", 200, showmessage, "Новое сообщение! // n");Строка 1 определяет функцию. После того, как файл будет считан, функция fcallback будет вызвана со всеми параметрами после третьего параметра в качестве собственных параметров.
Строка 3 использует настройку тайм-аута, чтобы избежать вашего кода от выполнения долгосрочного выполнения возвратных данных запроса чтения. Присвоив значение объекту Xmlhttprequest объекту xmlhttprequest
Шестое поведение onreadystateChange Handlize определяет функцию обратного вызова. Каждый раз, когда функция выполняется, проверяет, заканчивается ли запрос (статус запроса 4). Если это так, определяет, является ли запрос успешным (статус HTTP составляет 200). Если это так, выводит исходный код страницы. Если возникает ошибка, выводит сообщение об ошибке.
Строка 15 указывает, что третий параметр является истинной, указывая, что запрос должен быть выполнен в асинхронном режиме.
4. Пример: используйте асинхронные запросы, закрытия не используются.
Function SwitchXhrstate () {switch (this.ReadyState) {case 0: console.log («Метод open () еще не был вызван.»); Break; случай 1: console.log («Метод send () еще не был вызван.»); Break; Случай 2: Console.log («Метод Send () был вызван, заголовок ответа и статус ответа были возвращены.»); Break; случай 3: console.log ("Загрузить, часть объекта ответа была получена."); Break; случай 4: console.log ("запрос завершен!"); this.callback.apply (this, this.arguments); } / oreq.callback = fcallback; oreq.arguments = array.prototype.slice.call (аргументы, 2); oreq.onreadystateChange = switchXhrstate; oreq.open ("Get", Surl, True); oreq.send (null);}Используйте Bind:
функция SwitchXhrstate (fcallback, aarguments) {switch (this.readystate) {case 0: console.log («Метод open () не был вызван.»); Break; случай 1: console.log («Метод send () не был вызван.»); Break; Случай 2: Console.log («Метод Send () был вызван, заголовок ответа и статус ответа были возвращены.»); Break; случай 3: console.log («Сущность частичного ответа была получена во время загрузки»); Break; случай 4: console.log ("запрос завершен!"); fcallback.apply (это, aarguments); } / oreq.onreadyStateChange = switchXhrstate.bind (oreq, fcallback, array.prototype.slice.call (аргументы, 2)); oreq.open ("Get", Surl, True); oreq.send (null);}Выше всего содержание этой статьи. Я надеюсь, что это будет полезно для каждого обучения, и я надеюсь, что все будут поддерживать Wulin.com больше.