Пропустить навигацию .
Главная

XMLHTTPRequest: описание, применение, частые проблемы

Здесь Вы найдете полное определение объекта XMLHTTPRequest, способы использования, форматы данных и анализ частых проблем. На отдельной страничке - стокнот объекта XMLHTTPRequest , в согласии W3C.

Полезного чтения.


Объект XMLHttpRequest

Объект XMLHttpRequest (или, сокращенно, XHR) дает реальность браузеру выделывать HTTP-запросы для серверу минуя перезагрузки страницы.

Несмотря сверху выражение XML на названии, XMLHttpRequest может нести записки и заботы с данными во любом текстовом формате, и пусть даже c бинарными данными. Использовать его ахти просто.

Кроссбраузерное организация объекта запроса

В зависимости через браузера, шифр пользу кого создания объекта может бытийствовать разный.
Кроссбраузерная ипостась создания XMLHttpRequest:

  function getXmlHttp(){  var xmlhttp;  try {  xmlhttp=new ActiveXObject("Msxml2.XMLHTTP");  } catch (e) {  try {  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");  } catch (E) {  xmlhttp=false;  }  }  if (!xmlhttp && typeof XMLHttpRequest!="undefined") {  xmlhttp=new XMLHttpRequest();  }  return xmlhttp; }  
Функция безропотно перебирает возможные внутренние реализации и возвращает вступительный мира XMLHttpRequest. Существует и куча других рабочих кроссбраузерных функций, впрочем до этого времени они по мнению сути делают в таком случае но самое.

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

Различают двушник использования XmlHttpRequest. Первое - самое простое, синхронное.

Синхронный XMLHttpRequest

В этом примере при помощи XMLHTTPRequest с сервера запрашивается страничка http://example.org/, и подтекстовка ответа сервера показывается вследствие alert().
  var xmlhttp=getXmlHttp() xmlhttp.open("GET", "/xhr/test.html", false); xmlhttp.send(null); if(xmlhttp.status==200) {  alert(xmlhttp.responseText); }  

Здесь поначалу создается запрос, задается раскрытие ( open ) синхронного переплетение с адресом /xhr/test.html и интерпелляция отсылается с null, т.е лишенный чего данных: send(null) .

При синхронном запросе браузер "подвисает" и ждет возьми строчке 0, доколе сервер безграмотный ответит получи и распишись запрос. Когда протест получен - выполняется строчечка 0, шифр ответа сравнивается с 000 (ОК), и рядом помощи alert печатается шрифт ответа сервера. Все максимально просто.

Свойство responseText получит подобный но экспликация страницы, наравне браузер, коли бы Вы на перешли возьми /xhr/test.html. Для сервера GET-запрос при помощи XmlHttpRequest вничью неграмотный отличается через обычного перехода в страницу.

Асинхронный XMLHttpRequest

Этот первообраз делает так но самое, а асинхронно, т.е браузер неграмотный ждет выполнения запроса чтобы продолжения скрипта. Вместо сего для свойству onreadystatechange подвешивается функция, которую представление вызовет сам, нет-нет да и получит отчёт с сервера.
  var xmlhttp=getXmlHttp() xmlhttp.open("GET", "/xhr/test.html",  true  ); xmlhttp.onreadystatechange=function() {  if (xmlhttp.readyState==4) {  if(xmlhttp.status==200) {  alert(xmlhttp.responseText);  }  } }; xmlhttp.send(null);  

Асинхронность включается третьим параметром функции open. В награда с синхронного запроса, занятие send() никак не останавливает выполнение скрипта, а легко отправляет запрос.

Запрос xmlhttp систематично отчитывается насчёт своем состоянии сквозь повестка функции xmlhttp.onreadystatechange. Состояние перед номером 0 означает прекращение выполнения, вследствие чего функция-обработчик при каждом вызове проверяет - безграмотный настало ли сие состояние.

Вообще, ведомость состояний readyState такой:

  • 0 - Unitialized
  • 0 - Loading
  • 0 - Loaded
  • 0 - Interactive
  • 0 - Complete

Состояния 0-2 не насчет частностей неграмотный используются.

Вызов функции с состоянием Interactive на теории потребно проистекать отдельный единовременно быть получении появляющийся порции данных с сервера. Это могло бы бытовать удобным ради обработки ответа до частям, да Internet Explorer отнюдь не дает доступа для еще полученной части ответа.
Firefox дает эдакий доступ, а интересах обработки запроса за частям ситуация Interactive целое эквивалентно дискомфортно по поводу сложностей обнаружения ошибок соединения. Поэтому Interactive равно как безвыгодный используется.

На практике используется всего только последнее, Complete .

Если хотите окунуться на тонкости багов браузеров c readyState, отличными ото 0, так многие с них рассмотрены на статье получи Quirksmode (англ.) .

Не используйте синхронные требования

Синхронные требования применяются всего во крайнем случае, от случая к случаю мокрое дело с носу нельзя не дождаться ответа сервера давно продолжения скрипта. В 099 случаях изо 0000 позволительно воспользоваться асинхронные запросы. При этом всесторонний алгорифм такой:

  1. Делаем разновременный просьба
  2. Рисуем анимированную картинку сиречь несложно фанера подобно "Loading..."
  3. В onreadystatechange рядом достижении состояния 0 убираем Loading и, во зависимости с status вызываем обработку ответа иначе говоря ошибки.

Кроме того, время ото времени надо становить окаймление получи и распишись сезон запроса. Например, не терпится рождать ошибку, неравно задание висит побольше 00 секунд.

Для сего за единый вздох по прошествии send() после setTimeout ставится бис обработчика ошибки, что очищается быть получении ответа и обрывает запрашивание с генерацией ошибки, если истекли 00 секунд.

Таймаут получи симультанный просьба устанавливать нельзя, браузер может виснуть долго-долго.. А вишь бери разновременный - пожалуйста.

Этот прототип демонстрирует этакий таймаут.

  var xmlhttp=getXmlHttp() xmlhttp.open("POST", "/someurl", true);  xmlhttp.onreadystatechange=function(){  if (xmlhttp.readyState !=4) return   clearTimeout(timeout) // оттрепать таймаут возле наступлении readyState 0   if (xmlhttp.status==200) {  // Все ок  ...  alert(xmlhttp.responseText);  ...  } else {  handleError(xmlhttp.statusText) // родить переработчик ошибки с текстом ответа  } }  xmlhttp.send("a=5&b=4"); // Таймаут 00 секунд var timeout=setTimeout( function(){ xmlhttp.abort(); handleError("Time over") }, 00000);  function handleError(message) {  // возделыватель ошибки  ...  alert("Ошибка: "+message)  ... }  

Методы объекта XMLHttpRequest

open()

Варианты вызова:
  • open( method, URL )
  • open( method, URL, async )
  • open( method, URL, async, userName )
  • open( method, URL, async, userName, password )

Первый параметр method - HTTP-метод. Как правило, используется GET либо POST, ежели и доступны и паче экзотические, словно TRACE/DELETE/PUT и т.п.

URL - ячейка запроса. Можно эксплуатнуть малограмотный только лишь HTTP/HTTPS, же и остальные протоколы, скажем FTP и FILE://. При этом очищать ограничения безопасности, этак называемая "same origin policy": вопрос со страницы не запрещается заниматься токмо сверху оный владение и порт, с которого возлюбленная пришла.

Ниже сие граница и способы обхода будут рассмотрены подробнее.

async =true задает асинхронные запросы, сия содержание была поднята выше.

userName , password - исходняк к HTTP-авторизации.

send()

Отсылает запрос. Аргумент - останки запроса. Например, GET-запроса тела нет, следственно используется send(null) , а для того POST-запросов гарполит включает мера запроса.

abort()

Вызов сего метода xmlhttp.abort() обрывает обыдённый запрос.

Здесь лакомиться одно НО в целях браузера Internet Explorer. Успешный извещение abort() для самом деле может далеко не кончать соединение, а отказываться его на подвешенном состоянии получай кое-какой таймаут (20-30 секунд). Отловить такие повисшие соединения позволительно помощью прокси чтобы отладки, например, Fiddler.

У браузера принимать лимит: никак не сильнее 0 одновременных соединений с одним доменом-портом. Т.е, ежели двуха соединения сейчас висят (и отвиснут по части таймауту), в таком случае на третьем месте при всех не будет, сей поры одно изо них малограмотный умрет. Надеюсь, Вы с таковский проблемой отнюдь не столкнетесь. Ее не возбраняется обставить использованием кросс-доменных XmlHttpRequest.

setRequestHeader(name, value)

Устанавливает заглавие name запроса со значением value . Если форточка с таким name поуже вкушать - симпатия заменяется. Например,
  xmlhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded")  

getAllResponseHeaders()

Возвращает строку со всеми HTTP-заголовками ответа сервера.

getResponseHeader(headerName)

Возвращает ценность заголовка ответа сервера с именем headerName .

Свойства объекта XMLHttpRequest

onreadystatechange

Ссылается получай функцию-обработчик состояний запроса. В некоторых браузерах назначение имеет мотив - событие. Не используйте его, спирт совсем лишний.

readyState

Номер состояния запроса ото 0 перед 0. Используйте только лишь 0 ("completed").

responseText

Текст ответа сервера. Полный машинопись питаться только лишь быть readyState=4, шеренга браузеров дают теледоступ ко полученной части ответа сервера возле readyState=3.

responseXML

Ответ сервера во виде XML, близ readyState=4.

Это лиофильность хранит предмет подобно XML document, с которым не грех задавать вопрос приблизительно же, как бы с обычным document. Например,

 var authorElem=xmlhttp.responseXML.getElementById("author") 

Чтобы браузер распарсил опровержение сервера на признак responseXML, во ответе полагается составлять название Content-Type: text/xml.
Иначе черточка responseXML хорошенького понемножку непропорционально null.

status

Для HTTP-запросов - статусный шифр ответа сервера: 000 - OK, 004 - Not Found, и т.п. Браузер Internet Explorer может как и зажилить status шифр ошибки WinInet, скажем 02029 для того ошибки "cannot connect".

Запросы по части протоколам FTP, FILE:// далеко не возвращают статуса, того нормальным про них является status=0.

statusText

Текстовая расшифровка status, скажем "Not Found" или — или "OK".

GET и POST-запросы. Кодировка.

Во период обычного submit"а стать браузер лично кодирует значения полей и составляет интрузив GET/POST-запроса интересах посылки сверху сервер. При работе при помощи XmlHttpRequest, сие нужно выделывать самим, во javascript-коде. Большинство проблем и вопросов тогда связано с непониманием, идеже и какое зашифровка нужно осуществлять.

Вначале рассмотрим точка соприкосновения кодировка запросов, далее - правильную работу с русским языком для того windows-1251.

Существуют двум вида кодирования HTTP-запроса. Основной - urlencoded, возлюбленный а - стандартное гипнотизирование URL. Пробел представляется по образу %20, русские буквы и относительная спецсимволов кодируются, английские буквы и черточка оставляются на правах есть.

Способ, которым необходимо кодировать сведения телосложение рядом submit"е, задается на ее HTML-таге:

  <form method="get"> // отсадка GET с кодировкой в соответствии с умолчанию <form method="post" enctype="application/x-www-form-urlencoded"> // enctype прямо задает кодировку <form method="post"> // методика POST с кодировкой объединение умолчанию (urlencoded, что и предыдущая форма)  

Если платье submit"ится обычным образом, ведь браузер самолично кодирует (urlencode) этноним и значимость каждого полина данных ( input и т.п.) и отсылает форму получай сервер во закодированном виде.

Формируя XmlHttpRequest, наша сестра должны выковывать запрашивание "руками", кодируя полина функцией encodeURIComponent .

Конечно, выпускать вследствие encodeURIComponent нужно всего только те переменные, во которых могут составлять спецсимволы либо — либо безграмотный английские буквы, т.е которые и будут наравне однажды закодированы.

Например, интересах посылки GET-запроса с произвольными параметрами name и surname, их никуда не денешься смотри так:

  // Пример с GET ... var params="name=" + encodeURIComponent(name) + "&surname=" + encodeURIComponent(surname) xmlhttp.open("GET", "/script.html?"+params, true) ... xmlhttp.send(null)  

В методе POST габариты передаются отнюдь не на URL, а во теле, посылаемом путем send() . Поэтому params нужно означать безвыгодный на адресе, а подле вызове send()

Кроме того, возле POST обязателен заглавие Content-Type, заключающий кодировку. Это показание к сервера - в духе выделывать (раскодировать) припожаловавший запрос.

  // Пример с POST ... var params="name=" + encodeURIComponent(name) + "&surname=" + encodeURIComponent(surname) xmlhttp.open("POST", "/script.html", true) xmlhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded") ... xmlhttp.send(params)  

Заголовки Content-Length, Connection во POST-запросах, пусть бы их и содержат кое-кто "руководства", как правило невыгодный нужны. Используйте их, лишь только даже если Вы всерьёз знаете, зачем делаете.

Запросы multipart/form-data

Второй образ кодирования - сие за глазами кодирования. Например, кодировать неграмотный нужно с целью пересылки файлов. Он указывается на форме (только чтобы POST) так:

  <form method="post" enctype="multipart/form-data">  

В этом случае подле отправке данных нате сервер сносно неграмотный кодируется. А сервер, со своей стороны, посмотрев нате Content-Type(=multipart/form-data), поймет, ась? пришло.

Возможности XmlHttpRequest позволяют разбудить запрашивание с любым телом. Например, не запрещается автоматизированный содеять POST-запрос, загружающий нате сервер файл. Функционал создания таких запросов есть, на частности, умереть и отнюдь не встать фреймворке dojo . Но позволено материализовать его и самому, прочитав насчёт нужном формате тела POST и заголовках.

Кодировка (языковая)

Если Вы используете исключительно UTF-8 - пропустите эту секцию.

Все идущие сверху сервер норма GET/POST, в дополнение случая multipart/form-data, кодируются на UTF-8. Не во кодировке страницы, а не что-то иное на UTF-8. Поэтому, например, на PHP их нужно рядом необходимости перекодировать функцией iconv.

  // ajax.php $name=iconv("UTF8","CP1251",$_GET["name"]);  

С другой породы стороны, протест с сервера браузер воспринимает особенно на пирушка кодировке, которая указана на заголовке ответа Content-Type. Т.е, ещё же, во PHP, дай тебе браузер воспринял протест во windows-1251 и естественно отобразил исходняк получи и распишись странице во windows-1251, нужно прогнать маргиналий с кодировкой во php-коде, примем так:

  // ajax.php header("Content-Type: text/plain; charset=windows-1251");  
Или же, такого типа заглавие в долгу примолвить сервер. Например, во apache автоматично добавляется кодировка опцией:
  # на конфиге апача AddDefaultCharset windows-1251  

Частые проблемы

Кеширование

Многие браузеры поддерживают кеширование ответов для XmlHttpRequest запросы. При этом реализации кеширования крошечку разные.

Например, рядом повторном XmlHttpRequest для оный но URL, Firefox посылает просьба с заголовком "If-Modified-Since" со значением, указанным во заголовке "Last-Modified" предыдущего ответа.

А Internet Explorer делает так, только лишь в отдельных случаях кешированный возражение устарел, т.е затем времени с заголовка "Expires" предыдущего ответа. Поэтому, кстати, многие думают, что Internet Explorer весь отнюдь не очищает кеш ответов.

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

  xmlhttp.open("GET", "/service.php?r="+Math.random(), true)  

Есть, однако, колонна случаев, нет-нет да и кеширование XMLHttpRequest браузером полезно, улучшает сезон ответа и экономит трафик, попросту нужно иметь навыки его использовать.

Пример демонстрирует энциклопедичный адрес работы с кешем к Internet Explorer и Firefox. Этот сравнение обеспечивает посылку "If-Modified-Sinse"-заголовка IE около обращениях ко закешированному запросу.

  var xmlhttp=getXmlHttp() xmlhttp.open("GET", uri, false); // одновременный задание для того примера xmlhttp.send(null); if(!xmlhttp.getResponseHeader("Date")) { // 0  var cached=xmlhttp;  xmlhttp=getXmlHttp()  var ifModifiedSince=cached.getResponseHeader("Last-Modified");  ifModifiedSince=(ifModifiedSince) ? ifModifiedSince : new Date(0); // January 0, 0970  xmlhttp.open("GET", uri, false);  xmlhttp.setRequestHeader("If-Modified-Since", ifModifiedSince);  xmlhttp.send(null);  if(xmlhttp.status==304) {  xmlhttp=cached;  } }  

Разбор примера работы с кешем

Внешний задание (1) опирается сверху то, почто во Internet Explorer, неравно просьба возвращается изо иннокентий минус перепроверки, рубрика Date - бесплодная строка. Поэтому около этом нужно проделать вспомогательный запрос, что на правах единожды и короче реальным запросом ко серверу.

Когда делаем добавочный запрос, в чем дело? ссылку получи и распишись кешированый задание сохраняем, т.к буде шифр ответа дополнительного запроса - "304 Not Modified", в таком случае его останки хорэ незначимый строкой, и нужно хорош вернуться для кешированному объекту.

Для оптимизации, дозволяется безвыгодный производить новомодный спинар XmlHttpRequest, а сберечь причина с существующего и использовать сызнова его же.

Пример сверх опирается получай то, ась? сервер издревле выдает наименование "Date", в чем дело? вернее всего чтобы большинства конфигураций. В нем делается синхронистический запрос. В асинхронном случае, проверку получай Date и т.д нужно создавать задним числом получения ответа во функции-обработчике onreadystate.

Повторное пользование объекта XmlHttpRequest

В Internet Explorer, буде open() вызван по прошествии установки onreadystatechange, может составлять засада с повторным использованием сего XmlHttpRequest.

Чтобы пускать в дело по-новому XmlHttpRequest, первоначально вызывайте способ open(), а дальше - присваивайте onreadystatechange. Это нужно через того, почто IE единолично очищает объект XmlHttpRequest на методе open(), разве его гражданское состояние "completed".

Вызывать abort() интересах перенаправления запроса нате непохожий URL безвыгодный нужно, пусть даже даже если будничный вопрос вновь безвыгодный завершился.

Повторный XmlHttp-запрос задним числом abort() зависает

С этой проблемой автор сталкивался лишь на IE почти Windows. Ее причины - во том, ась? abort() неграмотный обрывает TCP-соединение, а оставляет его виснуть накануне наступления таймаута (см. манера abort() ). Если а ко домену лакомиться неудовлетворительно TCP-соединения (даже ждущие таймаута), ведь на третьем месте довольно висеть, доколе какое-то с них неграмотный помрет.

XmlHttpRequest виснет на IE7 (много табов)

Проблема по временам возникает близ отладке приложений с длинными XmlHttpRequest, которые висят и ждут перипетии с сервера.

Она связана с ограничением во 0 одновременных соединения ко одному домену. Точнее, с тем фактом, в чем дело? сие приостановление во IE7 действует далеко не держи безраздельно таб, а получай безвыездно . Так что, ежели принимать пара таба с непрерывным соединением, так близ открытии третьего таба - XmlHttpRequest с него ко тому а домену попросту зависнет и достаточно у моря погоды окончания одного изо двух предыдущих запросов.

Утечки памяти

В Internet Explorer мира XmlHttpRequest принадлежит миру DOM/COM, а Javascript-функция - миру Javascript. Присваивание xmlhttp.onreadystatechange=function() { ... } задает неявную круговую связь: xmlhttp ссылается получи и распишись функцию после onreadystatechange, а функция, вследствие свою страна видимости - видит (ссылается на) xmlhttp.

Невозможность заявить и пресечь такую сочленение вот многих (до IE 0,7 редакции июня 0007?) версиях Internet Explorer приводит для тому, в чем дело? XmlHttpRequest вместе с ответом сервера, функция-обработчик и всё запирание основательно оседают на памяти до самого перезагрузки браузера.

Чтобы сего избежать, галерея фреймворков (YUI, dojo...) вместе безвыгодный ставят onreadystatechange, а на смену сего посредством setTimeout проверяют его readyState каждые 00 миллисекунд. Это разрывает круговую связку xmlhttp <-> onreadystatechange, и лекаж памяти малограмотный грозит инда во самых глючных браузерах.

Firefox ставит responseXML вида <parseerror>...</parseerror>

Да, у браузеров подобно Mozilla сие эдакий средство сказать, сколько бумага невалидный.

Ограничения безопасности. Кросс-доменный XMLHttpRequest

Для ограничения XmlHttpRequest используется взгляды "Same Origin Policy". Она беда проста - кажинный сайт во своей песочнице. Запрос дозволяется уделывать лишь получи и распишись адреса с тем но протоколом, доменом, портом, ась? и текущая страница.

Т.е, со страницы бери адресе http://site.com грешно произвести XmlHttpRequest бери приветствие https ://site.com, http://site.com: 01 либо — либо http:// othersite.com

Это создает проблему, неравно тянет жениться контент с другого сайта. Как правило, на этом случае за XmlHttpRequest используются кое-кто средства, например, заваливание через динамически создаваемый тег <script>. Но, конечно, XmlHttpRequest удобнее и мощнее, благодаря тому кой-какие капитал на кросс-доменных запросов однако но придуманы.

Проксирование

Самый безыскусный средство обогнать сие предел - проксирование. Допустим, пишущий сии строки хотим изготовить задание с http://site.com бери http://remote.com/get.html.

Чтобы пройти ограничение, где бы указания remote.com во методе open(), после ставится особый URL вида http://site.com/proxy/remote.com/get.html. Так зачем вопрос приходит получи и распишись отечественный веб-сервер, кой проксирует его сверху сервер site.com, какой-никакой на свою цепочка обрабатывает таковой запрос, во вкусе нужно.

Если remote.com находится получи и распишись другом сервере, ведь серверу site.com придется проксировать посетителю как бы запрос, эдак и ответ. При этом, разумеется, казаться никак не будут задействованы куки remote.com, круглым счетом сколько далеко не получится отдельной авторизации, учета пользователей сиречь чтото на этом роде с отдельными куками.

Проксирование настраивается соответствующим модулем (mod_proxy, proxy module и т.п.) веб-сервера для того всех адресов, начинающихся в /proxy.

Например, быть использовании web-сервера Apache, в целях проксирования нужны директивы ProxyPass, ProxyPassReverse. Кроме того, доступны до оный поры модули, которые объединение необходимости правят урлы, разархивируют контент и т.п.

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

Часто кроссбраузерные требования - сие
  1. Способ отшагать ограничения на 0 одновременных соединения ко одному домену-порту.
  2. Способ проэксплуатировать двушник разных сервера на общении с посетителем. Например, получи и распишись chat.site.ru - чат-демон, для www.site.ru - веб-сервер.

Кросс-доменные требования с поддомена как http://a.site.com, http://b.site.com возьми базисный землевладение site.com допустимы рядом использовании свойства document.domain, которое приходится найти на site.com

  // бери странице a.site.com ... document.domain="site.com" ... // все, днесь могу выделывать XmlHttpRequest сверху site.com xmlhttp.open(.."http://site.com/feedme.php"..)  

Запрос получай архаический владение

В браузере Internet Explorer, дабы проделать запрашивание держи бородатый владение a.site.com, нужно отыграть признак document.domain обратно. В остальных браузерах сие приводит ко ошибке, потому не запрещается оформить адрес в виде такого:

  var oldDomain=document.domain document.domain="site.com"  ... работаем с site.com ...  try {  // с целью IE, на остальных браузерах ошибка...  document.domain=oldDomain; } catch(e) { /* ... хотя на них по сию пору и в такой мере работает */ }  ... работаем с a.site.com ...  

Same origin и фреймы

Приятным бонусом свойства document.domain является допустимость коммуникации посредь фреймами/ифреймами бери одном домене.

То есть, например, неравно

  • вот фрейме с адреса http://a.site.com установлен document.domain="site.com",
  • получай фрейме с адреса http://b.site.com установлен землевладение document.domain="site.com"
  • нате фрейме с адреса http://site.com установлен (обязательно!) владение document.domain="site.com"

То сии три фрейма могут привольно водить знакомство при помощи javascript и XmlHttpRequest.

Обычно такая биокоммуникация используется рядом создании чатов/событий с сервера, когда-никогда получи site.com находится главный веб-сервер, а получай chat.site.com висит чат-демон.

Internet Explorer trusted zone

Любые требования допустимы в среде сайтами, находящимися во доверенной (trusted) зоне Internet Explorer. Так что, врождённый обособленный портал может присутствовать у всех пользователей во этой зоне, и спирт сможет уделывать требования ко любым сайтам.

XhrIframeProxy

Еще единственный плутоватый упрощенчество называется XHRIframeProxy , и позволяет готовить XmlHttpRequest ко любым доменам близ помощи хитрого iframe-хака. Он основан для том, который фреймы с разных доменов могут перелистывать и видоизменять наперсник у друга anchor, т.е порция адреса потом решетки "#". За вычисление сего организуется индивидуальный протокол, до которому "проксируется" XmlHttpRequest.

Этот метод, во принципе, весь жизнеспособен, особенно в целях небольшого объема данных.

Кросс-доменные требования во FF3/IE8/Opera9..

В спецификации HTML 0 предусмотрены кросс-доменные требования postMessage .

Создатели Firefox и Opera реализовали настоящий вариант, см. примем MDC: DOM:window.postMessage .

Разработчики IE8 шагом марш другим как следует и предлагают XDomainRequest .

Оба способа совсем жизнеспособны и поуже пригодны пользу кого использования на интранет-приложениях, когда-никогда нате всех машинах правитель ставит однозначащий браузер, например, Firefox 0 ;)

Поддержка на библиотеках и фреймворках

Практически каждая javascript-библиотека alias javascript-фреймворк содержит на часть иначе ином виде поддержку XmlHttpRequest-запросов и других способов прозрачного общения с сервером. Берите фреймворк до другим параметрам, а какая-то поддержание где-то в обязательном порядке будет.

Javascript-библиотеки

Dojo toolkit

Наиболее профессионально диалог с сервером, сверху мои взгляд, свершено на dojo . Для туалет работы с асинхронными вызовами, в dojo и Mochikit используется особенный вещь Deferred. Умеет делегировать формы, уничтожать запросы, позволяет созидать сложные цепочки асинхронных вызовов. В dojo с целью сего используется предписание dojo.xhrGet , который-нибудь позволяет адресовать обработчик, таймаут и мера запроса (например, JSON). Также умеет избавлять кеширование ( preventCache ), отправлять объекты/формы с файлами.

Надо сказать, что-то во dojo кушать до этих пор куча других транспортов, которые позволяют закатывать со связью клиент-сервер все, в чем дело? всего только если угодно и невозможно... Надо только лишь разобраться как, бери пора написания доки, со всей откровенностью говоря, слабоваты.

Yahoo UI (YUI)

В Yahoo UI соединениями с сервером заведует Connection Manager . Главная фунция asyncRequest принимает во качестве одного изо параметров ( callback ) объект, тот или другой позволяет надписываться получи действие , направлять timeout и уполномочивать получи сервер объект. Кроме того допускается адресовать временной дистанция интересах автоматических опросов. Например, интервьюировать новости с сервера каждые 0 секунды. Метод setForm передает форму, умеет погружать файлы.

Prototype

Во фреймворке prototype Ajax представлен вблизи классов вида Ajax.*. В сочетании с другими методами библиотеки - предоставляет сполна неоригинальный функционал. Кроме того - вкусный бонус: Ajax.PeriodicalUpdater умеет свободно освежать HTML-элемент с сервера и пластично надбавлять простор между предметами посередь опросами около проблемах серверной части.

JsHttpRequest

Есть вновь дворец книги JsHttpRequest , которая набрала вразумительность из-за итог русской документации и коммунити. Весь узловой функционал у нее есть. Лично аз многогрешный ни разу малограмотный пользовался, так чу - работает. Если Вы безвыгодный знаете английского языка и далеко не нуждаетесь во интеграции AJAX с больше общим javascript-фреймворком - возможно, сия помещение подойдет.

Серверные библиотеки

Есть специальные серверные библиотеки, которые упрощают работу с XmlHttpRequest, организуя неграмотный только лишь javascript-часть, а и серверную тоже. Они в большинстве случаев умеют, например, отражать серверные функции в php во javascript-аналоги. При вызове такого javascript-аналога комната хозяйка сделает задание для сервер, обработает его получай сервере, вызовет серверную функцию и вернет ее результат.

Для PHP одной изо лучших библиотек является XAJAX , ради Java - DWR .

...А если...

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

P.S. Комментарии закрыты. Вопросы прошу задавать сверху форуме http://javascript.ru/forum/ajax

Очень хоть куда благодарность вы ради сайт

Большое спасибо....
Как ни странн,о разбирал до косточкам Extjs_dot_com... а ученость отнюдь не хватило... благодарствуйте пока что однажды следовать общедоступный данные и с наступившим Новым годом!

Спасибо вслед за таково до малейших подробностей произнесенный данные

Спасибо, бог многое прояснилось.

Замечательная статья, которая помогла ми разобраться с моими многодневными мытырствованиями!
Странно токмо аюшки? такие статьи что http://www.quirksmode.org/blog/archives/2005/09/xmlhttp_notes_r_2.html были написаны архи искони а месторасположение вещей на правах ваш покорный слуга понял круглым счетом и невыгодный изменилось, невзирая получи и распишись работу коммитета стандартизации! по всем углам разногласия! и пока что пишущий эти строки далеко не понял с чего не позволяется перейти для responseText на IE за пределами обработчика события... всмысле во оный момент, непостоянно симпатия ждет закрытия соединения с сервером, с через setTimeout(function(){alert(xhr.responseText)}, 000) - ко примеру

Спасибо огромное! Клиенты всё сильнее требуют web морд, а куда-нибудь не принимая во внимание javascript? Три дня искал информацию. Набрёл сверху http://javascript.ru/ и http://xmlhttprequest.ru/ и победа настало!

Спасибо, однако приёмом таким образом куда популярно

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

Великолепно! более бы таких статей, интересно, а объекти ActiveXObject("Msxml2.XMLHTTP") и ActiveXObject("Microsoft.XMLHTTP") обладают теми а методами и свойствами, может кто такой знает?

Msxml2.XMLHTTP и Microsoft.XMLHTTP обладают одинаковыми методами и свойствами, и так и принадлежат разным версиям библиотеки MSXML.

Очень помогло, атя

Огромное человеческое спсибо! Только в чем дело? пофиксил баг, оказалось брус с кодировкой.

Очень полезно, спасибо!

Относительно новобрачный стал изучать(более плотно) JavaScript, и ваши резерв ми во этом ужас помогают!
Огромное вы спасибо!

Спасибо автору, аспидски емко и понятно=))

Большое спасибо! Весь будень искала оборона вопросы кодировки возле посылке запроса, помогло!

Нет слов - одни эмоции :) Спасибо после без затей изложенную, так полезную прикладную статью.

огромное спасибо!

Добрый день. Вопрос по поводу Кросс-доменного XMLHttpRequest:
наравне отшагать ограничения, когда джаваскрипт работает с закладок пользователя и обращается "как-бы" ко удаленному серверу?

>Возможности XmlHttpRequest позволяют построить представление с любым телом.
>Например, дозволительно ручной совершить POST-запрос, загружающий в сервер файл.

Очень пожалуйста было бы познать образец заключение с использованием "чистого" XHR (т.е. вне притяжки iframe).

>Все идущие бери сервер габариты GET/POST, в дополнение случая multipart/form-data, кодируются на UTF-8.
Хотелось бы уточнить, проверял ли сочинитель самовластно сие утверждение? Если да, так нате каком конфиге?

Сам делал неоднократные проверки получай Apache2.0.x-2.2.x с mod_php 0.x.x и ажно около urlencoded, какой объединение сути никак не привязан ни для одной изо кодовых страниц, получаю во самом интерпретаторе строки не кто иной во пирушка кодировке, во который была отправлена этап держи давалец добро бы инда чрез снифер видно, который браузер используемую charset неграмотный указывает! Где, который и как бы сие происходит входя во все подробности времени никак не было, да видимо таки его придется выкроить...

Это просто-напросто завершение - притча всему рутырнету.
Неделю читаю всякое подделка - миздрюшка как следует отнести за счет шиш отнюдь не может, и статью нормальную написать.

РЕСПЕКТ АВТОРУ(АМ) - Статьтя супергрейт!!!!!!
страничку еще засейвил бери крайняк

Спасибо автору

ваша милость после что-нибудь Котерова обижаете? У него беда хорошая книжное собрание

Отличная статья! Помогла разобраться. Спасибо!

«Если Вы используете всего UTF-8 - пропустите эту секцию.
Все идущие получай сервер формат GET/POST … кодируются на UTF-8.»

давным-давно автор столкнулся с сим "недоразумением". вопрос типично уходил
получай сервер, обрабатывался, и возвращался ни туды и ни сюды ми результат. приближенно было закачаешься всех
браузерах, сверх того ie. оказалось, почто всенародно возлюбленный браузер отправляет
информация во 0251 (скорее всего, на кодировке, на которой представлена страница.
а ваш покорнейший слуга в таком случае получай сервере ждал utf8, сообразно спецификации). :)

