/ Forside / Teknologi / Udvikling / Java Scripts / Nyhedsindlæg
Login
Glemt dit kodeord?
Brugernavn

Kodeord


Reklame
Top 10 brugere
Java Scripts
#NavnPoint
molokyle 5410
Klaudi 2799
smorch 2439
kim 1360
Harlekin 1134
bentjuul 984
gibson 800
severino 695
Random 675
10  konsulent.. 626
Dybere forklaring på AJAX script
Fra : Rune Jensen


Dato : 12-02-08 11:17

Der er flere functioner, som skal gennemgås, for at man kan hente en
(text) fil og vise den i en DIV.

Denne forstår jeg, den forsøger at oprette XMLHttpRequest objektet,
baseret på de forskellige browsere:

function makeReqObj() {
   req = null;
   try { req = new XMLHttpRequest(); }
   catch (e) {
      try { req = new ActiveXObject("Msxml2.XMLHTTP"); }
      catch (e) {
         try { req = new ActiveXObject("Microsoft.XMLHTTP"); }
         catch (e) {
            alert( "Din browser kan ikke bruge AJAX!");
         }
      }
   }
}

...men så er der disse to functioner... hvad er det nøjagtigt, de gør?
Sådan forklaret på menneskesprog?

function HentFil(url) {
   makeReqObj();

   if ( req != null) {
      req.open( 'get', url, true);
      req.setRequestHeader( 'Content-Type', 'application/x-www-form-
urlencoded');
      req.setRequestHeader( 'Accept-Charset', 'iso-8859-1, utf-8');
      req.setRequestHeader( 'Accept-Language', 'da');

      nav = window.navigator.appName;
      if ( nav.indexOf( 'Netscape') > -1) {
         req.onload = AJAXDone;
      }
      else {
         req.onreadystatechange = AJAXDone;
      }

      req.send(null);

   }
}

function AJAXDone() {

   if ( req.readyState == 4) {

      if ( req.status != 200) {
         alert( 'Fejl ved AJAX request : Status '+req.status+'
returneret.');
      }

      else {
         document.getElementById('asp').innerHTML = req.responseText;
      }
   }
}

...spørgsmål: Hvad vil man kalde onload og onreadystatechange (så det
er til at forstå)? Altså hvad er præcist deres funktion? Der er også
en req.status, og hvad vil man så kalde den? Hvad er forskellen på
readystatechange og status? De er vel begge status for req-objectet?


...det hele er hugget fra Birger, og meget af det har vidstnok været
diskuteret før. Jeg kan godt bruge det, men jeg er interesseret i en
lidt dybereliggende forklaring på scriptene.


MVH
Rune Jensen

 
 
Johan Holst Nielsen (12-02-2008)
Kommentar
Fra : Johan Holst Nielsen


Dato : 12-02-08 19:33

Rune Jensen wrote:
> ...men så er der disse to functioner... hvad er det nøjagtigt, de gør?
> Sådan forklaret på menneskesprog?
>
> function HentFil(url) {
>    makeReqObj();

Laver XMLHttpRequest objektet.

>    if ( req != null) {

Hvis req er sat (= browseren understøtter AJAX - eftersom req er XMLHttp
objektet) - skal den gør alt herefter

>       req.open( 'get', url, true);

Åbne en URL med GET metoden.

>       req.setRequestHeader( 'Content-Type', 'application/x-www-form-
> urlencoded');

Send en header som om det er en form der bliver submitted.

>       req.setRequestHeader( 'Accept-Charset', 'iso-8859-1, utf-8');

Accepter iso-8859-1 samt utf-8 som charset (tegnsæt)

>       req.setRequestHeader( 'Accept-Language', 'da');

Dansk som sprog.

>       nav = window.navigator.appName;

Finder browseren navn (som den selv kalder sig for).

>       if ( nav.indexOf( 'Netscape') > -1) {

Hvis browseren navn indeholder ordet "Netscape"

>          req.onload = AJAXDone;

Skal AJAXDone køres onload (det er reelt når get-kaldet kørt).

>       }
>       else {
>          req.onreadystatechange = AJAXDone;

Ellers kør onreadystatechange.

>       }
>
>       req.send(null);

Send requested :)

>
>    }
> }
>
> function AJAXDone() {
>
>    if ( req.readyState == 4) {

HVIS readyState = 4 (completed) skal den gøre det nedenfor.

Bemærk readyState har 5 værdier.

0 = Endnu ikke åbnet.
1 = Afventer dit req.send();
2 = req.send() er kald, og du kan hente header
3 = Download af "indhold" undervejs
4 = Tada - færdig.

>       if ( req.status != 200) {

Hvis status = 200 er reelt HTTP "found" for FOUND - altså at du f.eks.
ikke får en 404. Hvis den ikke er er 200 skal den altså udskrive alrten
herunder.

>          alert( 'Fejl ved AJAX request : Status '+req.status+'
> returneret.');
>       }
>
>       else {
>          document.getElementById('asp').innerHTML = req.responseText;

Ellers skal den udskrive det indhold den får fra requested til elementet
med ID'et "asp"

>       }
>    }
> }
>
> ...spørgsmål: Hvad vil man kalde onload og onreadystatechange (så det
> er til at forstå)? Altså hvad er præcist deres funktion? Der er også
> en req.status, og hvad vil man så kalde den? Hvad er forskellen på
> readystatechange og status? De er vel begge status for req-objectet?

onreadystatechange returner blot hver gange en "status" ændrer sig -
altså fra 1-2-3-4 i din readyState parameter. Hvornår den ændrer status
er beskrevet længere oppe.

status er blot en HTTP status. F.eks. 200 = Found, 404 = Not Found, 301
= Permanently Moved osv osv osv.

Håber det hjalp lidt

--
Johan Holst Nielsen
Freelance PHP Developer - http://phpgeek.dk

Birger (12-02-2008)
Kommentar
Fra : Birger


Dato : 12-02-08 21:00

"Rune Jensen" <runeofdenmark@gmail.com> skrev i en meddelelse
news:73fce426-d22d-4050-acb2-55b0af44078d@e10g2000prf.googlegroups.com...
8X

Min OE er ikke i humør til at markere oprindelig meddelelse - håber det
bliver forståeligt...

function HentFil(url) {
makeReqObj();

if ( req != null) {
req.open( 'get', url, true);
req.setRequestHeader( 'Content-Type', 'application/x-www-form-
urlencoded');
req.setRequestHeader( 'Accept-Charset', 'iso-8859-1, utf-8');
req.setRequestHeader( 'Accept-Language', 'da');

nav = window.navigator.appName;
if ( nav.indexOf( 'Netscape') > -1) {
req.onload = AJAXDone;
}
else {
req.onreadystatechange = AJAXDone;
}

req.send(null);

}
}


Et kort svar på dit spørgsmål, er at den initialiserer et XMLHTTPRequest
object, og sender en request.

XMLHTTPReq er et object.
makeReqObj instantierer et sådan object, hvis muligt.
Hvis der er succes med instantiering (oprettelse af object), er der en række
egenskaber i objectet, man kan/skal sætte, så det opfører sig som man
forventer, og får de resultater man ønsker sig.
Først er der req.open(), der er en slags initialisering af objectet. Det
sætter get/post, hvilken url man ønsker at hente data fra, og hvordan man
ønsker sig kommunikationen (true for asynkron false for synkron).
Derefter sættes en række af data for headeren, som bestemmer en del om
hvordan kommunikationen foretages. Der er mange muligheder for at sætte
headere.
Ideen med "AJAX" er at man kalder et script på serveren, som returnerer
nogle data. Når kommunikationen er færdig, kalder objectet en funktion, hvor
man så kan anvende de data der returneres.
Det er denne funktion der sættes i onreadystatechange / onload.
Som Johan har forklaret, kaldes denne funktion faktisk flere gange i
forløbet af kommunikationen mellem browser og server, men normalt er man kun
interesseret i at vide når den er færdig.
onload anvendes / kendes svjv. kun af FF - derfor også detekteringen af FF.
onreadystatechange er navnet i øvrige tilfælde. FF kender godt
onreadystatechange - undtagen hvis man anvender post og synkron
kommunikation sammen, da anvendes kun onload i FF. (Hvilket er i
overensstemmelse med udkast til standarden). Imidlertid opfører de andre
(M$) sig ikke efter standarden. Jeg har valgt at lade FF altid bruge onload,
efter Mozilla dokumentation. At FF kender eller accepterer
onreadystatechange, er ikke i Mozillas dokumentation - men det gør den i
praksis. Men der er ikke er nogen der siger at den bliver ved med det.
Endelig kaldes req.send(), som starter kommunikationen med serveren -
aktiverer objektet kan man sige.
Har set Johans forklaring. Der er lidt der måske kan misforstås om hvornår
hvad sker - der sker ingenting, før send() kaldes.

function AJAXDone() {

if ( req.readyState == 4) {

if ( req.status != 200) {
alert( 'Fejl ved AJAX request : Status '+req.status+'
returneret.');
}

else {
document.getElementById('asp').innerHTML = req.responseText;
}
}
}

På menneskesprog, behandler den de data der blev returneret som resultat af
requesten.

readyState er den tilstand, objectet befinder sig i. Vi er kun interesseret
i at undersøge resultatet, når kommunikationen er overstået. (Se Johans
forklaring)
Hvis den er det, er readyState == 4. Men fordi kommunikationen er slut, er
det ikke givet, at alt gik som det skulle.
Det står i objectets status, som indeholder resultatet af selve
kommunikationen. Kun hvis status er 200, forgik kommunikationen som
forventet/håbet ;>)


"...spørgsmål: Hvad vil man kalde onload og onreadystatechange (så det
er til at forstå)? Altså hvad er præcist deres funktion? Der er også
en req.status, og hvad vil man så kalde den? Hvad er forskellen på
readystatechange og status? De er vel begge status for req-objectet?"

onload/onreadystatechange er en callback funktion.
Det er den samme, men den kaldes forskelligt i FF og de øvrige - og også i
standarden.
Det er en funktion der kaldes, hver gang readyState ændres i objektet -
altså hver gang der sker ændringer i objectets (browserens) kommunikation
med serveren.
XMLHTTPRequest objectet har en readyState variabel der holder styr på hvor
langt i kommunikationen det er nået. Se Johans forklaring.
status er også en variabel i samme object. Men den eksisterer kun når
readyState er 4 - altså kommunikationen er afsluttet - og status fortæller
hvordan kommunikationen er forløbet - 200 for OK, 404 hvis den angivne url
ikke findes, osv.

Håber det giver mening. Ellers prøv igen ;>)


Birger
-----
http://bbsorensen.dk
http://varmeretter.dk - hverdagsmad. Sundt, nemt, hurtigt og billigt. Daglig
opdatering.



Stig Johansen (13-02-2008)
Kommentar
Fra : Stig Johansen


Dato : 13-02-08 08:23

Birger wrote:

> Min OE er ikke i humør til at markere oprindelig meddelelse - håber det
> bliver forståeligt...

Der findes en 'quote-fix'/patch til OE ude på i*nettet ;)

[snip en fin forklaring]
> onload anvendes / kendes svjv. kun af FF - derfor også detekteringen af
> FF.

Nu har du fundet løsningen til alle os, men jeg undrer mig over 'Netscape'
og 'FF'.

Netscape er vel mere eller mindre død, er forklaringen at FF vistnok
nedstammer fra Netscape?

Der er ikke noget i det, undrer mig bare over de ikke kalder den 'Firefox' i
stedet for 'Netscape'.

--
Med venlig hilsen
Stig Johansen

Rune Jensen (12-02-2008)
Kommentar
Fra : Rune Jensen


Dato : 12-02-08 16:03

On Feb 12, 9:00 pm, "Birger" <s...@bbsorensen.com> wrote:

> Endelig kaldes req.send(), som starter kommunikationen med serveren -
> aktiverer objektet kan man sige.
> Har set Johans forklaring. Der er lidt der måske kan misforstås om hvornår
> hvad sker - der sker ingenting, før send() kaldes.

Tak for svarene til jer begge, det hjalp

Ah, ja, det er måske en af de ting, jeg har misset. Fra open til send
burde der iflg. min logik ikke ske noget. Men hvordan kan man så
tjekke status på objektet (AJAXDone), før det egentlig bruges (send)?

Begynder statussen at counte, når der åbnes?

Jeg var faktisk gået i seng (men vågnede ved naboens trampen på
trapperne), så kan jeg ligesågodt få stillet spørgsmålet.

Ja, det kan godt være, jeg vender tilbage:) Det lyder som helt basic
viden, så jeg vil meget gerne have det helt klart i hovedet, før jeg
gør noget andet. Tror egentlig kun der mangler få brikker.


