navigator.language isn't reliable as one of your linked questions states.
The reason this is asked a lot, but you're still searching says something about the problem. That language detection purely on the client side is not anything close to reliable.
First of all language preferences should only be used to detect language preferences - i.e. not location. My browser is set to en_US, because I wanted the English version. But I'm in the UK, so would have to alter this to en_GB to have my country detected via my browser settings. As the 'customer' that's not my problem. That's fine for language, but no good if all the prices on your site are in $USD.
To detect language you really do need access to a server side script. If you're not a back end dev and want to do as much as possible on the client side (as your question), all you need is a one line PHP script that echos back the Accept-Language header. At its simplest it could just be:
<?php
echo $_SERVER['HTTP_ACCEPT_LANGUAGE'];
// e.g. "en-US,en;q=0.8"
You could get this via Ajax and parse the text response client side, e.g (using jQuery):
$.ajax( { url: 'script.php', success: function(raw){
var prefs = raw.split(',');
// process language codes ....
} } );
If you were able to generate your HTML via a back end, you could avoid using Ajax completely by simply printing the language preferences into your page, e.g.
<script>
var prefs = <?php echo json_encode($_SERVER['HTTP_ACCEPT_LANGUAGE'])?>;
</script>
If you had no access to the server but could get a script onto another server, a simple JSONP service would look like:
<?php
$prefs = $_SERVER['HTTP_ACCEPT_LANGUAGE'];
$jsonp = 'myCallback('.json_encode($prefs).')';
header('Content-Type: application/json; charset=UTF-8', true );
header('Content-Length: '.strlen($jsonp), true );
echo $jsonp;
Using jQuery for your Ajax you'd do something like:
function myCallback( raw ){
var prefs = raw.split(',');
// process language codes ....
}
$.ajax( {
url: 'http://some.domain/script.php',
dataType: 'jsonp'
} );
Country detection is another matter. On the client side there is navigator.geolocation, but it will most likely prompt your user for permission, so no good for a seamless user experience.
To do invisibly, you're limited to geo IP detection. By the same token as above, don't use language to imply country either.
To do country detection on the client side, you'll also need a back end service in order to get the client IP address and access a database of IP/location mappings. Maxmind's GeoIP2 JavaScript client appears to wrap this all up in a client-side bundle for you, so you won't need your own server (although I'm sure it will use a remote jsonp service). There's also freegeoip.net, which is probably less hassle than MaxMind in terms of signing up, and it appears to be open source too.
