× Aktuálně z oboru

SHIELD Experience Upgrade 7 – méně hledání a více zábavy [ clanek/2018052902-shield-experience-upgrade-7-mene-hledani-a-vice-zabavy/ ]
Celá zprávička [ clanek/2018052902-shield-experience-upgrade-7-mene-hledani-a-vice-zabavy/ ]

Ajax – 1. lekce

[ http://programujte.com/profil/13487-petr-laslo/ ]Google [ ?rel=author ]       [ http://programujte.com/profil/118-zdenek-lehocky/ ]Google [ ?rel=author ]       8. 7. 2008       42 425×

Po úvodním díle si probereme objekt XMLHttpRequest a naučíme se tento objekt zinicializovat.

Objekt XMLHttpRequest

Tento objekt byl původně implementován v Intrnet Exploreru 5 jako komponent ActiveX. Nakonec se stal standardem ve webových prohlížečích a s výjimkou Internet Exploreru 6 je podporován všemi moderními prohlížeč jako IE 7, IE 8, Mozilla Firefox, Opera, Safari… I když se stal standardem ve webových prohlížečích, nejedná se o standart W3C, sice ho má konsorcium v návrhu DOM Level 3, avšak není implementován všemi prohlížeči.

Nakonec bych rád uvedl, nebýt objektu XMLHttpRequest (dále jen XHR), aplikace jako RoundCube, Google Suggest, Gmail a Gmaps by neexistovaly a ani byste nečetli tento článek mého seriálu a v konečném důsledku bych ani já neměl o čem psát.

Vytvoření XHR

Jelikož XHR není standardem W3C, existují různé způsoby jeho vytvoření. Ve starších prohlížečích a IE 6 je XHR implementován jako objekt ActiveX a jeho instanci vytvoříme následovně:

xhr = new ActiveXObject(Microsoft.XMLHttp);

U ostatních moderních prohlížečů jako vytvoříme instanci jako nativní objekt XHR:

xhr = new XMLHttpRequest();

Při vytváření XHR jako objektu ActiveX musíme určit, kterou verzi MSXML použijeme. Každé vydání přináší lepší stabilitu a rychlost. Ve svých aplikacích byste měli použít vždy nejnovější verzi, která je pro daný prohlížeč dostupná. Problém nám nastává v případě, že budeme volat verzi, kterou prohlížeč uživatele nepodporuje. V tom případě dojde k výjimce, kterou musíme ošetřit.

Verze MSXML

  • Microsoft.XMLHttp
  • MSXML2.XMLHttp.2.0
  • MSXML2.XMLHttp.3.0
  • MSXML2.XMLHttp.4.0
  • MSXML2.XMLHttp.5.0
  • MSXML2.XMLHttp.6.0
Verze 6.0 se objevila společně s Windows Vista. Je doporučeno používat tuto verzi vždy, když je to možné. Jak se ovšem dalo předem očekávat, tato veze objektu není dostupná pro uživatele starších verzí Windows, takže Microsoft v takovém případě doporučuje použít nouzově verzi 3.0.

Zdroj: Ajax – Profesionálně, nakladatelství Zoner Press

Použití nejnovější verze MSXML

Pokusíme se vytvořit XHR s nejnovější verzí. Pokud jej prohlížeč nebude podporovat, ohlásí chybu, kterou pomocí try a catch zachytíme a budeme ignorovat, poté pokus zopakujeme se starší verzí.

Univerzální funkce pro tvorbu XHR

Nyní si můžeme napsat univerzální funkci, kterou můžeme použít ve všech prohlížečích. Postup bude následující:

  1. Vytvoříme novou funkci pomocí:
    function vytvorXHR(){}
  2. Musíme inicializovat proměnou, do které objekt uložíme, to provedeme pomocí:
    var XHR;
  3. Nyní použijeme try a catch, do try zadáme příkaz pro vytvoření XHR jako instance nativního XHR a do catch zadáme příkaz pro vytvoření XHR jako objektu ActiveX. Předpokládáme použití moderních prohlížečů a pro případ, že by naše stránky navštívil uživatel se starším prohlížečem, tak při vytváření XHR jako instance nativního XHR dojde k chybě, kterou budeme ignorovat a přejdeme k vytvoření XHR jako objektu ActiveX. Funkce by měla vypadat nyní následovně:
    function vytvorXHR(){
    var xhr;
    try{
    xhr = new XMLHttpRequest();
    }catch(e){
    xhr = new ActiveXObject(Microsoft.XMLHttp);
    }
    }
  4. Abychom mohli použít nejnovější verzi MSXML, rozšíříme naši funkci o pole, v kterém definujeme verze MSXML:
    var MSXmlVerze = new Array('MSXML2.XMLHttp.6.0','MSXML2.XMLHttp.5.0','MSXML2.XMLHttp.4.0','MSXML2.XMLHttp.3.0','MSXML2.XMLHttp.2.0','Microsoft.XMLHttp');
  5. Abychom určili, kterou verzi MSXML můžeme použít, tak pomocí cyklu for budeme procházet jednotlivé záznamy v poli. Část catch, kde nastavujeme XHR jako objekt ActiveX, upravíme následovně:
    for(var i = 0; i < MSXmlVerze.length; i ++){
    try{
    xhr = new ActiveXObject(MSXmlVerze[i]);
    break;
    }catch(e){
    //vzniklou chybu ignoruji a pokračuji nastavením další verze
    }
  6. Konstrukce try, catch nám zajistí, že pokud vytvoření XHR selže, chybu budeme ignorovat a zopakujem postup. Pokud úspěšně nastavíme objekt ActiveX se správnou verzí MSXML, z cyklu vyskočíme pomocí break.
  7. Nakonec naše funkce vrátí objekt XHR nebo zobrazí chybu:
    if(!xhr)
    alert("Došlo k chybě při vytváření objektu XMLHttpRequest!");
    else
    return xhr;
  8. Naše funkce tedy v konečné fázi vypadá takto:
    function vytvorXHR(){
        var xhr;
        try{
          xhr = new XMLHttpRequest();
        }catch(e){//pro případ starší verze prohlížeče
          var MSXmlVerze = new Array('MSXML2.XMLHttp.6.0','MSXML2.XMLHttp.5.0','MSXML2.XMLHttp.4.0','MSXML2.XMLHttp.3.0','MSXML2.XMLHttp.2.0','Microsoft.XMLHttp');
          for(var i = 0; i <= MSXmlVerze.length; i ++){
            try{
              xhr = new ActiveXObject(MSXmlVerze[i]);
             //alert(MSXmlVerze[i]);
              break;
            }catch(e){
              //vzniklou chybu ignoruji a pokračuji nastavením další verze
            }
          }
        }
        if(!xhr)
          alert("Došlo k chybě při vytváření objektu XMLHttpRequest!");
        else
          return xhr;
      }

Závěr

V dnešním článku jsme se naučili pracovat se samotným srdcem Ajaxu. V příštím díle se vrhneme na metody a atributy XHR.


Článek stažen z webu Programujte.com [ http://programujte.com/clanek/2008062102-ajax-1-lekce/ ].