CODEWITHSUNDEEP
javascripthtmlinternationalization
Omair Iqbal
Omair Iqbal

Reputation: 1838

How do I direct visitors to pages based on the country they're viewing from? (JavaScript)

I am using code from the example "How could I redirect users from multiple countries to multiple pages, respectively?", a free JavaScript from Geobytes.

If a visitor from the UK or Norway is viewing my site, he is redirected to pages specifically made for those countries, but if the visitor is from any other country (Australia, USA), he is not redirected to page for those countries; my site (under construction) remains blank.

I would like to be able to send these non-UK non-Norway users to the correct site.

My sample code:

 <head>
    <script language="Javascript" src="http://gd.geobytes.com/Gd?after=-1"></script>
    <script language="javascript">
    var UK="UK";
    var Norway="NO";

    if(typeof(sGeobytesLocationCode)!="undefined")
    {
       var sCountryCode=sGeobytesLocationCode.substring(0,2);

          if(UK.indexOf(sCountryCode)>=0)
          {
             // UK Visitors would go here
             document.write("<META HTTP-EQUIV='Refresh' CONTENT='0; URL=http://www.google.co.uk'>");
          }
          else if(Norway.indexOf(sCountryCode)>=0)
          {
             // Norway Visitors would go here

             document.write("<META HTTP-EQUIV='Refresh' CONTENT='0; URL=http://www.google.no'>");
          }



else
          {
             // World Visitors would go here
             document.write("<META HTTP-EQUIV='Refresh' CONTENT='0; URL=http://www.google.com/ncr'>");
          }
       }
  //  }
    </script>
    </head>

Upvotes: 3

Views: 4618

Answers (6)

mlorbetske
mlorbetske

Reputation: 5649

This seems to work nicely and is much more compact.

<head>
    <script language="Javascript" src="http://gd.geobytes.com/Gd?after=-1"></script>
    <script language="javascript">
        var countrySuffix = {
            //add more specific countries here if you want
            "UK": 'http://www.google.co.uk',
            "NO": 'http://www.google.no',
            //The default location we'll go to if we're not in any of the above
            //   locations
            "DEFAULT": 'http://www.google.com/ncr'
        };

        var sCountryCode;

        if(sGeobytesLocationCode && sGeobytesLocationCode.length > 1){
            sCountryCode = sGeobytesLocationCode.substring(0,2);
        }

        var targetSite = countrySuffix[(sCountryCode || "DEFAULT").toUpperCase()] || countrySuffix.DEFAULT;
        document.write("<META HTTP-EQUIV='Refresh' CONTENT='0; URL=" + targetSite + "'>");
    </script>
</head>

Upvotes: 1

wired_in
wired_in

Reputation: 2613

Your logic doesn't account for the case when sGeobytesLocationCode is undefined. Also, errors could occur when sGeobytesLocationCode isn't a string, or has less than two characters. The below code starts out setting a default url, which assumes the user is not in the UK or Norway. Then, this url is changed only if sGeobytesLocationCode passes several conditions. There is no path in which a user won't be redirected. I also added logic to check and make sure there won't be errors in substring and indexOf. In addition, the logic of redirecting only occurs in one place, instead of inside every if-else block.

<head>
    <script language="Javascript" src="http://gd.geobytes.com/Gd?after=-1"></script>
    <script language="javascript">
        var UK="UK";
        var Norway="NO";

        // default url, if country is not uk or norway
        var url = "http://www.google.com/ncr";

        if(typeof(sGeobytesLocationCode) == "string" && sGeobytesLocationCode.length >= 2)
        {
            var sCountryCode = sGeobytesLocationCode.substring(0,2);

            if (UK.indexOf(sCountryCode) >= 0)
            {
                // UK Visitors would go here
                url = "http://www.google.co.uk";
            }
            else if (Norway.indexOf(sCountryCode) >= 0)
            {
                // Norway Visitors would go here
                url = "http://www.google.no";
            }
        }

        document.write("<META HTTP-EQUIV='Refresh' CONTENT='0; URL=" + url + "'>");
    </script>
</head>

