web-dev-qa-db-ja.com

JavaScriptを使用して訪問者の言語と国コードを取得します(クライアント側)

質問:訪問者の国/言語コードを取得するためのjavascript(クライアント側)コードはありますか?それは正確で、クロス「モダン」ブラウザです? 'en-US''sv-SE''nl-NL'などのような結果を探しています。

これに関連する質問は以前に聞かれました(SOリンク: 12 、、- 4 )、しかし、私は答えを見つけられませんでした、そして、答えのいくつかは古いものであり、いくつかのケースではさらに古い記事を参照しており、これには新しい解決策があると思います。

私は試した :

var language = window.navigator.userLanguage || window.navigator.language;
console.log(language);

firefoxの同じマシン、同じ場所でChromeと"sv"]で"en-GB"を取得しました.

29
Sergio

navigator.languageは、リンクされた質問の1つにあるように信頼できません。

これが頻繁に尋ねられる理由ですが、あなたはまだ検索している問題について何かを言います。クライアント側でのその言語検出purelyは、信頼性に近いものではありません。

まず第一に、言語設定は言語設定の検出にのみ使用する必要があります。つまり、場所ではありません。私は英語版が欲しかったので、私のブラウザはen_USに設定されています。しかし、私は英国にいるので、これをen_GBに変更して、ブラウザー設定で国を検出する必要があります。 「顧客」としてそれは私の問題ではありません。言語にはそれで問題ありませんが、サイトのすべての価格が米ドルになっている場合は役に立ちません。

言語を検出するには、サーバー側のスクリプトにアクセスする必要があります。バックエンド開発者ではなく、クライアント側で(質問として)できる限りのことをしたい場合、必要なのは1行だけPHPスクリプトをエコーバックする- Accept-Language header。最も単純な場合、次のようになります。

<?php
echo $_SERVER['HTTP_ACCEPT_LANGUAGE']; 
// e.g. "en-US,en;q=0.8"

Ajax経由でこれを取得し、テキスト応答クライアント側を解析できます(例:jQueryを使用):

$.ajax( { url: 'script.php', success: function(raw){
    var prefs = raw.split(',');
    // process language codes ....
} } );

バックエンドを介してHTMLを生成できた場合、ページに言語設定を印刷するだけで、Ajaxの使用を完全に回避できます。

<script>
    var prefs = <?php echo json_encode($_SERVER['HTTP_ACCEPT_LANGUAGE'])?>;
</script>

サーバーにアクセスできないが、別のサーバーにスクリプトを取得できる場合、単純なJSONPサービスは次のようになります。

<?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;

AjaxにjQueryを使用すると、次のようになります。

function myCallback( raw ){
    var prefs = raw.split(',');
    // process language codes ....
}
$.ajax( {
    url: 'http://some.domain/script.php',
    dataType: 'jsonp'
} );

国の検出は別の問題です。クライアント側には navigator.geolocation がありますが、おそらくユーザーに許可を求めるプロンプトが表示されるため、シームレスなユーザーエクスペリエンスには適していません。

目に見えないようにするには、ジオIP検出に限定されます。上記と同様に、言語を使用して国を暗示しないでください。

クライアント側で国を検出するには、クライアントIPアドレスを取得し、IP /ロケーションマッピングのデータベースにアクセスするためのバックエンドサービスも必要です。 MaxmindのGeoIP2 JavaScriptクライアント は、これをすべてクライアント側のバンドルでラップしているように見えるため、独自のサーバーは必要ありません(リモートjsonpサービスを使用することは確かです)。また、 freegeoip.net もあります。これは、サインアップの点でおそらくMaxMindよりも面倒ではなく、オープンソースでもあるようです。

23
Tim

JQueryを使用すると、この行にはユーザーの国コードが表示されます。

  $.getJSON('https://freegeoip.net/json/', function(result) {
    alert(result.country_code);
  });
43
Sean McClory

ipdata.co で国コードを取得する

この回答では、「テスト」APIキーを使用していますが、これは非常に限定されており、数回の呼び出しをテストするためだけのものです。 Signup 独自の無料APIキーの場合、開発のために毎日最大1500件のリクエストを受け取ります。

$.get("https://api.ipdata.co?api-key=test", function (response) {
    $("#response").html(response.country_code);
}, "jsonp");
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<pre id="response"></pre>
7
Jonathan