俺の雑記帳

My random memorandumです。(つまり、個人的な備忘録であり、その点ご容赦を。)

JavaScriptで、ブラウザ言語や、環境(特にiOSかSafari)を判定する。

仕事で、
JavaScriptで、ブラウザに設定された言語の取得方法を調べて、
その後、SafariiOSなど、地域によっては、en に設定したつもりでも、en_US と _US が付いてしまうことへの対処のため、
SafariiOSなど、ブラウザ、プラットフォームの判別
を調べた。


以下は、2016/09/29 11:19のメールを最後にした、一連の俺メールの内容より、抜粋(&微修正)したもの。

ブラウザの言語取得について:(ただし、すでに、はてブで記録している内容)

javascriptでブラウザの言語設定を取得する - Qiita
などを参考にすると良いかと思います。

サンプルコードの前半が、ブラウザの最優先に設定されている言語だけを確認す
る、
後半が 複数の言語設定を全て取得する。

なるべくユーザーの設定を丁寧に拾っていくなら、後半のコードを用いて、
優先度の高い言語から、当社サイトに対応する言語があるまでチェックを繰り返
す、
というコードにするのが良いと思います。
しかし、取急ぎ面倒なら、前半のコードを用いれば良いかと思います。

いずれにせよ、PHPなどサーバーサイドで取得できる HTTP_ACCEPT_LANGUAGE は、ブラウザやOSによっては、クライアントサイド(JavaScript)では全く同一のものは取得できない。
iOS(Safari系全般?つまりWebKit??)は、en_US など、地域部分が大文字にならず、en_us となるので注意。
なお、新しい環境の傾向(?:iOSやWindows10 )としては、ブラウザ独自の言語設定は出来ない。

iOS判定:

iOSJavaScriptでの判定は、以下などが参考になります。(最初のURL以外は、私の備忘も兼ね、参考までに載せたものです。)
2015年版JavaScriptユーザエージェント判別・判定タブレットとモバイルの判定。(正確な内容 ※ 事後追記:ただし、下記の通り、大小文字は一部で区別した方がよさそう?
JavaScriptでUserAgentを使った判別をする _ cly7796.net (参:ブラウザの判定法も記載)
Javascriptでデバイスがiosかどうか判別 · GitHub (参:userAgentだけでなく、appVersionやplatformを使う方法もある。) ※ 事後追記:navigator.platformを使うのが本来の用法だろう。
UserAgentからOS_ブラウザなどの調べかたのまとめ - Qiita (User Agentに関する最も詳しいまとめ。)
PHPでOSやブラウザの情報を簡単に取得出来るライブラリ「php-browser-detector」 _ cupOF Interestsphp-browser-detector というPHPライブラリ。最新版のライブラリを使い続けることで、自分たちのコードをいじらなくて良いのは、良さそう。だが、iPodとかもなく、正確性(カバー範囲)に疑問。)

User Agentを使う方法は、JavaScriptPHPも 変わらなさそうですね。

iOS判別で、UserAgentを使うなら、iPad,iPod,など短い文字列での判定となるので、iOS判定だけは 大小文字を区別した方が良さそう。


ただ、また2,3年も経てば、変わるだろうから、調べなおす必要あり?