JavaScriptでブラウザのバージョンを検出する方法

クライアント側（ユーザーのブラウザ）でブラウザの種類やバージョンを検出したい場合、JavaScriptの navigator.appVersion または navigator.userAgent プロパティの値を解析することで実現できます。

ブラウザ情報を取得するプロパティ

navigator オブジェクトは、実行中のブラウザに関するさまざまな情報を保持しています。主なプロパティは以下のとおりです。

• navigator.appVersion … ブラウザのバージョンおよびプラットフォーム情報を返します。
• navigator.userAgent … ブラウザがサーバーに送信するユーザーエージェント文字列をそのまま返します。より詳細な情報が含まれます。

サンプルコード

以下のように、console.log() を使って簡単に値を確認できます。

console.log(navigator.appVersion);
console.log(navigator.userAgent);

実行結果の出力例

実行結果は、使用しているブラウザとそのバージョンによって異なります。たとえば、Mac上のChromeで実行した場合、次のような文字列が出力されます。

Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_4) AppleWebKit/537.36
(KHTML, like Gecko) Chrome/77.0.3865.90 Safari/537.36

注意点

ユーザーエージェント文字列は歴史的な経緯から互換性維持のための情報も含まれており、必ずしも正確な判定には使えません。また、近年ではプライバシー保護のため文字列が簡略化される傾向にあります。

そのため、特定の機能が使えるかどうかを確認したい場合は、ブラウザ判定よりも機能検出（フィーチャーディテクション）を利用するのが推奨されます。たとえば 'fetch' in window のように、必要なAPIが存在するかを直接チェックする方法です。