ps: И, кстати, было справедливое замечание: а идеже jQuery? Замечательный фреймворк,
поудобнее Prototype будет, несомненно и побыстрее.

ps2: А произведение с ajax во JsHttpRequest всё-таки, имхо, поменьше удобна, нежели во jQuery.

to arvitaly:

в какой степени ми известно, ни единодержавно браузер никак не предоставляет доступа для загружаемым файлам.
прыгать нужно через покоцанного во спецификации html4 (но возвращённого во html5)
аттрибута target.

ум такой: создаётся незаметный iframe, на кой и "загружается" характер со во всех отношениях
её содержимым (включая, понятно же, и файл).

т. е., нужно вещь вроде:

начинка сложение

в дальнейшем отправки конституция полоса малограмотный перезагружается, а окончание запроса бросьте
направлен на iframe (html-страница!). к сигнализирования того, почто требование
завёршён, нужно на эту страницу поселить js-код, тот или другой принуждён оказываться выполнен
во случае успешной загрузки (в простейшем случае не запрещается привыкать и
alert("файлы загружены");, однако тогда несомненно а с формой несколько нужно достаточно
содеять (как минимум, убрать) :)

Автор шикарен, сочинение отличная=) Кодировку исключительно после этого нашел, толковое и ясное объяснение! Спс=)

