I'm using XMLHttpRequest
in JavaScript. However, it gives me an error, and I don't know what my problem is.
I have to parse an XML file and assign its contents to the webpage - here's my code:
<script = "text/javascript"> 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. } </script>
My XML file is inside the same directory.
<question> <query>what is 2+2?</query> <option>4</option> <option>5</option> <option>3</option> <answer>4</answer> </question>
Just for reference, I typically program in C# or Java, and I'm running my website on Google Chrome.
To Solve Flutter Web getting 'XMLHttpRequest' error while making HTTP call Error Most cases of this error just add Access-Control-Allow-Origin value in the header might resolve the issue. Just make sure to replace all Underscore by Dash.
Many pages send AJAX requests to a server. Because this relies on the cooperation of the server and the network between the client and the server, you can expect these AJAX errors: Your JavaScript program receives an error response instead of data; Your program has to wait too long for the response.
XHR is the XMLHttpRequest Object which interacts with the server. Ajax technique in the nutshell leverages the XHR request to send and receive data from the webserver. This object is provided by the browser's javascript environment. It transfers the data between the web browser and server.
XMLHTTPRequest object is an API which is used for fetching data from the server. XMLHTTPRequest is basically used in Ajax programming. It retrieve any type of data such as json, xml, text etc. It request for data in background and update the page without reloading page on client side.
So there might be a few things wrong here.
First start by reading how to use XMLHttpRequest.open()
because there's a third optional parameter for specifying whether to make an asynchronous request, defaulting to true. That means you're making an asynchronous request and need to specify a callback function before you do the send()
. Here's an example from 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);
Second, since you're getting a 101 error, you might use the wrong URL. So make sure that the URL you're making the request with is correct. Also, make sure that your server is capable of serving your quiz.xml
file.
You'll probably have to debug by simplifying/narrowing down where the problem is. So I'd start by making an easy synchronous request so you don't have to worry about the callback function. So here's another example from MDN for making a synchronous request:
var request = new XMLHttpRequest(); request.open('GET', 'file:///home/user/file.json', false); request.send(null); if (request.status == 0) console.log(request.responseText);
Also, if you're just starting out with Javascript, you could refer to MDN for Javascript API documentation/examples/tutorials.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With