Develop Reference

Random jquery ajax error readyState=0

I have a web application that uses jQuery ajax to get some data. In this site I also have a Logger that reports to me when an error happens.
Very frequently I get this error on ajax calls:
{"readyState":0,"responseText":"","status":0,"statusText":"error"}
The problem is that this error is randomly and I'm not able to reproduce it. I get this for all ajax scripts. The request is made on same origin and at the server I've defined "Access-Control-Allow-Origin", "*".
All browsers get this error:
Safari 9
Chrome
Internet explore 11
etc...
The jQuery ajax code:
$.ajax({
url: 'MyUrl',
type: 'POST',
dataType: "json",
data: {dataVars},
error: function(response, ajaxOptions, thrownError) {
log.error( 'StringError: ' + ajaxOptions + '\n\nthrownError: ' + JSON.stringify(thrownError) + '\n\nResponse: ' + JSON.stringify(response));
},
success: function(res){
}
});
The request is performed to a servlet. What could be the problem?

From W3schools:
readyState=0
Means that the request isn't sent. (your broswer isn't connected to the targeted server).
It's mean that the socket is not opened : no TCP handshake, so the targeted URL is just not reached...
So check the validity of myUrl (is it a good domain? no cross-origin), and also connectivity of the client (proxy? if myUrl is secured / use an other port, maybe it is just not opened...)
I think the issue might be on server side, if it is random. but especially for myUrl, if you can get the web page anyway...
But the error is strange, if it comes from the same server!
Anyway, I think it is because the connection between your client and the targeted server is unstable, so maybe you can try to inscrease the timeout of the request, or retry it on error (example with recursive loop):
var remainingRetry = 3; //or something else
function handleRequest()
{
$.ajax({
url: 'MyUrl',
type: 'POST',
dataType: "json",
data: {dataVars},
error: function(response, ajaxOptions, thrownError) {
if (remainingRetry)
 {
remainingRetry--;
setTimeout(handleRequest, 1000); //timeout between two tries
}
else log.error( 'StringError: ' + ajaxOptions + '\n\nthrownError: ' + JSON.stringify(thrownError) + '\n\nResponse: ' + JSON.stringify(response));
},
success: function(res){
}
});
}

I had the same issue before and in my case the problem was
that other js function redirecting to another page before my first request has a chance to complete which is practically canceling or killing my request
some thing like
function redirectToAnotherPageFn () {
window.location = "/otherpage.html";
};

Ajax call fails in Chrome, but works in Firefox

Any idea why the following Ajax call fails in Chrome, but not Firefox?
$.ajax({
type: "GET",
contentType: "text/csv; charset=utf-8",
dataType: "text",
cache: false,
url: "http://127.0.0.1:8080/param1/param2?param3=csv&otherParams=type1,type2,type3"
})
.done(function(data) {
console.debug("Data received from ajax call: " + data);
})
.fail(function(jqXHR, textStatus, errorThrown) {
console.error("Data request failed (" + textStatus + "): " + errorThrown);
console.debug(jqXHR.responseText);
});
The URL that I am calling should return the data in csv format. I'm using jQuery 1.8.2. This works in Firefox, but not Chrome for some reason. The error message that I print out is:
Data request failed (text/csv): text/csv
Interestingly, in Chrome I can see the data returned in the jqXHR.responseText, so I can't figure out why it's throwing an error. I assume it has something to do with my not specifying the csv format properly, but I thought setting the dataType or contentType would fix that. What am I missing?
I realize this is a common problem, but in spite of my Googling and searching around Stack Overflow, I have been unable to find a solution that fixes this problem for me. All the suggestions I've found have said to set the contentType, the dataType, or the cache to false. As you can see, none of these solutions has worked for me. Your help is greatly appreciated!

Download JSON file via JavaScript/JQuery - HTTP-Status Ok - JQuery Error

I've got the following problem: I need to download a JSON file from an API via JQuery / JavaScript. In theory this should be quite basic.
I tried $.ajax and all of its siblings like $.get or $.getJSON. I alway get an 200 OK but my Firebug reports an error. Printing the error just says: "error" - so not that helful.
I read that maybe the JSON file is corrupt. So I tried it with a plain text file (*.txt). Same result.
The JSON file is valid, I check it against a validator.
I also tried ContentType and dateType and experimented with json and jsonp...
I basically used something like this (with a million variations for testing purposes):
$.ajax({
url: 'http://www.myurl.com/api/v1/myfile.json',
...
success: function(data) {
console.log(data);
},
error: function(error) {
console.log(error.statusText);
}
});
Am I missing something important here? It's really odd that nothing seems to change the behavior of the AJAX-call.
In fact I don't really need AJAX because I need to grab the JSON file when loading the page...
And the JSON file is not on the same domain as the AJAX caller.