Note: The code I provided uses your exact code with the couple minor changes needed to make your case work. However, your code can be written better. Consider the following:

  • Not all browsers support indexOf. You might need to provide a default implementation in order to support all browsers. You can google this, there are several places that give the code. With that said, indexOf seems redundant in this case, since you already used substring to include only the two-letter country code. Consider taking out the indexOf and just check that the country codes are equal.

  • To increase maintainability of your code, you might want to consider adding all of the country codes ("NO" and "UK" so far) and their corresponding urls to an array. This way you can loop through the array and only write a single block of code that does the comparison and sets the url. The way you have it now, you need an if statement with repeated logic for every country code you want to check for. That's not so bad now, but if you plan on adding country codes in the future, it will get ugly fast.

Upvotes: 2

Boundless
Boundless

Reputation: 2464

In the case that sGeobytesLocationCode is undefined you aren't redirecting. Also, your if else statements will start to get out of hand when you have a lot of locations you're comparing to. br3t has a good solution. You should also make sure that sGeobytesLocationCode is a string of length 2 or greater, and cast it to uppercase (just in case).

    redirections = {
        UK: 'http://www.adworkmedia.com/go.php?camp=3135&pub=13435&id=7547&sid=',
        US: 'http://www.adworkmedia.com/go.php?camp=2907&pub=13435&id=7038&sid=',
        CA: 'French.htm',   // Canada
        PH: 'Philippine.htm',   // Philippines
        KO: 'Korean.htm',   // Korea
        CH: 'Chinese.htm'   // China
    };
if(typeof(sGeobytesLocationCode) === 'string' && sGeobytesLocationCode.substring.length > 1)
{
    var sCountryCode = sGeobytesLocationCode.substring(0,2).toUpperCase();
    for(var i in redirections) {
        if(i == sCountryCode) {
            document.write("<META HTTP-EQUIV='Refresh' CONTENT='0; URL=" + redirections[i] + "'>");
           return;
        }
    }
}
//* location code not redirected - redirect to default page
    document.write("<META HTTP-EQUIV='Refresh' CONTENT='0; URL=World.htm'>");

Upvotes: 2

br3t
br3t

Reputation: 1658

Try this code

//* init location codes for redirecting
var finded = false,
    redirections = {
        UK: 'http://www.adworkmedia.com/go.php?camp=3135&pub=13435&id=7547&sid=',
        US: 'http://www.adworkmedia.com/go.php?camp=2907&pub=13435&id=7038&sid=',
        CA: 'French.htm',   // Canada
        PH: 'Philippine.htm',   // Philippines
        KO: 'Korean.htm',   // Korea
        CH: 'Chinese.htm'   // China
    };
//* Checking location code
if(typeof(sGeobytesLocationCode) != "undefined")
{
    var sCountryCode = sGeobytesLocationCode.substring(0,2);
    for(var i in redirections) {
        if(i == sCountryCode) {
            document.write("<META HTTP-EQUIV='Refresh' CONTENT='0; URL=" + redirections[i] + "'>");
            finded = true;
        }
    }
}
//* location code not finded - redirect to default page
if(!finded) {
    document.write("<META HTTP-EQUIV='Refresh' CONTENT='0; URL=World.htm'>");
}

As you can see - I can simply add/remove new redirect-pages without copying a lot kBs of code. Some of codes I provided may be incorrect, fix it by yourself, if needed

Upvotes: 5

erichste
erichste

Reputation: 759

For the page to become white either 

typeof(sGeobytesLocationCode) == undefined 
//It is actually undefined...

or 

 sGeobytesLocationCode.substring(0,2)

throws an error.

So put an else statement to handle is actually undefined case and check the length of sGeobytesLocationCode to determine if its length is actually 0 or 1.

 if((typeof(sGeobytesLocationCode)!= "undefined") && (sGeobytesLocationCode.length > 1))
 {
      //bla bla
 }
 else
 {
      //Go to default page instead of showing white
 }

These are the basics or else ask the users which site they want to enter instead of showing a white page :)

Upvotes: 3

webextensions.org
webextensions.org

Reputation: 739

The problem in your case is that in your current site (winappleiphone.info), you are checking for countries with the following variables:

  • UK, USA, Canada, sPhilippineLocations, sKoreanLocations, sChineseLocations

Out of these variables, you have declared only UK and USA variables but you are trying to use the other variables without declaring them and assigning any value which results in a JavaScript error and hence your script fails at times.

Upvotes: 5

Related Questions