XMLHttpRequest

Den aktuelle version af siden er endnu ikke blevet gennemgået af erfarne bidragydere og kan afvige væsentligt fra den version , der blev gennemgået den 29. september 2017; checks kræver 14 redigeringer .

XMLHttpRequest (XMLHTTP, XHR) er en API tilgængelig i browser -scriptsprog såsom JavaScript . Bruger HTTP- eller HTTPS -anmodninger direkte til webserveren og indlæser serverens svardata direkte i det kaldende script. [1] Information kan sendes i ethvert tekstformat , såsom XML , HTML eller JSON . Giver dig mulighed for at sende HTTP-anmodninger til serveren uden at genindlæse siden.

XMLHTTP er en vigtig komponent i AJAX (Asynchronous JavaScript And XML ) teknologien, der bruges af mange websteder til at skabe dynamiske, responsive applikationer. For eksempel bruges XMLHTTP af websteder som Bing Maps , Gmail , Google Maps , Google Suggest , Facebook .

XMLHTTP virker kun med filer, der er på samme domæne som siden, der bruger XMLHTTP, men der er en løsning. Som i tilfældet med JavaScript, er denne mulighed for at omgå begrænsningen lavet med sikkerhed i tankerne ( cross-site scripting ).

Selvom navnet indeholder forkortelsen XML, pålægger teknologien ikke begrænsninger for formatet af de transmitterede data. Data kan sendes som XML, JSON, HTML eller blot almindelig tekst. Udvikleren kan selvstændigt oprette et format til dataoverførsel. Vær dog opmærksom på, at HTTP-tekstprotokollen bruges ved afsendelse, og derfor skal data, når du bruger GET-metoden, transmitteres i form af tekst (det vil sige, at binære data skal kodes f.eks. i base64 ) . Ved brug af POST-metoden er ingen kodning nødvendig.

Historie

Det blev først udviklet af Microsoft , og dukkede op i Outlook på webkomponenten af ​​softwareproduktet Microsoft Exchange Server 2000. Det fik navnet IXMLHTTPRequest. Værket blev senere indarbejdet i MSXML 2.0 som et ActiveX -objekt tilgængeligt via JScript , VBScript eller andre browser-understøttede scriptsprog. MSXML 2.0 var inkluderet i Internet Explorer 5.

Mozilla - projektprogrammører udviklede derefter en kompatibel version kaldet nsIXMLHttpRequest i Mozilla 0.6. Bønnen blev tilgået via et JavaScript-objekt kaldet XMLHttpRequest. Fuld funktionalitet blev dog kun opnået i Mozilla 1.0. Yderligere understøttelse af XMLHttpRequest dukkede op i Safari 1.2 , Opera 8.01 og andre.

Den seneste officielle specifikation er version 1.0 ( XMLHttpRequest dateret 19. december 2012), som har status som den nuværende standard (Living Standard) og version 2.0 ( XMLHttpRequest Level 2 , dateret 17. januar 2012), som har status som en fungerende version. Den anden version introducerer progress-hændelseshandlere, understøttelse af forespørgsler på tværs af domæner og arbejde med binære data. [2]

XMLHttpRequest Class Methods

Metode Beskrivelse
abort() Annullerer den aktuelle anmodning, fjerner alle overskrifter, indstiller serversvarsteksten til null.
getAllResponseHeaders() Returnerer den komplette liste over HTTP-headere som en streng. Overskrifter er adskilt af bindestreger (CR+LF).
Hvis fejlflaget er sandt, returneres en tom streng.
Hvis status er 0 eller 1, forårsager det en INVALID_STATE_ERR-fejl.
getResponseHeader(headerName) Returnerer værdien af ​​den angivne overskrift.
Hvis fejlflaget er sandt, returneres null.
Hvis titlen ikke findes, returneres null.
Hvis status er 0 eller 1, forårsager det en INVALID_STATE_ERR-fejl.
åben (metode, URL, async, brugernavn, adgangskode) Angiver metoden, URL'en og andre valgfri forespørgselsparametre;
async-parameteren bestemmer, om arbejdet udføres i asynkron tilstand.
De sidste to parametre er valgfrie.
send (indhold) Sender en anmodning til serveren.
setRequestHeader(etiket, værdi) Tilføjer en HTTP-header til anmodningen.
overrideMimeType(mimeType) Giver dig mulighed for at angive dokumentets mime-type, hvis serveren ikke har overført det eller overført det forkert.
OBS : metoden er ikke tilgængelig i Internet Explorer!