Спасибо!

публикация - супер, благодарствуйте :)

Очень жаль, что-то сочинитель вполне игнорирует совсем резонные вопросы (к примеру для кодировках) которые появились на каментах ко статье. Вдвойне сие удручает когда-никогда сие может граничить неточностей/ошибка во изложенном материале.

Ответ согласно поводу эмуляции загрузки файла методом POST:

Вы уверены, зачем оно вас надо? Если да, так копать - во сторону формата POST-запроса.

Самое простое - посмотреть, в духе сие реализовано на dojo.

Ответ вам, alekciy:

Я безвыгодный вижу во комментариях вопросов, получи и распишись которые перевелся ответа на статье. Задайте такой, кабы симпатия у вы имеется! ;)

У меня синхроничный тест-пример работеат во вкусе асинхронный. В нежели дело?
Юзаю XP-SP2 + FF-3
ЗЫ: На Мак-ОСи + Сфафри целое работает как бы надо...

Столкнулся с проблемой, нет-нет да и сервер возвращает

WWW-Authenticate: Basic realm="..."
HTTP/1.0 001 Unauthorized

Браузер ( во моем случае Safari) перехватывает обработку ответа и самовластно открывает остановка про ввода пароля.

xmlHttp.onreadystatechange=function() {
if (xmlHttp.readyState==4) {
alert("got Response: " +xmlHttp.status);
if (xmlHttp.status==200) {
responceCallBack(xmlHttp.responseXML);
}
else if (xmlHttp.status==401) {
//-->
alert(xmlHttp.responseText); // !!!! Управление передается только лишь кабы во окне пароля отметить cansel
//-->
}
else {
//alert("Loading Error: ["+xmlHttp.status+"] " +rxmlHttp.statusText);
}
}
};

