Sei in: Home : Competenze : Applicazioni Web : Ajax (C#)

Ajax (C#)

Per Ajax (Asynchronous JavaScript and XML) si intende una comunicazione tra client e Server che, sempre tramite protocollo HTTP, consente la modifica della pagina senza ricaricarla completamente.
Per motivi di sicurezza i web server rifiutano le richieste ajax che non provengano dal medesimo dominio da cui è stata scaricata la pagina intera.

Per effettuare una richiesta ajax, per prima cosa, occorre istanziare un'oggetto XMLHttpRequest, che, per ragioni di retrocompatibilità con i vecchi browser,  va prevista in tre modi diversi:

function getXMLHttpRequest() {
    try {
        return new XMLHttpRequest();
    } catch (e) { }
    try {
        return new ActiveXObject('Msxml2.XMLHTTP');
    } catch (e) { }
    try {
        return new ActiveXObject('Microsoft.XMLHTTP');
    } catch (e) { }
}

var richiestaAjax = getXMLHttpRequest();

Richiesta sincrona

In seguito si effettua la richiesta con il suo metodo open() che può avere tre parametri: metodo (ad es:POST), URL e un booleano per esprimerne la sincronia o l'asincronia;

richiestaAjax.open("post","www.sito.it",false);

Successivamente si invia la richiesta vera e propria con il metodo send().

richiestaAjax.send(null);

in questo caso usiamo una richiesta sincrona, quindi send() non restituisce il controllo alla pagina fino alla ricezione della risposta.

In fine si recupera il contenuto della risposta in formato XML o stringa con le proprietà responseXML e responseText, ma solo dopo aver verificato che la comunicazione tramite protocollo HTTP abbia avuto successo:

if (richiestaAjax.status == 0 || richiestaAjax.status == 200) {
   var rispostaXML =  richiestaAjax.responseXML;
   var rispostaStringa =  richiestaAjax.responseText;
}else{
   alert("Errore comunicazione. Codice: " + richiestaAjax.status + "; Motivo: " + richiestaAjax.statusText);

Richiesta asincrona

Dopo aver istanziato come prima il nostro oggetto richiestaAjax, si crea un gestore del cambiamento di stato che quindi verrà richiamato al momento della risposta asincrona del server: controllerà prima lo stato della richiesta, poi quello del protocollo ed infine preleva il risultato:

richiestaAjax.onreadystatechange = gestisciRisposta(){
   if (richiestaAjax.readyState == 4){
      if (richiestaAjax.status == 0 || richiestaAjax.status == 200) {
         var rispostaXML =  richiestaAjax.responseXML;
         var rispostaStringa =  richiestaAjax.responseText;
      }else{
         alert("Errore comunicazione. Codice: " + richiestaAjax.status + "; Motivo: " + richiestaAjax.statusText);
      }
   }
}

Successivamente si lancia la richiesta asincrona :

richiestaAjax.open("post","www.sito.it",true);
richiestaAjax.send(null);