无法将PHP变量传递给jQuery

Question

I'm completely new to jQuery and trying to pass some PHP variables to Jquery. I'm using CORS to fetch JavaScript and PHP files from my webserver to my blog.

On my blog I want jQuery to GET a PHP file and echo the redirect header variables. Then I need JavaScript to get those variables and use them to make client side redirects. But I'm not sure how to do that, I've tried all day without success.

The PHP file on my server looks like this:

<?php
require_once('geoplugin.class.php');
$geoplugin = new geoPlugin();
$geoplugin->locate();
// create a variable for the country code
$var_country_code = $geoplugin->countryCode;
// redirect based on country code:
if ($var_country_code == "US") {
echo ('Location: http://www.adomain.com');
}
else if ($var_country_code == "CA") {
echo ('Location: http://www.adomain.com');
}
else if ($var_country_code == "UK") {
echo ('Location: http://www.adomain.com');
}
else if ($var_country_code == "AU") {
echo ('Location: hhttp://www.adomain.com');
}
else if ($var_country_code == "NZ") {
echo ('Location: http://www.adomain.com/');
}
else if ($var_country_code == "ZA") {
echo ('Location: http://www.adomain.com');
}
else {
echo ('Location: http://www.adomain.com');
}
?>

My jQuery requests is as following:

function loadDoc() {
var ajax = new XMLHttpRequest();
ajax.onreadystatechange = function() {
    if (ajax.readyState == 4 && ajax.status == 200) {
      "US" == x && US436(),
      "CA" == x && CA(),
      "UK" == x && UK(),
      "AU" == x && AU(),
      "NZ" == x && NZ(),
      "ZA" == x && ZA()
    }
};
ajax.open("GET", "//mydomain.com/scripts/redirect.php", true);
ajax.send();
}

loadDoc()

Oke so here is the code that I 'thought' should work. The jQuery script is making a request to my server to GET that redirect.php script. I then get the variables and convert them to functions. (right???)

I have another JavaScript file that's creating the functions to make the client side redirect which looks something like this:

function US() {
window.location.replace("http://adomain.com");
}

Okay, that's it. Let's hope I didn't forgot something here. But this is all the code I'm having right now. Like I said I'm trying really hard to wrap my head around this CORS since I never coded with jQuery before.

If anyone is able to tell me what the problem is that would be very much appreciated! Thanks in advance.

Answer 1

You're not using jQuery, you're using AJAX . They are different in principle. One is a JavaScript library and the other is a method of sending and retrieving data from the server.

The issue with your code is that you're trying to set header variables on the server and send them back to the client, in the hopes that it will redirect, but it won't. Here's what we need to do.

Return back the country code to the Browser from your server, like so:

<?php
require_once('geoplugin.class.php');
$geoplugin = new geoPlugin();
$geoplugin->locate();
// create a variable for the country code
return $geoplugin->countryCode;

Now in your javascript onreadystatechange callback, we can receive this value and make our comparison:

ajax.onreadystatechange = function() {
   if (ajax.readyState == 4 && ajax.status == 200) {
       var country_code = ajax.responseText;

       switch(country_code) {
           case 'US' :
               US();
               break;
           case 'UK' :
               UK();
               break;
           //so on and so forth

       }
   }
}

Hopefully this helps clear things up.