How to redirect user to different page?

Question

I need to make to redirect the user to another page, in accordance to the language of the browser. For example: if the language of the browser english redirect to site.com/en/.

I try to do like this:

$(document).ready(function () {
    var userLang = navigator.language || navigator.userLanguage;

    switch (userLang) {
        case 'en':
            window.location.href = window.location.origin + '/en';
            break;
        case 'de':
            window.location.href = window.location.origin + '/de';
            break;
        default:
            break;
    }
});

It's works but the page is constantly reloaded. How to solve it or prompt another solution?

inside the default case log the value of userLang and correct the cases based on that value. — Vanojx1
– Vanojx1, Commented Oct 5, 2015 at 9:56
OP, as an aside, I wouldn't endeavor to do this on the client at all. This should be done on the server. — user1017882
– user1017882, Commented Oct 5, 2015 at 9:56

Curtis · Accepted Answer · 2015-10-05 09:55:23Z

4

The page is constantly reloaded as you're not checking whether the user is already on the correct language site.

On your pages you could store a javascript variable for the pages language produced server-side. For example:

var thisLanguage = 'en';

Then change your javascript logic to take this into account and only apply the redirect if the user's language is different to thisLanguage:

$(document).ready(function () {
    var userLang = navigator.language || navigator.userLanguage;

    if (userLang != thisLanguage){

       switch (userLang) {
           case 'en':
               window.location.href = window.location.origin + '/en';
               break;
           case 'de':
               window.location.href = window.location.origin + '/de';
               break;
           default:
               break;
       }

    }
});

edited Oct 5, 2015 at 9:55

answered Oct 5, 2015 at 9:50

Curtis

104k69 gold badges280 silver badges359 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

user1017882 Over a year ago

When it's de, it'll hit the switch, redirect to /de, then it'll reload the page, and do the same again. It'll still loop. And what's the point in your first case? It'll never hit that first case.

Hacketo Over a year ago

@JayMee that's why thisLanguage depends on server side construction

Curtis Over a year ago

On the /de page there will be a variable of var userLanguage = 'de' and therefore this will match the current userLang and won't redirect. Am I missing something?

user1017882 Over a year ago

You've just edited it to add 'produced server-side', it now makes sense. That wasn't clear in the first instance so I thought you meant you were hard-coding en.

user1017882 Over a year ago

The fact you've suggested a server-side implementation (of sorts) gets my upvote. This shouldn't be done solely on the client.

slomek · Accepted Answer · 2015-10-05 09:58:01Z

I think you should detect the language by reading it from the URL, since you want to redirect the users to appropriate URL:

$(document).ready(function () {

    var languageSuffix = window.location.pathname;
    if(languageSuffix !== '/') {
        return;
    }

    var userLang = navigator.language || navigator.userLanguage;

    switch (languageSuffix) {
        case '/en':
            window.location.href = window.location.origin + '/en';
            break;
        case '/de':
            window.location.href = window.location.origin + '/de';
            break;
       default:
            break;
    }
});

Taleeb · Accepted Answer · 2015-10-05 09:59:14Z

We can check if the url is same as current url something like this:

$(document).ready(function () {
    var userLang = navigator.language || navigator.userLanguage;
    var urlToRedirect = '';

    switch (userLang) {
        case 'en':
            urlToRedirect = window.location.origin + '/en';
            break;
        case 'de':
            urlToRedirect = window.location.origin + '/de';
            break;
        default:
            break;
    }
    if(urlToRedirect!=='' && urlToRedirect!==window.location.href){
       window.location.href = urlToRedirect;
    }
});

Deepak Biswal · Accepted Answer · 2015-10-05 10:03:39Z

0

Try something like below:

$(document).ready(function () {
    var url = $(location).attr('href');
    var userLang = navigator.language || navigator.userLanguage;

    if(url.indexOf("/en") == -1 && userLang == 'en') {
        window.location.href = window.location.origin + '/en';
    } else if (url.indexOf("/de") == -1 && userLang == 'de'){
        window.location.href = window.location.origin + '/de';
    } else {
        // Do nothing
    }
});

answered Oct 5, 2015 at 10:03

Deepak Biswal

4,3302 gold badges22 silver badges37 bronze badges

Collectives™ on Stack Overflow

How to redirect user to different page?

4 Answers 4

5 Comments

Comments

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

5 Comments

Comments

Comments

Comments

Related