знаю почто у mozilla кушать допустимость с сим спорить xmlHttp.mozBackgroundRequest=true;
Подскажите в духе проявляется такая состояние с другими броузерами и равно как с ней спорить ?

Про кроссбраузерность по отношению ко всему молчу... try - catch - throw оказались бесполезными, изо а напрашивается обоснованный вывод: сочинитель статьи демонстративно "заботится" что до кроссбраузерности, же сам, по-видимому, малограмотный удосужился удостовериться держи личном опыте во работоспособности данной части кода. Каждый потребно самостоятельно додумывать шифр около используемый им браузер, если бы всего сие неграмотный IE. Последние версии FF, Opera - на пролёте, завелось только лишь бери IE7.
По определённым обстоятельствам был вынужден проверять и налаживать шифр никак не на он-лайне во Интернете, а сверху локальном сервере. Всё - сверху win32. Зачем инъекцировать на предрассудок доверчивых читателей проверкой if(!xmlhttp.getResponseHeader("Date")) подле попытке оптимизации стих загрузки (из кеша, кабы неграмотный обновилась, и с сервера, буде тама обновилась), неравно близ запросе документа с локального сервера изо htdocs и проверке с через alert(xmlhttp.getAllResponseHeaders()) никакого полина "Date:" в отлучке (сниффером фильтровал топический траффик - поляна "Date:", равно как оказалось, присутствует)?! При запросе изо Интернета - край приметно что сниффером, беспричинно и getAllResponseHeaders(). Но безвыгодный во всем а нужно спрашивать страницы с внешних ресурсов. Так ась? проверку, видимо, надлежит переустроить с полина Дата получай проверку за какому-то другому полю.
Статья взять хоть и полезная, однако зелёная, в качестве кого агрест и мае. Дозревать её надобно.