Is that URL located on the same server you're trying to get the data from?
If not, you ran into a cross-domain request, which can only be handled using JSONP. So, the JSON file itself must be compatible with JSONP format, otherwise jQuery won't be able to process it (even if you provide a 'jsonp' dataType).
P.S.: Firebug will always show response code 200 but give an empty response body for such requests

Try in this way by disabling security
$.ajax( {
type : 'GET',
contentType : "application/json; charset=utf-8",
url : surl, \\specify your url
async : false,
dataType : 'json',
headers : {
Accept : "application/json",
"Access-Control-Allow-Origin" : "*"
},
crossDomain : true,
success : SucceedFunc,
error : function(data, textStatus, errorThrown) {
console.log("error" + ' ' + JSON.stringify(data) + ' ' + textStatus + ' ' + errorThrown);
}
});
function SucceedFunc(data) {
alert("success");
}
}

Did you try to catch the error the correct way?
$.ajax({
url: 'http://www.myurl.com/api/v1/myfile.json',
success: function(data) {
console.log(data);
},
error: function(error) {
console.log(error.message);
}
});

If you are using chrome go to cmd prompt and run the chrome by disabling the security. You can disable security using pathwhere_chrome_is_located\chrome.exe --disable-web-security
and run the html page. I think this may help you.

Jquery cross site Ajax call with 302 success data undefined with datatype script otherwise return error

I'm using JQuery 1.7.2, trying to do a cross site Ajax request which should return a html page via 4 redirects.
Not my ideal world with all those redirects, but it's part of the specification.
Now, using the following code:
$.ajax({
type: "GET",
url: myUrl,
dataType: "script",
success: function(data) {
alert("success :"+ data);
},
error: function(jqXHR, textStatus, errorThrown) {
alert("revoke: "+textStatus + ' / ' + errorThrown+"/"+jqXHR.status);
},
complete: function(jqXHR, textStatus){
alert("complete : "+jqXHR.statusText + ": "+jqXHR.readyState);
}
});
I can see in Firebug/Safari Developer Tools, that all the redirects work (e.g. returns a 302 status with a Location header).
Then the strange thing happens: At the last page, which returns a 200 status, my script ends and I try to view the data coming back. But the output is just "Undefined".
I agree on that I should not expect a script datatype when trying to get a html page, but when I tried with all the other datatypes (as defined in the jquery ajax page), the error handler is envoked and the status code is 0. All the while, in Safari DT, the status after the first redirect is just set as "(canceled)" (all the while the request just for the second redirect page just hangs in Firebug - but I'm just guessing that it has to do with their different implementation).
When I receive a 200 status, I can see in the debuggers that the last page has a size of some 18kb, which means that there should be some sort of data in it.
what to do?

You can't redirect with AJAX, you can only send and get data to and from the server.
For a redirection you have to use a "regular" HTTP request.
It can also be done with javascript window.location = myUrl

Mobile Safari disables ajax function in iOS 5

I have a mobile app running on jQuery Mobile/PhoneGap, and in iOS 5-only my ajax callback stops firing after a while. I'm using jQuery's $.ajax function, and here are some of the error messages I've got:
textStatus = parsererror
errorThrown = undefined was not called
In the second error above 'undefined' is my callback function. My question is, does Mobile Safari disable functions after a while if too many errors are thrown?
My guess as to what's occurring is that when a mobile device's connection is too slow, the JSON file I'm grabbing (214K) makes the AJAX call last too long (> 10s?), and Mobile Safari cancels the AJAX call. Then, after X number of cancelled AJAX calls, it seems like Mobile Safari disables the callback function completely.
Anyone else with similar behavior?

I use $.ajax often and have not experienced this problem. I suggest setting timeout to 50000 for a slow connection. To see the error, somewhere in your html add:
<div id='text1'>No Error yet...</div>
and timeout parameter would be added similar to:
$.ajax({
type: "GET",
url: "yourpage.html",
async: true,
cache: false,
timeout:5000,
success: function(data){
//something with the data
},
error: function(XMLHttpRequest, textStatus, errorThrown){
$("#text1").text("Comet Timeout ERROR: " + textStatus + " (" + errorThrown + ")");
},
});