- 更新日: 2014年5月1日
- jQuery & JavaScript
JavaScript でブラウザの言語設定を取得
スポンサーリンク
HTTP_ACCEPT_LANGUAGE をクライアントサイドの JavaScript で取得することはできないので、代わりにブラウザ依存の Javascript コードでブラウザの言語設定を取得します。
【お知らせ】 英単語を画像イメージで楽に暗記できる辞書サイトを作りました。英語学習中の方は、ぜひご利用ください！
画像付き英語辞書 Imagict | 英単語をイメージで暗記スポンサーリンク
各ブラウザでの言語設定を取得するコード
|
1 2 3 4 5 6 7 8 9 10 |
// Internet Explorer window.navigator.userLanguage // Firefox, Opera, 他 window.navigator.language // Internet Explorer, Opera, 他 window.navigator.browserLanguage var language = window.navigator.userLanguage || window.navigator.language || window.navigator.browserLanguage; |
こんな感じのコードで取得できます。
私は Firefox 28.0 を使用していますが、window.navigator.language でブラウザの設定言語を取得できました。以下、Firefox 開発ツールのコンソールで試した結果。
|
1 2 3 4 5 6 7 8 |
> window.navigator.userLanguage undefined > window.navigator.browserLanguage undefined > window.navigator.language "ja" |
ブラウザの言語設定を en-US に変更した後試すと…
|
1 2 3 4 |
> window.navigator.language "en-US" |
ちゃんと取れてます。
日本語だったら ja を返し、それ以外なら en を返すコード
日本語と英語のみに対応した JavaScript のブックマークレットを作りたかったので、ja か en を返すコードを書きました。ブラウザの言語設定が日本語（ja）だったら ja を返し、それ以外だったら en を返すようにします。
|
1 |
var language = (window.navigator.userLanguage || window.navigator.language || window.navigator.browserLanguage).substr(0,2) == "ja" ? "ja" : "en"; |
substr で頭2文字を取得して判定。
上記 JavaScript で言語設定を取得するコードは、あくまでもブラウザで設定されている最優先のデフォルト言語1個を取得するので、Ruby や PHP などサーバーサイドで取得できる HTTP_ACCEPT_LANGUAGE の値（ブラウザが表示可能な言語一覧）とは値が異なる点には注意が必要です。
- – 参考リンク –
- javascript – How to detect user’s language – Stack Overflow
- ブラウザの言語をJavascriptから調べる。 | @masuidrive blog
スポンサーリンク
オライリーのJavaScritp本（通称サイ本）は、昔かなり読み込みました。
>> 次の記事 : ブックマークレットをいつでもJavaScriptのメンテが可能な状態で配布する
<< 前の記事 : Google 検索を便利にするブックマークレット3つ
- jQuery & JavaScript の関連記事
- React.js用にESLintをインストールして設定、JavaScriptコードを楽に検証しよう
- JavaScriptでHTMLコメント要素を取得する
- YahooのJavaScriptマップAPI(YOLP)で地図を描画
- HTML5のGeolocation APIで現在地の位置情報(緯度/経度)を取得するJavaScriptコード
- JavaScriptでキャメルケースを単語に分割
- Browserify + GulpでクライアントのJavaScript / CoffeeScriptでrequire
- JavaScript/jQueryでDOM要素が存在するか確認する方法
- JavaScriptでスクロールを一時的に止める
- JavaScriptでcapitalize、アルファベット一文字目を大文字にする
- JavaScriptでrangeオブジェクトから座標を取得するコード
- 2件のコメント
いつも勉強させていただいています。
ブラウザ言語によって自動的にページを切り替えるウェブサイトを作っているのですが、そのチェックのために毎回ブラウザの設定変更し直すのが手間で、なにかそうした環境設定を簡単に再現するツールなど使っておられますか?
mkw さん、コメントありがとうございます！
私は特にツール等は使っていませんが、調べたところちょっと設定変更が楽になりそうなブラウザ拡張機能を見つけました。
Chrome – Quick Language Switcher
https://chrome.google.com/webstore/detail/quick-language-switcher/pmjbhfmaphnpbehdanbjphdcniaelfie
Firefox – Quick Locale Switcher
https://addons.mozilla.org/ja/firefox/addon/quick-locale-switcher/
試してはいませんが、説明を見る限りメニューからすぐにブラウザ言語を切り替えることができそうです。
ブラウザの設定画面をたどって変更するよりは楽になるかもしれません。
以上ですが、よろしくお願いいたします＾＾