XMLHttpRequest异步不起作用xmlhttp.status == 0

Question

I am working on a project in which i need to fetch data from php page and display it on the server .

     var xmlhttp;
                     var jsonResponse="";
                    window.onload=function()
                    { 
                        xmlhttp = new XMLHttpRequest();
                        xmlhttp.open("GET","http://www.ilexsquare.com/EC/menu.php",true);
                        xmlhttp.send();
                        xmlhttp.onreadystatechange=dataReturn;
                    }
                    function dataReturn()
                    {

                        if(xmlhttp.readyState== 4 && xmlhttp.status==200)
                        {
                             jsonResponse = xmlhttp.responseText;
                           getData();
                        }

                    }
                    function getData()
                    {                 
                    json = jsonResponse;

    console.log(json);
    var jsobject = JSON.parse(json);
    console.log(jsobject);
       console.log(jsobject.products.length);
       var html="";
    for(var i = 0; i < jsobject.products.length; i++){ 
 html += '<a class="submenu-item" href="http://www.ilexsquare.com/EC/productpage/index-left1.html?id=' + jsobject.products[i].menuid + '" >'; 
        html += '<i class="fa fa-angle-right"></i><em>  ' + jsobject.products[i].name;     
        html += '</em><i class="fa fa-circle"></i></a>';

    }
          $("#submenu").html(html);
          $("#count").html(jsobject.products.length);
         jsonString = JSON.stringify(obj);
                    }

where is my php page is returning data in json format .in this xmlhttp.status is always returning 0 . i dont know what is the issue .. please help

Answer 1

This is related to Cross Origin Policy.

Consider the following:

xmlhttp = new XMLHttpRequest();
xmlhttp.open("GET","http://www.ilexsquare.com/EC/menu.php",true);
xmlhttp.send();

XMLHttpRequest cannot load http://www.ilexsquare.com/EC/menu.php . No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin ' http://stackoverflow.com ' is therefore not allowed access.

There is a great resources on enabling this on your server if you want to use CORS at http://enable-cors.org/server.html

The header Access-Control-Allow-Origin: * needs to be sent back as a response.

This could be as simple as adding header("Access-Control-Allow-Origin: *"); to the top of that PHP page.