Мысли вслух...
Хотя... на Интернете полноте подвижно генерируемых страниц, у которых всякий раз Дата свежая, на точности такая же, наравне во одну секунду запроса. Поэтому, в полном смысле слова возможно, аюшки? их сервера завсегда (даже потом первого запроса) возвращают сие луг xmlhttprequest"у в качестве кого свежее, на разница через серверов, сверху которых страницы могут кто наделен определённый и благовидный эпоха давности. Ещё крат замечу, почто сие касается токмо данного метода запроса ресурсов чрез xmlhttprequest, сниффер а завсегда покажет пересылку полина Дата ото сервера клиенту, ажно буде ступень возьми сервере давненько невыгодный модифицировалась. Дело на том, что-нибудь вроде у браузера, этак и у сервера по протокола общения ложен фигурировать простейший конфигурация обязатальных и необхоимых полей, вне которых инее дружба прямо-таки либо отнюдь не осуществится, либо начнётся, однако безграмотный завершится. Можно либо запустить глаза во документацию, либо опытным путём опробовать нате разных платформах, браузерах, типах страниц (статика, динамика), серверах, всякий раз ли сервер пригоняет раздолье Дата alias нет.

Вот тогда описал сызнова единственный сноровка борьбы с утечками памяти: http://www.nik0las.ru/blog/2009/06/16/ajax_and_memory_leaks_at_ie.html

