スキップしてメイン コンテンツに移動

尋常でないレベルでブラウザを判定するライブラリ、what-browser-am-iをnpmに公開しました

クライアントサイド専用の Web ブラウザ判定用ライブラリwhat-browser-am-i を npm に公開しました。

頻繁に偽装される userAgent に惑わされず、可能な限りビルトインオブジェクトを使ってバージョン等を判定するように実装しています。新旧を問わず、広範な DHTML ブラウザでの動作を目標に開発を続けます。

フワッとしたブラウザ判定をしてしまうと、これ以降に書かれるクロスブラウザ用コードもフワッとしてしまって、精神衛生上宜しくありません。この点が改善されるようになってきた、と個人的には感じています。Enjoy!

ブラウザエンジンはおろかブランド名まで判定してUXをアゲアゲする

ブラウザ判定というとブラウザエンジンと OS の判定がまず念頭に浮かびます。EdgeHTML の開発中止や Windows Phone の撤退など、エンジンと OS の多様性は失われていく傾向です。Web 開発者はクロスブラウザ対応から解放されつつある、と考えてよいのでしょうか?

ところで Android や iOS の組み込み WebView をラップした各種ブラウザアプリケーションは独自の変更が加えられています。つまりユーザーに最良の体験を提供したい場合、先の2点に加えてブランド(アプリケーション名)を判定する必要があります。

エンジンと OS は減少傾向ですがブランドとなると際限がなく、長らく二の足を踏んでいました。しかしある時、一年発起してコードを書き始めました。Web 開発の一丁目一番地はブラウザ判定、コードを書いて本当に良かったです。

クロスブラウザに頭を悩ます状況は変わりませんが、ユーザーの多様な選択肢を保証するため知見とコードを積み上げていきましょう。

ブラウザ判定でブランドを知りたい理由

モバイル用ブラウザには、スクロール操作でアドレスバーの高さが低くなり表示エリアが拡大するギミックを備えるものが多くあります。ややこしいことに変化しないものもあります!この際に取れる表示エリアのサイズが各ブラウザ(ブランド)で異なることに業を煮やしたのでした。

また Facebook, Line などの提供する in App ブラウザを使用中の場合、これを検出してフォローリンクを表示することも考えられますね。

リンク

Comparison of web browsers
Web ブラウザを網羅する Wikipedia のページ。Amaya 等の非ダイナミック HTML ブラウザ、w3m 等のテキストブラウザも含まれる。

以降のテーブルは、開発を進めながら加筆・修正して参ります。悪しからず!

ua.PLATFORM プラットフォーム

デスクトップOS
プロパティ値の例メモ
Win16
Win326.1, 1064bit CPU でも多くの場合で Win32 と判定される。
Win64
MacPPC
Mac68K
MacIntel
ChromeOS
SunOS
FreeBSD
OpenBSD
NetBSD
Ubuntu
Mint
Fedora
Gentoo
Linux
モバイルOSとスマートデバイス用OS
プロパティ値の例メモ
WinCE
WindowsMobile
WindowsPhone
Android
BlackBerry
iOS
FireOS
FirefoxOSFirefox OS シミュレータのインストール
webOS
Tizen
MeeGo
Maemo
モバイル機器
名前値の例メモ
FeaturePhone
Mylo
kobo
SonyReader
Kindle
ゲーム機
プロパティ値の例メモ
NDSNintendo DS
NDSiNintendo DSi
N3DSNintendo 3DS
New3DSNew 3DS
Wii
WiiU
Switch
PSP
PSVita
PSPGo
PS3
PS4
XBox360
XBoxOne

ua.ENGINE ブラウザエンジン

