XMLHttpRequest

Az oldal jelenlegi verzióját még nem ellenőrizték tapasztalt hozzászólók, és jelentősen eltérhet a 2017. szeptember 29-én felülvizsgált verziótól ; az ellenőrzések 14 szerkesztést igényelnek .

Az XMLHttpRequest (XMLHTTP, XHR) egy olyan API , amely a böngésző szkriptnyelvein , például a JavaScript -en érhető el . HTTP vagy HTTPS kéréseket használ közvetlenül a webszerverhez , és a szerver válaszadatait közvetlenül a hívó parancsfájlba tölti be. [1] Az információ bármilyen szöveges formátumban küldhető , például XML , HTML vagy JSON formátumban . Lehetővé teszi HTTP-kérések küldését a szervernek az oldal újratöltése nélkül.

Az XMLHTTP az AJAX (Asynchronous JavaScript And XML ) technológia fontos összetevője, amelyet számos webhely használ dinamikus, érzékeny alkalmazások létrehozására. Például az XMLHTTP-t olyan webhelyek használják, mint a Bing Maps , Gmail , Google Maps , Google Suggest , Facebook .

Az XMLHTTP csak azokkal a fájlokkal működik, amelyek ugyanabban a tartományban vannak, mint az XMLHTTP-t használó oldal, de van megoldás. Akárcsak a JavaScript esetében, ez a korlátozás megkerülésének képessége a biztonságot szem előtt tartva történik ( cross-site scripting ).

Bár a név tartalmazza az XML rövidítést, a technológia nem ír elő korlátozásokat a továbbított adatok formátumára vonatkozóan. Az adatok elküldhetők XML, JSON, HTML vagy egyszerű szöveg formájában. A fejlesztő önállóan létrehozhat egy formátumot az adatátvitelhez. Ne feledje azonban, hogy a küldés során a HTTP szöveges protokollt használják, ezért a GET metódus használatakor az adatokat szöveg formájában kell továbbítani (vagyis a bináris adatokat például base64 -ben kell kódolni ). . A POST módszer használatakor nincs szükség kódolásra.

Történelem

Először a Microsoft fejlesztette ki , amely a Microsoft Exchange Server 2000 szoftvertermék Outlook on the web összetevőjében jelent meg, és az IXMLHTTPRequest nevet kapta. A munkát később beépítették az MSXML 2.0-ba, mint ActiveX -objektumot, amely JScripten , VBScripten vagy más böngésző által támogatott szkriptnyelveken keresztül érhető el . Az MSXML 2.0 bekerült az Internet Explorer 5-be.

A Mozilla projektprogramozói ezután kifejlesztettek egy kompatibilis verziót, az nsIXMLHttpRequest nevet a Mozilla 0.6-ban. A komponens az XMLHttpRequest nevű JavaScript objektumon keresztül érhető el. A teljes funkcionalitást azonban csak a Mozilla 1.0-ban érte el. Az XMLHttpRequest további támogatása megjelent a Safari 1.2 -ben, Opera 8.01-ben és másokban.

A legfrissebb hivatalos specifikáció az 1.0 verzió ( XMLHttpRequest 2012. december 19-én), amely a jelenlegi szabvány státuszával (Living Standard) és a 2.0 verzió ( XMLHttpRequest Level 2 , 2012. január 17. ) rendelkezik, amely működőképes állapotú. változat. A második verzió előrehaladási eseménykezelőket, tartományok közötti lekérdezések támogatását és bináris adatokkal való munkát mutat be. [2]

XMLHttpRequest Class Methods

