对于AJAX请求，XMLHttpRequest.status为“ 0”

Question

I am trying to create an app in Javascript that fetches data from a barcode database API ( http://upcdatabase.org/api ). When I make the AJAX requests, the GET requests are getting through to the API. I can see from the API's website how many requests I've made.

However, I am getting an XMLHttpRequest.status of "0" every time, on Firefox, Chrome, and Edge. I have a feeling I'm missing something since this is my first time doing this.

Here is the code I'm using:

var upc = prompt("Enter UPC Code:");

var requestUrl = "https://api.upcdatabase.org/product/" + upc + 
    "/73114EC2F9C47240583DBF3AA190CB4C";

function httpGetAsync(theUrl)
{
    var xmlHttp = new XMLHttpRequest();
    xmlHttp.onreadystatechange = function() { 
        if (xmlHttp.readyState == 4 && xmlHttp.status == 200)
            alert(xmlHttp.responseText);
    }
    xmlHttp.open("GET", theUrl, true);  
    xmlHttp.send();
    alert(xmlHttp.status);       
}

httpGetAsync(requestUrl);

Thanks to anyone who can help!

Answer 1

From the documentation :

Before the request is complete, the value of status will be 0.

The request isn't complete until readyState == 4 , so it's normal to see 0 if you log status before that test is successful. Try this:

function httpGetAsync(theUrl)
{
    var xmlHttp = new XMLHttpRequest();
    xmlHttp.onreadystatechange = function() { 
        if (xmlHttp.readyState == 4) {
            alert(xmlHttp.status);
            if (xmlHttp.status == 200) {
                alert(xmlHttp.responseText);
            }
        }
    };
    xmlHttp.open("GET", theUrl, true);  
    xmlHttp.send();
}