PC用ブラウザエンジン
プロパティ値の例メモ
Trident4, 5, 5.5, 6, 7, 8, 9, 10, 11
Tasman5.2
EdgeHTML12, 13, 14, 15, 16, 17, 18
Presto7.2, 7.5, 8, 8.6, 9, 10, 11, 12.1
NetscapeNavigator4.06未実装。
GeckoQuantum も含む。5以降でGeckoとFirefoxのナンバリングが一致
GoannaQuantum に切り替わる直前に Gecko から分岐したエンジン。
FennecPCMobile 用 Gecko の開発中にリリースされたPC向けのベータ版。
KHTML
WebKitWebkit2 を含む
ChromiumBlink も含む。
QtWebKit
QtWebEngineChromium がベース。Chromium と判定。
iCabiCab 3.x までが独自エンジン。以降は WebKit。
スマートデバイスとゲーム用のブラウザエンジン
プロパティ値の例メモ
TridentMobile4, 5, 6, 7, 9, 10, 11
TridentPocket4未実装。W-ZERO3 等に搭載された XMLHttpRequset が追加されて、css-p がサポートが無効の IE4。
EdgeMobile12
PrestoMobile12.1
NetFront3.4, 4. 4.2
SafariMobileiOSの標準ブラウザ
iOSWebViewiOS用の WebView をラップしたブラウザや in App ブラウザのエンジン。Safari Mobile から一部に機能制限がある。
AOSP1.5, 2, 2.1, 2.2, 2.3, 3, 4, 4.1, 4.2, 4.3, 4.4AOSP stock browser。Android OS のバージョンと一致。
ChromiumMobileBlink も含む。
ChromeWebView4.4, 以降は Chromium のバージョンChrome ベースの AOSP の後継 WebView。Android 5 移行で、OS のアップデートと分離した。
FennecMobile 用 Gecko。Quantum も含む。
Samsung0.9, 1, 1.5, 1.6, 2...サムスンによる魔改造Webブラウザ、Samsung Internet の判定
SonyITmedia NEWS > PS3のWebブラウザ、独自エンジンだからできること
サーバサイドレンダリングエンジン
プロパティ値の例メモ
OperaMini
UCWEBUser-Agent and X-UCBrowser-UA Specification of UC Browser
インドネシアの特殊なブラウザ事情(Opera Mini,UC Browser Mini)
UserAgent を用いた判定と、Web アプリのサーバサイドレンダリングブラウザ対応について。
シェアの少ないJS殺しブラウザ対応の話
Web アプリのサーバサイドレンダリングブラウザ対応について。

ua.BRAND ブランド

NetFront などエンジンと同名がブランドになるケースもある。

エンジン開発社提供のブラウザブランド
プロパティ値の例メモ
NetFrontNetFront エンジン。
SafariWebKit, SafariMobile エンジン。
ChromeChromium, ChromiumMobile
EdgeEdgeHTML, EdgeMobile, Chromium(Windows, MacOS X), ChromeWebView(Android, iOS)
IETrident エンジン。
IEHostTrident エンジン。IE8 以上でシュミレータを使用した場合。
ModernIEWindows 8.x のモダンUI用ブラウザ。Live タイルが使用できる。アドレスバーの挙動がモバイルブラウザと同じ。
MacIETrident, Tasman エンジン。
OperaPresto, PrestoMobile, Chromium, ChromeWebView エンジン。
SilkChromeWebView エンジン。
FirefoxGecko, Fennec, FennecPC
FocusKlar 含む。但し FireTV 版は ChromiumMobile。
KlarFennec エンジン。
PaleMoonGoanna エンジン。
SamsungSamsung エンジン。
KonquerorKHTML, Webkit エンジン。
iCabiCab, Webkit エンジン。
unknown
カスタムブラウザ
プロパティ値の例メモ
NNGecko エンジン。
NetFrontNXWebKit エンジン。
CoastChromeWebView エンジン。
OperaTouchChromeWebView エンジン。
YahooAOSP, ChromiumMobile エンジン。
UC
Vivaldi
QQ
Yandex
coccoc
Camino
Sogou
AOLTrident エンジン。
IceDragon
Iceweasel
ITenFourFox
Waterfox
GNUzilla
SeaMonkey
Basilisk
Maxthon
Avant
Lunascape
Midori
OmniWeb
Roccat
Epiphany
WebPositive
Iron
ComodoDragon
Brave特徴無し、Chrome として判定される。
Rockmelt
Sleipnir
Puffin
Dooble
Flock
Galeon
Falkon
Iceape
KMeleon
IrisWebKit
DuckDuckGo
In app ブラウザ
プロパティ値の例メモ
LINE
Facebook