Módszer Leírás
abortusz () Törli az aktuális kérést, eltávolítja az összes fejlécet, a szerver válaszszövegét nullára állítja.
getAllResponseHeaders() A HTTP-fejlécek teljes listáját adja vissza karakterláncként. A címsorokat kötőjelek választják el (CR+LF).
Ha a hibajelző igaz, üres karakterláncot ad vissza.
Ha az állapot 0 vagy 1, az INVALID_STATE_ERR hibát okoz.
getResponseHeader(fejlécnév) A megadott fejléc értékét adja vissza.
Ha a hibajelző igaz, nullát ad vissza.
Ha a cím nem található, nullát ad vissza.
Ha az állapot 0 vagy 1, az INVALID_STATE_ERR hibát okoz.
nyitott (módszer, URL, aszinkron, felhasználónév, jelszó) Megadja a metódust, az URL-t és az egyéb opcionális lekérdezési paramétereket;
az async paraméter határozza meg, hogy a munka aszinkron módban történik-e.
Az utolsó két paraméter nem kötelező.
küld (tartalom) Kérést küld a szervernek.
setRequestHeader(címke, érték) HTTP-fejlécet ad a kéréshez.
overrideMimeType(mimeType) Lehetővé teszi a dokumentum MIME-típusának megadását, ha a szerver nem vagy helytelenül vitte át.
Figyelem : a módszer nem érhető el az Internet Explorerben!

Az XMLHttpRequest osztály tulajdonságai

Ingatlan Típusú Leírás
kész állapotváltozáskor EventListener Eseménykezelő, amely minden alkalommal aktiválódik, amikor egy objektum állapota megváltozik. A nevet kisbetűvel kell írni.
readyState aláírás nélküli rövid Az objektum aktuális állapota (0 - nincs inicializálva, 1 - nyitott, 2 - adatot küld, 3 - adatot fogad és 4 - adat betöltve)
válaszSzöveg DOMString A megkeresésre adott válasz szövege.
Ha az állapot nem 3 vagy 4, akkor üres karakterláncot ad vissza.
válaszXML dokumentum A kérésre adott válasz szövege XML formátumban, amely ezután a DOM -on keresztül feldolgozható .
Ha az állapot nem 4, nullát ad vissza.
állapot aláírás nélküli rövid HTTP állapot számként ( 404  - "Nem található", 200  - "OK" stb.)
statusText DOMString Állapot karakterláncként ("Nem található", "OK" stb.).
Ha a rendszer nem ismeri fel az állapotot, a felhasználó böngészőjének INVALID_STATE_ERR hibát kell jeleznie.

Az XMLHttpRequest osztály által okozott hibák

Név A kód Leírás
SECURITY_ERR tizennyolc Akkor hívják meg, ha olyan kérést próbálnak benyújtani, amelyet a felhasználó böngészőjének biztonsági beállításai nem engedélyeznek.
NETWORK_ERR 101 Hálózati hiba miatt hívták (szinkron kérés közben).
ABORT_ERR 102 Akkor hívják, amikor a felhasználó megszakítja a kérést (szinkron kérés során).

Használati példa

Az XMLHttpRequest objektummal való munka terve a következőképpen ábrázolható:

  1. XMLHttpRequest objektum példányosítása
  2. Kapcsolat megnyitása
  3. Az eseménykezelő beállítása (megnyitás után és az IE-be való elküldés előtt kell elvégezni)
  4. Kérelem küldése.

XMLHttpRequest objektum példányosítása.

Ebben a szakaszban külön implementációra van szükség a különböző böngészőkhöz. Az objektumok létrehozásának felépítése eltérő: az IE 5 - IE 6-ban ActiveXObject-en keresztül, más böngészőkben (IE 7 és újabb, Mozilla, Opera, Chrome, Netscape és Safari) pedig XMLHttpRequest típusú beépített objektumként valósul meg. .

Az Internet Explorer korábbi verzióinak felhívása így néz ki [3] :

var req = new ActiveXObject ( "Microsoft.XMLHTTP" );

Más böngészőkben:

var req = new XMLHttpRequest ();

Vagyis a böngészők közötti kód biztosításához csak ellenőrizni kell a window.XMLHttpRequest és window.ActiveXObject objektumok meglétét, és attól függően, hogy melyik az, alkalmazni kell.

Univerzális megoldásként a következő funkció használatát javasoljuk:

