[jQuery] スマートフォン・タブレットPCのユーザーエージェントと判別プラグイン

ユーザエージェント(userAgent)判別プラグインの焼き直しです。
スマホ判別に特化させてみた。


直接見る

Usage

$(document.body).checkSmartphone( [{option}] );

対象にしたHTML要素にプラグインが得た情報に基づいたクラスを付与します。

$.browser.agent

プラグインが生成した情報の格納場所。キーはプラグインのオプションと同じです。

判別ルールに関するメモ

スマートフォンかそうでないかの判別

Androidがフリーダムだったので見直した。

加速度はAndroidの対応が微妙なので、現時点でuserAgent以外の何かを見るなら
傾きとタッチに関するプロパティやイベントの有無で判断するのが手っ取り早いと思います。

  1. デバイスの確認
    Android か Appleのやつか
  2. 傾きに関するプロパティ がある
    (‘orientation’ in window)
  3. 傾きに関するイベントがある
    (‘onorientationchange’ in window)
  4. タッチイベントがある
    (“ontouchstart” in document.documentElement)

iOSの場合はiPad、Androidの場合はmobileという文字列がuserAgentに含まれていない場合に
タブレットだと判断しますが、使用するブラウザによってはタブレット扱いになる事があります。
orientationが取得できないシュミレーター等はPC扱いになります。
(実機重視ってことで、困る時はセルフコメントアウト推奨)
iPhoneの場合はフルスクリーンモードとWebViewでtrueであればブラウザ名がAppModeとなります。

Webkit

デフォルトブラウザとアプリのWebViewはWebkitです。

Apple

Mobile Safari

Mozilla/5.0 (iPhone; U; CPU iPhone OS 3_1_3 like Mac OS X; ja-jp) AppleWebKit/528.18 (KHTML, like Gecko) Version/4.0 Mobile/7E18 Safari/528.16

Mercury (iOS)

Mozilla/5.0 (iPhone; U; CPU iPhone OS 3_1_3 like Mac OS X; ja-jp) AppleWebKit/528.18 (KHTML, like Gecko) Mobile/7E18

FullScreen(iOS4:4)

Mozilla/5.0 (iPhone; U; CPU iPhone OS 4_3_3 like Mac OS X; ja-jp) AppleWebKit/533.17.9 (KHTML, like Gecko) Mobile/8J2

FullScreen(iOS3:3G)

Mozilla/5.0 (iPhone; U; CPU iPhone OS 3_1_3 like Mac OS X; ja-jp) AppleWebKit/528.18 (KHTML, like Gecko) Mobile/7E18

UIWebView

Mozilla/5.0(iPhone; U; CPU iPhone OS 4_3_3 like Mac OS X; ja-jp) AppleWebkit/533.17.9 (KHTML, like Gecko) Mobile/8J2

WebView=フルスクリーンモード=サードパーティ製ブラウザ ですね。

Sintax

Mozilla/[version] ([iPhone|iPad|iPod]; [ Version Token;] CPU [OS name] [OS version] like Mac OS X; [locale]) AppleWebKit/[version] (KHTML, like Gecko) Mobile/[version] [Browser Name/version]

Android

機種名が取れます。

Mobile Safari(デフォルトブラウザ)

Xperia ark SO-01C:

Mozilla/5.0 (Linux; U; Android 2.3.2; ja-jp; SonyEricssonSO-01C Build/3.0.D.2.79) AppleWebKit/533.1 (KHTML, like Gecko) Version/4.0 Mobile Safari/533.1

REGZA IS04:

Mozilla/5.0 (Linux; U; Android 2.1-update1; ja-jp; IS04 Build/FEK100) AppleWebKit/530.17 (KHTML, like Gecko) Version/4.0 Mobile Safari/530.17

Dolphin Browser

Mozilla/5.0 (Linux; U; Android 2.3.2; ja-jp; SO-01C Build/3.0.D.2.79) AppleWebKit/533.1 (KHTML, like Gecko) Version/4.0 Mobile Safari/533.1

SonyEricssonが省略されている以外は同じ。

Sintax

Mozilla/[version] (Linux; U; [ Version Token;] Android [VERSION]; [LOCALE]; [DEVICE_NAME] Build/[version]) AppleWebKit/[version] (KHTML, like Gecko) Mobile/[version] [Browser Name]/[version]

Optimus Pad L-06C

Mozilla/5.0 (Linux; U; Android 3.0.1; ja-jp; L-06C Build/HRI66) AppleWebKit/534.13 (KHTML, like Gecko) Version/4.0 Safari/534.13

Presto

MiniとMobileがありますが、パターンはPC版Operaと同じ。
Androidの場合は機種名がとれず、iOSの場合はOSバージョンが取れません。

Opera Mobile (Android)

Opera/9.80 (Android 2.3.2; Linux; Opera Mobi/ADR-1107051709; U; ja) Presto/2.8.149 Version/11.10

Opera Mini (iOS)

Opera/9.80 (iPhone; Opera Mini/6.1.15738/25.697; U; ja) Presto/2.5.25 Version/10.54454

Sintax

Opera/(9.80|[\d\.]+) ([Compatibility Flag;][ Platform Token;][ Version Token;][Option]) Presto/[version] Version/[browser version]

Gecko

モバイル端末用Firefoxの場合、開発コードのFennecという文字列がuserAgentに入ってます。機種名はとれません。

Firefox Fennec (Android)

Mozilla/5.0 (Android; Linux armv7l; rv:5.0) Gecko/ Firefox/5.0 Fennec/5.0

Sintax

Mozilla/[version] (Android;[ Platform Token;][ Version Token]) Gecko/ Firefox/[version] Fennec/[version]

IE Mobile

Windows Phoneに搭載されてるブラウザはやっぱりIEらしい。絶望感漂いますね!
こちらからの情報です。
実機はhtc HD7だけ確認済み。
機種名が含まれてますが、検証不足の為プラグインでは取れないとみなしています。
window.orientation と TouchEventのチェックは外してあります(undefinedのため)。

IE Mobile9.0

Mozilla/5.0 (compatible; MSIE 9.0; Windows Phone OS 7.5; Trident/5.0; IEMobile/9.0)
Mozilla/5.0 (compatible; MSIE 9.0; Windows Phone OS 7.5; Trident/5.0; IEMobile/9.0 HTC; HD7)

IE Mobile 7.11

HTC_Touch_3G Mozilla/4.0 (compatible; MSIE 6.0; Windows CE; IEMobile 7.11)

IE Mobile 7.0

Mozilla/4.0 (compatible; MSIE 7.0; Windows Phone OS 7.0; Trident/3.1; IEMobile/7.0; Nokia;N70)

Sintax

[Device Name ]Mozilla/[version] (compatible; MSIE Version;[ OS;][Trident Version;][Browser Version;][Device Name])

Leave a Comment.