JavaScriptを書いていると、アプリの挙動やデザインの調整のためにユーザーが実行中の端末やブラウザの情報が知りたくなることが多々あります。
こんなときによく行われている方法の１つにwindow.navigator.userAgentを調べる方法があります。
この判定法だと、例えば
if(navigator.userAgent.indexOf('Android') > 0) {
// ユーザーがAndroid端末を使っている場合の処理
}
のように分岐処理が書けます。
しかし
上記の方法だと、残念ながら、実行環境が chromeアプリ なのか chromeブラウザ なのかまでは判別できません。*1chromeアプリでは外部画像の読み込みでXMLHttpRequest (XHR) を利用するなどブラウザでの処理方法と異なる点があり、これらも考慮したライブラリみたいなものをつくろうとすると、判別できないのは結構困るのです。
そこで考えてみました
chromeアプリにしか実装されていないオブジェクトがあるはずだ、と思い、consoleでいろいろ試し探してみました
ありました！！ chrome.app.windowの有無によって区別できそうです！*2
| Object | chrome以外のブラウザ | chromeブラウザ | chromeアプリ |
|---|---|---|---|
| chrome | No | Yes | Yes |
| chrome.app | No | Yes | Yes |
| chrome.app.window | No | No | Yes |
これをつかえば判定文は
if(chrome != undefined) {
if(chrome.app.window != undefined) {
// 「chrome アプリ」である
}else {
// 「chrome ブラウザ」である
}
}else {
// 「chrome以外のブラウザ」である
}
のように書けました。
あまり格好良い方法ではありませんがJavaScriptでchromeアプリとchromeブラウザの判別を実現できました。*3