MVH
Rune Jensen

Birger (13-02-2008)
Kommentar
Fra : Birger


Dato : 13-02-08 09:12

"Rune Jensen" <runeofdenmark@gmail.com> skrev i en meddelelse
news:b765aaa5-ccef-4930-b931-de2447adc26a@m34g2000hsb.googlegroups.com...
On Feb 12, 9:00 pm, "Birger" <s...@bbsorensen.com> wrote:

Ah, ja, det er måske en af de ting, jeg har misset. Fra open til send
burde der iflg. min logik ikke ske noget. Men hvordan kan man så
tjekke status på objektet (AJAXDone), før det egentlig bruges (send)?

Begynder statussen at counte, når der åbnes?

Jeg var faktisk gået i seng (men vågnede ved naboens trampen på
trapperne), så kan jeg ligesågodt få stillet spørgsmålet.

Ja, det kan godt være, jeg vender tilbage:) Det lyder som helt basic
viden, så jeg vil meget gerne have det helt klart i hovedet, før jeg
gør noget andet. Tror egentlig kun der mangler få brikker.






readyState kan have 5 værdier :

0.. (Uninitialized) Objectet er blevet oprettet, men ikke initialiseret
(open er ikke kaldt).
1.. (Open) Objectet er blevet initialiseret, men send metoden er ikke
blevet kaldt.
2.. (Sent) Send metoden er blevet kaldt, men et svar er endnu ikke
modtaget (status og headere er ikke tilgængelige).
3.. (Receiving) Nogle data er blevet modtaget.
4.. (Loaded) Alle data er modtaget og er tilgængelige
Open er en slags initialisering af objektet. Normalt vil man initialisere et
object når det instantieres (oprettes), men der er nogle ting der foretages
af open(), som skal gøres før andre funktioner i objectet kan bruges.
Formentlig hænger det sammen med at det jo er et object, og derfor kan
genbruges, og det vil så skulle initialiseres, andet end blot når det
instantieres. For at kunne bruge objektet ens første gang og de følgende, er
det altså nødvendigt, også at kalde open() første gang.