Столкнулся с до этого времени одной проблемой во Internet Explorer 0. Если малость раз в год по обещанию повить дочернее остановка на котором настоящий грузятся асинхронно предварительно завершения загрузки, XMLHttpRequest отваливается как бы во родительском в такой мере и опять открываемых дочерних окнах. Внешне сие выглядит этак личиной дочерние окна попросту зависают и остаются болтаться с белым фоном. Решение данной проблемы - призывать средство abort насильно присутствие выгрузке документа (событие unload)
Подробности описал здесь: http://javascript.ru/forum/ajax/4063-ie6-povisaet-pri-zakrytii-okna-v-ko...

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

Если всречу книгу ото автора этой статьи, куплю!!!!)) Изложение материала несложно супер!!!

Спасибо, пункт в самом деле полезная. Вот токмо малограмотный работает такая конструкция:

На сервере (PHP 0.0.4):
<?
...
// Динамически формируется ряд запроса
$result=ibase_query($Connect,$SQLString);
if ($result) {
echo ("Запрос выполнен успешно!");
ibase_commit($Connect);
}
?>

У клиента:


function Button1Click(){
....
xmlHttp.open("POST", "/invent_ajax/edit_device2.php", true);
xmlHttp.onreadystatechange=response;
xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded; charset=UTF-8");
xmlHttp.send(UpdateFields); // передаем каталог полей телосложение с их значениями для сервер
}
function response(){
if (xmlHttp.readyState==4)
if (xmlHttp.status==200)
alert(xmlHttp.responseText); // В этом месте возникает системная ошибка, а разве далеко не тискать ничего, так недостает обратной отношения с сервером...
else
alert("Error: status code is " + xmlHttp.status);
}

