Errore XMLHttpRequest (Ajax)

Sto usando XMLHttpRequest in JavaScript. Tuttavia, mi dà un errore, e non so quale sia il mio problema.
Devo analizzare un file XML e assegnarne il contenuto alla pagina web: ecco il mio codice:

  window.onload = onPageLoad(); var questionNum = 0; function onPageLoad(questionNum) { var xmlhttp = new XMLHttpRequest(); xmlhttp.open("GET","quiz.xml"); try { xmlhttp.send(null); // Here a xmlhttprequestexception number 101 is thrown } catch(err) { document.getElementById("body").innerHTML += "\nXMLHttprequest error: " + err.description; // This prints "XMLHttprequest error: undefined" in the body. } xmlDoc = xmlhttp.responseXML; parser = new DOMParser(); // This code is untested as it does not run this far. }  

Il mio file XML si trova nella stessa directory.

  what is 2+2? 4 5 3 4  

Solo per riferimento, di solito programma in C # o Java e sto eseguendo il mio sito web su Google Chrome.

Quindi potrebbero esserci alcune cose sbagliate qui.

Innanzitutto, leggendo come utilizzare XMLHttpRequest.open() perché esiste un terzo parametro facoltativo per specificare se creare una richiesta asincrona, con impostazione predefinita true . Ciò significa che stai facendo una richiesta asincrona e devi specificare una funzione di callback prima di send() . Ecco un esempio di MDN :

 var oXHR = new XMLHttpRequest(); oXHR.open("GET", "http://www.mozilla.org/", true); oXHR.onreadystatechange = function (oEvent) { if (oXHR.readyState === 4) { if (oXHR.status === 200) { console.log(oXHR.responseText) } else { console.log("Error", oXHR.statusText); } } }; oXHR.send(null); 

In secondo luogo, poiché ricevi un errore 101, potresti utilizzare l’URL sbagliato. Assicurati quindi che l’URL con cui stai effettuando la richiesta sia corretto. Inoltre, assicurati che il tuo server sia in grado di servire il tuo file quiz.xml .

Probabilmente dovrai eseguire il debug semplificando / restringendo il punto in cui si trova il problema. Quindi inizierei facendo una richiesta sincrona facile in modo da non doversi preoccupare della funzione di callback. Quindi ecco un altro esempio da MDN per fare una richiesta sincrona:

 var request = new XMLHttpRequest(); request.open('GET', 'file:///home/user/file.json', false); request.send(null); if (request.status == 0) console.log(request.responseText); 

Inoltre, se hai appena iniziato con Javascript, puoi fare riferimento a MDN per la documentazione / gli esempi / tutorial delle API di Javascript.

Vedo 2 possibili problemi:

Problema 1

  • l’object XMLHTTPRequest non ha completato il caricamento dei dati nel momento in cui si sta tentando di utilizzarlo

Soluzione: assegnare una funzione di callback agli oggetti “onreadystatechange” -event e gestire i dati in quella funzione

 xmlhttp.onreadystatechange = callbackFunctionName; 

Una volta che lo stato ha raggiunto DONE (4), il contenuto della risposta è pronto per essere letto.

Problema 2

  • l’object XMLHTTPRequest non esiste in tutti i browser (con quel nome)

Soluzione: utilizzare un try-catch per creare l’object corretto per il browser corretto (ActiveXObject in IE) o utilizzare un framework, ad esempio il metodo jQuery ajax

Nota: se si decide di utilizzare il metodo jQuery ajax, si assegna la funzione callback con jqXHR.done ()

È probabile che il problema risieda nella linea:

 window.onload = onPageLoad(); 

Includendo le parentesi che stai dicendo, l’ onload dovrebbe essere uguale al valore di ritorno di onPageLoad() . Per esempio:

 /*Example function*/ function onPageLoad() { return "science"; } /*Set on load*/ window.onload = onPageLoad() 

Se stampi il valore di window.onload alla console sarà:

scienza

La soluzione è rimuovere le parentesi:

 window.onload = onPageLoad; 

Quindi, stai usando onPageLoad come riferimento alla cosiddetta funzione.

Infine, per ottenere il valore della risposta è necessario un listener readystatechange per l’object XMLHttpRequest , poiché è asincrono:

 xmlDoc = xmlhttp.responseXML; parser = new DOMParser(); // This code is untested as it doesn't run this far. 

Qui aggiungi l’ascoltatore:

 xmlHttp.onreadystatechange = function() { if(this.readyState == 4) { // Do something } }