XMLHttpRequest status 4 but responseText is empty

Question

I am trying to write a google ads like javaScript plugin. I can not use jQuery ajax as it should be working fine for all sites. Here is my JavaScript code.

var ajaxRequest;  // The variable that makes Ajax possible!

try{
    // Opera 8.0+, Firefox, Safari
    ajaxRequest = new XMLHttpRequest();
} catch (e){
    // Internet Explorer Browsers
    try{
        ajaxRequest = new ActiveXObject("Msxml2.XMLHTTP");
    } catch (e) {
        try{
            ajaxRequest = new ActiveXObject("Microsoft.XMLHTTP");
        } catch (e){
            // Something went wrong
            alert("Your browser broke!");
            return false;
        }
    }
}
// Create a function that will receive data sent from the server
ajaxRequest.onreadystatechange = function(){
    if(ajaxRequest.readyState == 4){
        alert( ajaxRequest.responseText);
        console.log('xhr',ajaxRequest)
    } else {
        //alert(ajaxRequest.readyState);
        //alert(ajaxRequest.responseText);
    }
}
    var project_path = "http://www.domainname.com/"; //for stackoverflow, using right path in live code.
var req_url = project_path + "ads/verifypublisher/";
ajaxRequest.open("GET", req_url, true);
ajaxRequest.send(null); 

And here is how my PHP file looks like,

echo("<b>hi:</b> ");
exit();

Yes, thats all i have there. Still responseText is empty. What am i missing here?

Answer 1

警报（req_url）应显示错误的URL“ http：//www.domainname.comads/verifypublisher/ ”

Answer 2

It's better to make sure the status code is 200 before doing anything with the response. Then you can spot problems earlier.

Answer 3

try this in my test it work in most of browser

var responseText=function(e,doing){
                     if (e.readyState== 4) {
                           if(doing)doing(e);
                           return(e.responseText);              
                     };
                     if (e.readyState == 200) { 
                           if(doing)doing(e);               
                           return(e.responseText);

                     };
                     return false;                   
};
function  loadXMLPostDocf(url,method,posData,uploadProgress,uploadComplete,uploadFailed,uploadCanceled,statechange,CallBackOnSend) {
   var arrSignatures = ["MSXML2.XMLHTTP.5.0", "MSXML2.XMLHTTP.4.0","MSXML2.XMLHTTP.3.0", "MSXML2.XMLHTTP","Microsoft.XMLHTTP"];
// branch for native XMLHttpRequest object
if (window.XMLHttpRequest && checkVersion()) {
    pos = new XMLHttpRequest(); 
    pos.open(method, url, true);
    //pos.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
    if(statechange!=''){pos.onreadystatechange = statechange;};
    try{
      if(uploadProgress!='')if(pos.upload){
          pos.upload.addEventListener("progress", uploadProgress, true);
      }else{
          pos.addEventListener("progress", uploadProgress, true);
      }
      if(uploadComplete!='')pos.addEventListener("load", uploadComplete, false);
      if(uploadFailed!='')pos.addEventListener("error", uploadFailed, false);
      if(uploadCanceled!='')pos.addEventListener("abort", uploadCanceled, false);
    }catch(e){

    }

    pos.send(posData);
    if(CallBackOnSend)CallBackOnSend(pos);
    //console.log(pos.abort());
// branch for IE/Windows ActiveX version
} else if (window.ActiveXObject) {  
         for (var i=0; i < arrSignatures.length; i++) {
                    try {
                        pos = new ActiveXObject(arrSignatures[i]);

                    } catch (oError) {
                        //ignore
                    };
          };
    if (pos) {
        pos.open(method, url, false);
        //pos.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
        if(!statechange){pos.onreadystatechange = statechange;};
        if(!uploadComplete){pos.onreadystatechange = uploadComplete;};
       // if(uploadProgress!='')pos.upload.addEventListener("progress", uploadProgress, true);
        //if(uploadComplete!='')pos.addEventListener("load", uploadComplete, false);
        //if(uploadFailed!='')pos.addEventListener("error", uploadFailed, false);
        //if(uploadCanceled!='')pos.addEventListener("abort", uploadCanceled, false);
        pos.send(posData);
        if(CallBackOnSend)CallBackOnSend(pos);
    };   
 };
 return(pos);
};

sample:

 var complete=function(e){
    var Body=responseText(e.target);
    console.log(Body);
};
var uploadProgress=function(evt){

};
var uploadComplete=function(evt){
    if(evt.target.status==200 || evt.target.status==304){
      var Body=responseText(evt.target);
      console.log(Body);
    }else{
        return false;
    };
};
var uploadFailed=function(evt){

};
var uploadCanceled=function(evt){

};
var CallBackOnSend=function(evt){

};
loadXMLPostDocf("http://domain.com/index.php","GET",null,uploadProgress,uploadComplete,uploadFailed,uploadCanceled,complete,CallBackOnSend);

Answer 4

My problem similar to this was solved by checking my html code. I was having an onclick handler in my form submit button to a method. like this : onclick="sendFalconRequestWithHeaders()" . This method in turn calls ajax just like yours, and does what I want. But not as expected, my browser was returning nothing.

Learned From someone's hardwork , I have returned false in this handler, and solved. Let me mention that before arriving to this post, I have spent a whole 3-day weekend and a half day in office writing code implementing CORS filters , jetty config , other jersey and embedded jetty related stuff - just to fix this., revolving all my understanding around cross domain ajax requests and standards stuff. It was ridiculous how simple mistakes in javascript make you dumb.

Now I have to clean my code to submit git patch cleanly. Thanks to that someone.