Egenskaber for XMLHttpRequest-klassen

Ejendom Type Beskrivelse
klar til at skifte EventListener En hændelseshandler, der udløses hver gang et objekts tilstand ændres. Navnet skal skrives med små bogstaver.
klarState usigneret kort Objektets aktuelle tilstand (0 - ikke initialiseret, 1 - åben, 2 - sender data, 3 - modtager data og 4 - data er indlæst)
svarTekst DOMString Teksten til svaret på anmodningen.
Hvis tilstanden ikke er 3 eller 4, returneres en tom streng.
responsXML dokument Teksten i svaret på anmodningen i form af XML, som derefter kan behandles gennem DOM .
Hvis tilstanden ikke er 4, returneres null.
status usigneret kort HTTP-status som et tal ( 404  - "Ikke fundet", 200  - "OK" osv.)
statustekst DOMString Status som en streng ("Ikke fundet", "OK" osv.).
Hvis status ikke genkendes, bør brugerens browser vise en INVALID_STATE_ERR-fejl.

Fejl smidt af XMLHttpRequest-klassen

Navn Koden Beskrivelse
SECURITY_ERR atten Kaldes, når der gøres et forsøg på at lave en anmodning, som ikke er tilladt af sikkerhedsindstillingerne i brugerens browser.
NETWORK_ERR 101 Kaldet på en netværksfejl (under en synkron anmodning).
AFBRYD_FEJL 102 Kaldes, når brugeren afbryder anmodningen (under en synkron anmodning).

Eksempel på brug

Planen for at arbejde med XMLHttpRequest-objektet kan repræsenteres som følger:

  1. Instantiering af et XMLHttpRequest-objekt
  2. Åbning af en forbindelse
  3. Indstilling af hændelseshåndteringen (bør gøres efter åbning og før afsendelse til IE)
  4. Sender en anmodning.

Instantiering af et XMLHttpRequest-objekt.

På dette stadium er der behov for en separat implementering for forskellige browsere. Konstruktionen af ​​objektskabelse adskiller sig: i IE 5 - IE 6 er det implementeret gennem ActiveXObject og i andre browsere (IE 7 og nyere, Mozilla, Opera, Chrome, Netscape og Safari) - som et indbygget objekt af typen XMLHttpRequest .

Opfordringen til tidligere versioner af Internet Explorer ser sådan ud [3] :

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

I andre browsere:

var req = ny XMLHttpRequest ();

Det vil sige, for at sikre kode på tværs af browsere , behøver du kun at tjekke for tilstedeværelsen af ​​window.XMLHttpRequest- og window.ActiveXObject-objekter, og, afhængigt af hvilken der er, anvende det.

Som en universel løsning foreslås det at bruge følgende funktion:

function createRequestObject () { if ( typeof XMLHttpRequest === 'undefined' ) { XMLHttpRequest = function () { try { return new ActiveXObject ( "Msxml2.XMLHTTP.6.0" ); } catch ( e ) {} prøv { returner nyt ActiveXObject ( "Msxml2.XMLHTTP.3.0" ); } catch ( e ) {} prøv { returner nyt ActiveXObject ( "Msxml2.XMLHTTP" ); } catch ( e ) {} prøv { returner nyt ActiveXObject ( "Microsoft.XMLHTTP" ); } catch ( e ) {} throw new Error ( "Denne browser understøtter ikke XMLHttpRequest." ); }; } returner ny XMLHttpRequest (); }