function createRequestObject () { if ( typeof XMLHttpRequest === 'undefined' ) { XMLHttpRequest = function () { try { return new ActiveXObject ( "Msxml2.XMLHTTP.6.0" ); } catch ( e ) {} try { return new ActiveXObject ( "Msxml2.XMLHTTP.3.0" ); } catch ( e ) {} try { return new ActiveXObject ( "Msxml2.XMLHTTP" ); } catch ( e ) {} try { return new ActiveXObject ( "Microsoft.XMLHTTP" ); } catch ( e ) {} throw new Error ( "Ez a böngésző nem támogatja az XMLHttpRequest-et." ); }; } return new XMLHttpRequest (); }

Eseménykezelő telepítése, kapcsolat megnyitása és kérések küldése

Ezek a hívások így néznek ki:

kér . open ( < "GET" | "POST" | ... > , < url > [, < asyncFlag > [, < user > , < password > ]]); kér . onreadystatechange = processReqChange ;

Ahol:

  • <"GET"|"POST"|…>  — kérési mód . Engedélyezett: DELETE, GET, HEAD, OPTIONS, POST, PUT.
  • Az <url>  a kérés címe.
  • Az <asyncFlag>  egy jelző, amely meghatározza, hogy használjunk-e aszinkron kérést. Az alapértelmezett érték igaz.
  • <felhasználó> , <jelszó>  — bejelentkezési név és jelszó. Szükség esetén megadva.

A kérés összes paraméterének meghatározása után már csak el kell küldeni. Ez a send() metódussal történik. Az ActiveX nélküli verzióra vonatkozó GET kérés küldésekor meg kell adni a null paramétert, más esetekben nem adható meg paraméter. Nem lesz hiba, ha a GET paraméter mindig null:

kér . küld ( null );

Ezt követően a fenti eseménykezelő elkezd dolgozni. Valójában ez a program fő része. A kezelő általában lefogja az összes lehetséges kérésállapotkódot, és lehívja a megfelelő műveleteket, valamint elfogja az esetleges hibákat. Mintakód ezzel a két funkcióval:

varreq ; _ function loadXMLDoc ( url ) { req = null ; if ( ablak . XMLHttpRequest ) { try { req = new XMLHttpRequest (); } catch ( e ){} } else if ( window . ActiveXObject ) { try { req = new ActiveXObject ( 'Msxml2.XMLHTTP' ); } catch ( e ){ try { req = new ActiveXObject ( 'Microsoft.XMLHTTP' ); } fogás ( e ){} } } if ( req ) { req . open ( "GET" , url , true ); kér . onreadystatechange = processReqChange ; kér . küld ( null ); } } function processReqChange () { try { // Fontos! // csak ha az állapot "befejezett" if ( req . readyState == 4 ) { // for status "OK" if ( req . status == 200 ) { // folyamat válasz } else { alert ( "Nem sikerült lekérni az adatokat : \n" + req . statusText ); } } } catch ( e ) { // alert('Hiba: ' + e. leírás); // A Bugzilla Bug 238559 XMLHttpRequestnek módot kell adni a hálózati hibák bejelentésére // https://bugzilla.mozilla.org/show_bug.cgi?id=238559 } }

Ismert problémák

Kis pufferméret videó betöltésekor.

Lásd még

Jegyzetek

  1. ↑ XMLHttpRequest objektum, amelyet a W3C munkatervezet magyaráz . W3.org. Hozzáférés dátuma: 2009. július 14. Az eredetiből archiválva : 2012. február 5..
  2. ↑ Új funkciók az XMLHttpRequest2-ben . Letöltve: 2016. szeptember 30. Az eredetiből archiválva : 2016. augusztus 7..
  3. ↑ Natív XMLHTTPRequest objektum . Letöltve: 2009. december 2. Az eredetiből archiválva : 2010. március 6..

Irodalom

  • Dave Crane, Eric Pascarello, Darren James. AJAX akcióban: Technológia – Aszinkron JavaScript és XML = Ajax akcióban. - M .: "Williams" , 2006. - S. 640. - ISBN 1-932394-61-3 .
  • Dari K., Brinzare B., Cherchez-Toza F., Busika M. AJAX és PHP: Dynamic Web Application Development. - Szentpétervár. : Symbol Plus, 2006. - P. 336. - ISBN 5-93286-077-4 .

Linkek

Történelem

Megvalósítás böngészőkben

Oktatóanyagok

Szabványok