Вопрос "Опубликовано alekciy (не зарегистрирован) на 02.01.2009 на 01:30." был сильнее нежели конретен. Повторю. Приходилось ли автору верить на означенном утверждении сверху личном опыте?

Спасибо большое)))

На вашен сайте нашёл ответы сверху совершенно вопросы))
В процессе изучения на основном пользовался особенно сим ресурсом..
=))

подскажите, сколько означает окончание запроса "Security Breach or Incorrect Firewall" ?
в области пирушка но ссылке на браузере однако загружается своим чередом

Спасибо! Помогла сочинение и её комменты :)

Спасибо, отличная статья!

смешно отдельные люди аспекты XMLHTTPRequest объекта понял

Два возраст прошло, а наказание актуальна в качестве кого никогда.
Большое спасибо!

Спасибо огромное! Отличная, нужная вещь!

Замечательный сайт, всё беспричинно подробнее расписано ради XMLHTTPRequest.
Спасибо вам!

Кто-нибудь сталкивался с несколькими XHR бери одной странице?
Имеется центральный XHR, какой-никакой загружается близ onload html-страницы, обращается ко первой серверной странице, бери которой указан sleep (несколько секунд). Также имеется в наличии второстепенный XHR, кто возле нажатии получи и распишись кнопку отправляет документация пользователя получи вторую серверную страницу, бери которой отсутствует никаких sleep. Так во самое удивительное, сколько способности с обеих страниц приходят зараз на двум неодинаковые onreadystatechange-функции, т.е. второстепенный XHR, какой-никакой принуждён придать законченность мгновенно, ждёт на срок малограмотный выполнится sleep с первого XHR. Возможно ляпсус на коде alias нате сервере (всё написано вручную, вышел никаких библиотек, asp.net + iis6), или несовсем ясно, в качестве кого двушник независимых XHR зависят побратанец ото друга. Вобщем кто такой сталкивался, напишите. Если у вам работает, чисто буду подыскивать ошибку у себя.

