XMLHttpRequest: differenze tra le versioni

Versione delle 20:39, 15 set 2007

Versione attuale delle 16:24, 14 mag 2024

(64 versioni intermedie di 58 utenti non mostrate)

Riga 1:

{{F|programmazione|agosto 2012}}

'''XMLHTTP''' è un set di [[Application programming interface|API]] che possono essere usate da [[JavaScript]], [[JScript]], [[VBScript]] e altri linguaggi di scripting dei [[browser]] per trasferire [[XML]] o altri dati da e averso un [[web server]] tramite [[Hypertext Transfer Protocol|HTTP]]. Il più grande vantaggio di XMLHTTP è la possibilità di aggiornare dinamicamente una pagina web senza ricaricare l'intera pagina. Viene usato da alcunalcuni [[sito web|siti web]] per velocizzare applicazioni dinamiche. Un esempio di applicazione XMLHTTP è il servizio di posta elettronica [[Gmail]] di [[Google]].

XMLHTTP è un componente importante nella tecnica di sviluppo web "[[AJAX]]".

Oltre a XML, XMLHTTP può essere usato per prendere dati in altri formati, come [[JSON]] o anche testo semplice.

XMLHttpRequest (abbreviato: XHR) è un elemento fondamentale della tecnica di sviluppo web conosciuta con l'acronimo Ajax[[AJAX]], ed è utilizzato in molti siti web per implementare applicazioni fruibili via browser dinamiche ed interattive. Una delle prime applicazioni ad utilizzare questo componente è stato il servizio di [[webmail]] di [[Google]] [[Gmail]], a cui sono seguiti Google Suggest, Meebo, Virtual Earth di MSN e [[MapQuest]].

== Metodi ==

{| class="wikitable" width="90%"

! Metodo

! Descrizione

|-

| <ttcode>abort()</ttcode>

| Cancella la richiesta in atto.

|-

| <ttcode>getAllResponseHeaders()</ttcode>

| Restituisce sotto forma di stringa tutti gli header HTTP ricevuti dal server

|-

| nowrap | <ttcode>getResponseHeader( nome_header )</ttcode>

| Restituisce il valore dell'header HTTP specificato

|-

| nowrap valign="top" | <ttcode>open( metodo, URL )</ttcode><br /><ttcode>open( metodo, URL, async )</ttcode><br /><ttcode>open( metodo, URL, async, userName )</ttcode><br /><ttcode>open( metodo, URL, async, userName, password )</ttcode>

|Specifica il metodo, l'URL, ande altri parametri opzionali per la richiesta.

Il parametro metodo può assumere valore di "GET", "POST", oppure "PUT" ("GET" è utilizzato quando si richiedono dati, mentre "POST" è utilizzato per inviare dati, specialmente se la lunghezza dei dati da trasmettere è maggiore di 512 bytesbyte).

Il parametro URL può essere sia relativo che assoluto.

Il parametro "async" specifica se la richiesta deve essere gestita in modo asincrono oppure no &ndash;– "true" significa che lo script può proseguire l'elaborazione senza aspettare la risposta dopo il metodo send(), mentre "false" significa che lo script è costretto ad aspettare una risposta dal server prima di continuare.

|-

| <ttcode>send( content )</ttcode>

| Invia la richiesta

|-

| nowrap | <ttcode>setRequestHeader( chiave, valore)</ttcode>

| Aggiunge la coppia chiave/valore alla richiesta da inviare.

|}

== Attributi ==

{| class="wikitable" width="90%"

! Attributo

! Descrizione

|-

| <ttcode>onreadystatechange</ttcode>

| Gestore dell'evento lanciato ad ogni cambiamento di stato.

|-

| valign="top" | <ttcode>readyState</ttcode>

| Restituisce lo stato corrente dell'istanza di XMLHttpRequest:

0 = non inizializzato, 1 = aperto, 2 = richiesta inviata, 3 = risposta in ricezione e 4 = risposta ricevuta.

|-

| <ttcode>responseText</ttcode>

| Restituisce la risposta del server in formato stringa

|-

| <ttcode>responseXML<tt/code>

| Restituisce la risposta del server come XMLoggetto Document, che potrà essere analizzato e parsato comeesaminato secondo le specifiche DOM del W3C.

|-

| <ttcode>status</ttcode>

| Restituisce il codice HTTP restituito dal server (per esempio [[Errore 404|404]] per "Not Found" e 200 per "OK").

|-

| <ttcode>statusText</ttcode>

| Restituisce lo <ttcode>status</ttcode> in forma di stringa descrittiva (per esempio. "Not Found" oppure "OK").

|}

