JavaScriptユーザエージェント判別・判定
Updated / Published
新しいFirefox OSやWindows Phoneを含めた2015年現在のユーザエージェントを判定し分岐処理を行う手順をご紹介します。OSや機種毎の処理を行っていくには、もはや無理がありますので、タブレットかスマートフォンかを判別することのみにフィーチャーしています。
ユーザエージェント情報に依存して、分岐処理を行うと、常に付きまとう悩みの種が新しいOSの登場です。今年もすでにauからFirefox OSを搭載したスマートフォンであるFx0が新たに登場し、次いで日本国内でもWindows Phoneが発売されることが決まっており、ユーザエージェント情報に依存して処理を行っている部分は相次いで見直しを迫られることになりますので、以下、ご参考に活用いただければと思います。
var _ua = (function(u){
return {
Tablet:(u.indexOf("windows") != -1 && u.indexOf("touch") != -1 && u.indexOf("tablet pc") == -1)
|| u.indexOf("ipad") != -1
|| (u.indexOf("android") != -1 && u.indexOf("mobile") == -1)
|| (u.indexOf("firefox") != -1 && u.indexOf("tablet") != -1)
|| u.indexOf("kindle") != -1
|| u.indexOf("silk") != -1
|| u.indexOf("playbook") != -1,
Mobile:(u.indexOf("windows") != -1 && u.indexOf("phone") != -1)
|| u.indexOf("iphone") != -1
|| u.indexOf("ipod") != -1
|| (u.indexOf("android") != -1 && u.indexOf("mobile") != -1)
|| (u.indexOf("firefox") != -1 && u.indexOf("mobile") != -1)
|| u.indexOf("blackberry") != -1
}
})(window.navigator.userAgent.toLowerCase());
使い方
スマートフォンのユーザエージェントを対象に分岐処理
if(_ua.Mobile){
//この中のコードはスマホにのみ適用
}
スマートフォンのユーザエージェントとして判定の対象にしているもの
- iPhone(ユーザエージェント情報に「iPhone」をもつことを条件に抽出)
- iPod(ユーザエージェント情報に「iPod」をもつことを条件に抽出)
- Windows OS スマートフォン(ユーザエージェント情報に「Windows」と「Phone」をあわせもつことを条件に抽出)
- Android OS スマートフォン(ユーザエージェント情報に「Android」と「Mobile」をあわせもつことを条件に抽出)
- Firefox OS スマートフォン(ユーザエージェント情報に「Firefox」と「Mobile」をあわせもつことを条件に抽出)
- BlackBerry OS スマートフォン(ユーザエージェント情報に「BlackBerry」をもつことを条件に抽出)
タブレットのユーザエージェントを対象に分岐処理
if(_ua.Tablet){
//この中のコードはタブレットのみ適用
}
タブレットのユーザエージェントとして判定の対象にしているもの
- iPad(ユーザエージェント情報に「iPad」をもつことを条件に抽出)
- Kindle(ユーザエージェント情報に「Kindle」または「Silk」をもつことを条件に抽出)
- Android OS タブレット(ユーザエージェント情報に「Android」をもつが「Mobile」はもたないことを条件に抽出)
- Windows OS タブレット(ユーザエージェント情報に「Windows」と「Touch」をあわせもち、かつ「Tablet PC」をもたないことを条件に抽出)
- Firefox OS タブレット(ユーザエージェント情報に「Firefox」と「Tablet」をあわせもつことを条件に抽出)
- BlackBerry OS タブレット(ユーザエージェント情報に「PlayBook」をもつことを条件に抽出)
組み合わせて使う分岐処理の例
if(_ua.Mobile || _ua.Tablet){
//この中のコードはスマホとタブレットにのみ適用
}else{
//この中のコードはスマホとタブレット以外に適用
}
if(_ua.Mobile){
//この中のコードはスマホにのみ適用
}else if(_ua.Tablet){
//この中のコードはタブレットにのみ適用
}else{
//この中のコードはスマホとタブレット以外に適用
}