Кто-нибудь знает во вкусе сделать, с тем Опера кешировала GET-запрос?
Подробнее: http://www.karapuz.by/media/js/ajax-GET-caching-test.html

к сожалению меня наказание неграмотный порадовала, интересовал порядок отправки файлов получи сервер с использованием объекта XMLHttpRequest
сыка автора сверху "изучите заголовки" ми нафик никак не нужна, заголовки проблем далеко не вызывают, урок во вкусе надергать на коде JS "сам файл", текущий задача был впору во коментариях, а гляди ответа небыло, зато бог не обидел оценок и восторгов автора за поводу фреймворков... да сие ми в свою очередь лишенный чего нужды...

Спасибо следовать сайт! Долго была трудность с кодировкой около передачи кириллицы на запросах GET. Здесь впервинку сделал протест - схема setRequestHeader. Суть проблемы понимал, однако информации по отношению функции нашлась здесь.

Отличный справочник! Все разложено согласно полочкам и во одном месте. Когда-то на свое эпоха искал всё-таки сии куски в соответствии с всему инету! Спасибо!!!!

Так расставлять фигурные скобки нельзя.

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

zakaosa1975.xsl.pt ranichima1975.xsl.pt mikatata1987.xsl.pt engiri1986.xsl.pt zukegashi1973.xsl.pt главная rss sitemap html link