== Storia ==

L'oggetto venne originariamente inventato da [[Microsoft]], usato da [[Internet Explorer]] 5.0 come oggetto [[ActiveX]], accessibile via JavaScript, VBScript, o qualsiasi altro linguaggio supportato dal browser. Gli sviluppatori di Mozilla implementarono poi una versione compatibile in [[Mozilla]] 1.0. Successivamente è stato supportato anche da [[Apple]] con [[Safari (browser)|Safari]] 1.2 e da [[Opera Software]] con [[Opera (browser)|Opera]] 8.0.

La maggior parte delle pagine ben progettate che usandousano XMLHTTP sono destinate a nascondere le implementazioni dell'oggetto XMLHTTP incapsulando la sua invocazione con un [[JavascriptJavaScript]].

Funzionalità simili sono incluse in [[Document Object Model|DOM]] Livello 3 "Load and Save", già raccomandazione del [[W3C]]. A [https://caniuse.com/xhr2 questo indirizzo] è possibile trovare le informazioni di compatibilità con tutti i principali browser.

Tuttavia, per ora ([[2005]]), nessun web browser supporta in modo completo questa specifica. XMLHttpRequest è comunque pensato come uno standard di fatto per il futuro.

Al momento (2018) è implementato in maniera esauriente in tutti i principali browser. (Safari, Chrome, FireFox, Opera)

==Problemi noti==

===La cache di Microsoft Internet Explorer===

Il browser di casa Microsoft implementa una cache per le richieste GET. Gli sviluppatori che non sono abituati al caching non si aspettano che le richieste GET vengano memorizzate, oppure che essa venga ignorata come per il tasto di refresh. In alcune situazioni, non riuscire ad evitare la cache genera problemi al punto di poter essere considerato un bug. Una soluzione a questo è di utilizzare il metodo POST nelle request, che non viene mai memorizzato in cache.

== Problemi noti ==

Ci sono diversi modi per cercare di aggirare il problema. Il primo consiste nel settare nell'header per la voce "Expires" una data già passata farà evitare il caching delle risposte. Un esempio in [[PHP]]

=== La cache di Microsoft Internet Explorer ===

Il browser di casa Microsoft implementa una cache per le richieste GET. Gli sviluppatori che non sono abituati al caching non si aspettano che le richieste GET vengano memorizzate, oppure che essa venga ignorata come per il tasto di refresh. In alcune situazioni, non riuscire ad evitare la cache genera problemi al punto di poter essere considerato un bug. Una soluzione a questo è di utilizzare il metodo POST nelle request, che non viene mai memorizzato in cache.

Ci sono diversi modi per cercare di aggirare il problema. Il primo consiste nel settarenell'impostare nell'header per la voce "Expires" una data già passata: ciò farà evitare il caching delle risposte. Un esempio in [[PHP]]:

header( "Expires: Mon, 26 Jul 1997 05:00:00 GMT" ); // disable IE caching

header( "Last-Modified: " . gmdate( "D, d M Y H:i:s" ) . " GMT" );

header( "Cache-Control: no-cache, must-revalidate" );

header( "Pragma: no-cache" );

<syntaxhighlight lang="php">

Invece nelle Java Servlet:

header( "Expires: Mon, 26 Jul 1997 05:00:00 GMT" ); // disable IE caching

header( "Last-Modified: " . gmdate( "D, d M Y H:i:s" ) . " GMT" );

header( "Cache-Control: no-cache, must-revalidate" );

header( "Pragma: no-cache" );

header( "Expires: -1", false );

</syntaxhighlight>

Invece nelle Java [[Servlet]]:

response.setHeader( "Pragma", "no-cache" );

response.addHeader( "Cache-Control", "must-revalidate" );

<syntaxhighlight lang="java">

response.addHeader( "Cache-Control", "no-cache" );

response.addHeadersetHeader( "Cache-ControlPragma", "no-storecache" );

response.setDateHeaderaddHeader( "ExpiresCache-Control", 0"must-revalidate" );

response.setHeaderaddHeader( "PragmaCache-Control", "no-cache" );

response.addHeader( "Cache-Control", "mustno-revalidatestore" );

response.setDateHeader("Expires", 0);

</syntaxhighlight>

In alternativa è possibile costringere l'oggetto XMLHttpRequest ad effettuare la richiesta nel seguente modo:

<syntaxhighlight lang="js">

req.open( "GET", "xmlprovider.php" );

req.open( "GET", "xmlprovider.php" );
req.setRequestHeader( "If-Modified-Since", "Sat, 1 Jan 2000 00:00:00 GMT" );

req.send( null );

</syntaxhighlight>

Un ultimo metodo è di aggiungere una stringa casuale alla fine dell'URL nella richiesta HTTP, facendo credere quindi al browser di richiedere una pagina diversa:

<syntaxhighlight lang="js">

req.open( "GET", "xmlprovider.php?sid=" + Math.random());

</syntaxhighlight>

È importante notare che le tecniche mostrate dovrebbero essere utilizzate '''solo''' quantoquando il caching risulta essere inappropriato e da evitare. Se questi metodi fossero usati indiscrinatamenteindiscriminatamente, l'applicazione potrebbe risentirne in termini di prestazioni.

req.open( "GET", "xmlprovider.php?sid=" + Math.random());

=== Problemi con caratteri accentato e non ASCII ===

È importante notare che le tecniche mostrate dovrebbero essere utilizzate '''solo''' quanto il caching risulta essere inappropriato e da evitare. Se questi metodi fossero usati indiscrinatamente, l'applicazione potrebbe risentirne in termini di prestazioni.

Se la risposta del server non è in formato XML, il ''responseText'' potrebbe non funzionare correttamente mentre si utilizzano i caratteri non-[[ASCII]], per esempio le lettere accentate come «è». Mentre Firefox gestisce correttamente questi dati e visualizza il carattere incriminato, Internet Explorer lo gestirà correttamente alla prima richiesta (anche se potrebbero esserci dei problemi). Se la richiesta viene ripetuta ed il browser di Microsoft utilizza un risultato memorizzato in cache, allora genererà un errore JavascriptJavaScript.

L'utilizzo di risposte XML e del metodo ''responseXML'' permette di far funzionare tutto correttamente con qualsiasi carattere [[UTF-8]].

===Problemi con caratteri accentato e non ASCII===

Se la risposta del server non è in formato XML, il 'responseText' potrebbe non funzionare correttamente mentre si utilizzano i caratteri non-[[ASCII]], per esempio le lettere accentate come «è». Mentre Firefox gestisce correttamente questi dati e visualizza il carattere incriminato, Internet Explorer lo gestirà correttamente alla prima richiesta (anche se potrebbero esserci dei problemi) Se la richiesta viene ripetuta ed il browser di Microsoft utilizza un risultato memorizzato in cache, allora genererà un errore Javascript.

In alternativa il problema può essere risolto settando il charset adeguato nella pagina a cui viene effettuata la richiesta, in modo che il testo di risposta sia prodotto nella giusta codifica fin dall'inizio.

L'utilizzo di risposte XML e del metodo 'responseXML' permette di far funzionare tutto correttamente con qualsiasi carattere [[UTF-8]].

=== Riutilizzare l'oggetto XMLHttpRequest in IE ===

In Internet Explorer, se il metodo open viene chiamato dopo aver associato la callback onreadystatechange, ci sarà un problema nel riutilizzo dell'oggetto XHR. Per essere in grado di riutilizzare correttamente l'oggetto XHR, utilizzare il metodo open prima e settareimpostare onreadystatechange dopo. Questo capita perché IE resetta implicitamente l'oggetto nel metodo open se lo stato risulta essere ''completed''.<ref>{{en}}[https://keelypavan.blogspot.com/2006/03/reusing-xmlhttprequest-object-in-ie.html Reusing XMLHttpRequest Object in IE.]</ref>

Questo capita perché IE resetta implicitamente l'oggetto nel metodo open se lo stato risulta essere 'completed'.

Per approfondire il discorso [http://keelypavan.blogspot.com/2006/03/reusing-xmlhttprequest-object-in-ie.html Reusing XMLHttpRequest Object in IE.].

Chiamare il metodo open dopo aver settato la callback causa una perdita di compatibilità tra i diversi browser per i readystates. Confronta <ref>{{en}}[http://www.quirksmode.org/blog/archives/2005/09/xmlhttp_notes_r_2.html l'articolo su quirksmode ] (EN).</ref>

=== Supporto Cross Browser ===

Gli sviluppatori Microsoft furono i primi ad includere l'oggetto XMLHttp nel loro MSXML ActiveX control. Gli sviluppatori del progetto [[Open source|Open Source]] Mozilla crearono la loro versione di XmlHttp, non come un controllo ActiveX ma come un oggetto nativo nel browser, con il nome di XMLHttpRequest. Opera e Safari hanno sviluppato un oggetto simile, più vicino all'implementazione Mozilla. Per creare librerie JavaScript portabili è necessario includere diversi controlli per utilizzare l'oggetto XMLHttp appropriato.

Per creare librerie javascript portabili è necessario includere diversi controlli per utilizzare l'oggetto XMLHttp appropriato.

InternetDalla Explorerversione 7, Internet Explorer supporta nativamente XMLHttpRequest.

==Collegamenti esterniNote ==

<references/>

*[http://developer.apple.com/internet/webcontent/xmlhttpreq.html DHTML e XML: L'oggetto XMLHttpRequest]

*[http://www.mozilla.org/xmlextras/ XML Extras]

*[http://xulplanet.com/references/objref/XMLHttpRequest.html XMLHttpRequest]

*[http://msdn.microsoft.com/library/default.asp?url=/library/en-us/xmlsdk/html/xmobjxmlhttprequest.asp IXMLHTTPRequest]

*[http://jibbering.com/2002/4/httprequest.html Usare l'oggetto XML HTTP Request]

*[http://www.w3.org/TR/DOM-Level-3-LS/ Raccomandazione W3C: DOM Livello 3 specifica "Load and Save"]

*[http://www.google.com/webhp?complete=1&hl=en Google Suggest]

== Collegamenti esterni ==

[[Categoria:XML]]

* {{Collegamenti esterni}}

*[http {{cita web|https://www.w3.org/TR/DOM-Level-3-LS/ |Raccomandazione W3C: DOM Livello 3 specifica "Load and Save"]}}

*[http {{cita web|https://developer.apple.com/internet/webcontent/xmlhttpreq.html |DHTML e XML: L'oggetto XMLHttpRequest]}}

*[http {{cita web|https://www.mozilla.org/xmlextras/ |XML Extras]}}

* {{cita web | 1 = http://xulplanet.com/references/objref/XMLHttpRequest.html | 2 = XMLHttpRequest | accesso = 3 luglio 2005 | dataarchivio = 29 giugno 2005 | urlarchivio = https://web.archive.org/web/20050629004458/http://xulplanet.com/references/objref/XMLHttpRequest.html | urlmorto = sì }}

*[http {{cita web|url=https://msdn.microsoft.com/library/default.asp?url=/library/en-us/xmlsdk/html/xmobjxmlhttprequest.asp |titolo=IXMLHTTPRequest]}}

*[ {{cita web|http://jibbering.com/2002/4/httprequest.html |Usare l'oggetto XML HTTP Request]}}

*[http {{cita web|url=https://www.google.com/webhp?complete=1&hl=en |titolo=Google Suggest]}}

{{Interfacce web}}

[[cs:XMLHttpRequest]]

{{Portale|internet|informatica}}

[[de:XMLHttpRequest]]

[[en:XMLHttpRequest]]

[[Categoria:XML]]

[[es:XMLHttpRequest]]

[[Categoria:Standard W3C]]

[[fr:XMLHttpRequest]]

[[Categoria:Standard Internet]]

[[ja:XMLHttpRequest]]

[[nlCategoria:XMLHTTPJavaScript]]

[[pl:XMLHTTP]]

[[pt:XMLHttpRequest]]

[[ro:XMLHttpRequest]]

[[ru:XMLHttpRequest]]

[[th:XMLHttpRequest]]

[[tr:XMLHttpRequest]]

[[uk:XMLHttpRequest]]

[[zh:XMLHTTP]]