Ud over at man kan sætte headere for kommunikationen, sker der ingenting
mellem open() og send().

Status og header er kun tilgængelige, når readyState er 3 eller 4 - altså
først efter send() er blevet kaldt.
Og du kan selvfølgelig godt checke status mellem dem - det giver blot ikke
mening.
AJAXDone kaldes hver gang readyState ændres, og kun hvis readyState er 4
(kommunikationen er slut), checkes status.

Man kan godt forestille sig, at een funktion initialiserer objektet med
open() - gør det klar til en given kommunikation -, og en anden funktion
starter kommunikationen med send().
Så længe send() ikke er kaldt, er status udefineret, og readyState er 1 - og
det ændres der ikke ved.
Først når send() kaldes, startes kommunikationen med serveren.
Under kommunikationen, bliver readyState opdateret, svarende til
ovenstående.
Efter hver opdatering af readyState, kaldes onreadystatechange (AJAXDone i
eksemplet) - og kun når det sker. Ikke når onreadystatechange sættes til at
være AJAXDone - det er kun tildeling af en værdi; i dette tilfælde en
pointer til en funktion.
Først når kommunikationen med serveren er afsluttet, er status tilgængelig.



Birger
-----
http://bbsorensen.dk
http://varmeretter.dk - hverdagsmad. Sundt, nemt, hurtigt og billigt. Daglig
opdatering.



Søg
Reklame
Statistik
Spørgsmål : 177552
Tips : 31968
Nyheder : 719565
Indlæg : 6408847
Brugere : 218887

Månedens bedste
Årets bedste
Sidste års bedste