I am having an issue with AJAX requests on mobile browsers (and iPads, etc) but it works fine on desktop computers. I am at a complete loss to work out what's wrong here.
var xmlhttp;
if(window.XMLHttpRequest){
xmlhttp = new XMLHttpRequest();
}else{
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange = function(){
if (xmlhttp.readyState == XMLHttpRequest.DONE ){
if(xmlhttp.status == 200){
console.log(xmlhttp.responseText);
}else{
alert("STATUS "+xmlhttp.status);
}
}
}
xmlhttp.open("GET","http://www.mywebsite.co.uk/assets/php/upvote.php?id="+id,true);
xmlhttp.send();
I've also tried: xmlhttp.open("GET","/assets/php/upvote.php?id="+id,true);
and xmlhttp.open("GET","../php/upvote.php?id="+id,true);
All three of which work on a desktop computer (console logs a success message) but on mobile devices it alerts "STATUS 0".
I can't work out why this works fine on desktops but xmlhttp.status
is 0
on mobiles.
OK, thanks for all your help!
I loaded up iOS Safari DevTools and watched the console. I was getting a cross site scripting issue even though I'd changed my path to a '/assets/php/...'.
This is due to a .htaccess file forcing all traffic through 'www.' but it wasn't acting on both directories that my initial webpage and my AJAX files were in (so some path did and some paths didn't have 'www.').
I've updated my .htaccess (which for some reason wasn't acting on iOS Safari requests only desktop Chrome ones) and now it works fine!