Installation af en hændelseshandler, åbning af en forbindelse og afsendelse af anmodninger

Disse opkald ser sådan ud:

kræve . åben ( < "GET" | "POST" | ... > , < url > [, < asyncFlag > [, < bruger > , < adgangskode > ]]); kræve . onreadystatechange = processReqChange ;

Hvor:

  • <"GET"|"POST"|...>  — anmodningsmetode . Tilladt: SLET, GET, HEAD, OPTIONS, POST, PUT.
  • <url>  er adressen på anmodningen.
  • <asyncFlag>  er et flag, der bestemmer, om der skal bruges en asynkron anmodning. Standarden er sat til sand.
  • <bruger> , <adgangskode>  — henholdsvis login og adgangskode. Specificeres evt.

Efter at have defineret alle parametrene for anmodningen, er det kun tilbage at sende det. Dette gøres ved hjælp af send() metoden. Når du sender en GET-anmodning for versionen uden ActiveX, skal du angive null-parameteren, i andre tilfælde kan du ikke angive nogen parametre. Det vil ikke være en fejl, hvis GET-parameteren altid er null:

kræve . send ( nul );

Derefter begynder ovenstående hændelseshandler at arbejde. Det er faktisk hoveddelen af ​​programmet. Behandleren opsnapper normalt alle mulige anmodningsstatuskoder og kalder de relevante handlinger, samt opsnapper mulige fejl. Eksempelkode med disse to funktioner:

varreq ; _ funktion loadXMLDoc ( url ) { req = null ; if ( vindue . XMLHttpRequest ) { prøv { req = new XMLHttpRequest (); } catch ( e ) {} } else if ( vindue . ActiveXObject ) { prøv { req = new ActiveXObject ( 'Msxml2.XMLHTTP' ); } catch ( e ) { prøv { req = new ActiveXObject ( 'Microsoft.XMLHTTP' ); } fange ( e ){} } } if ( req ) { req . åben ( "GET" , url , sand ); kræve . onreadystatechange = processReqChange ; kræve . send ( nul ); } } function processReqChange () { prøv { // Vigtigt! // only if state is "complete" if ( req . readyState == 4 ) { // for status "OK" if ( req . status == 200 ) { // process response } else { alert ( "Failed to get data : \n" + req . statusText ); } } } catch ( e ) { // alert('Fejl: ' + e. beskrivelse); // Bugzilla Bug 238559 XMLHttpRequest har brug for en måde at rapportere netværksfejl på // https://bugzilla.mozilla.org/show_bug.cgi?id=238559 } }

Kendte problemer

Lille bufferstørrelse ved indlæsning af video.

Se også

Noter

  1. ↑ XMLHttpRequest-objekt forklaret af W3C Working Draft . W3.org. Dato for adgang: 14. juli 2009. Arkiveret fra originalen 5. februar 2012.
  2. ↑ Nye funktioner i XMLHttpRequest2 . Hentet 30. september 2016. Arkiveret fra originalen 7. august 2016.
  3. ↑ Native XMLHTTPRequest-objekt . Hentet 2. december 2009. Arkiveret fra originalen 6. marts 2010.

Litteratur

  • Dave Crane, Eric Pascarello, Darren James. AJAX i aktion: Teknologi - Asynkron JavaScript og XML = Ajax i aktion. - M .: "Williams" , 2006. - S. 640. - ISBN 1-932394-61-3 .
  • Dari K., Brinzare B., Cherchez-Toza F., Busika M. AJAX og PHP: Dynamisk webapplikationsudvikling. - Sankt Petersborg. : Symbol Plus, 2006. - S. 336. - ISBN 5-93286-077-4 .

Links

Historie

Implementering i browsere

Tutorials

Standarder