listfulのロゴlistfulのロゴ
JavaScript

window.navigatorの豪華すぎる中身

window.navigatorで取得できるNavigatorオブジェクトは、下記のように多種類の機能がありますが、ブラウザごとの実装差異が大きいです。Chromeはとても高機能で、他のブラウザで使える機能はChromeでも使えることがほとんどです。下記のリストは、Mac Chrome v86での結果です。

  • appCodeName : 非推奨。ブラウザのコードネームです。Mozillaを返すブラウザが多くてあまり役に立ちません。
  • appName : 非推奨。ブラウザの名称です。どのブラウザもNetscapeを返すので役に立ちません。
  • appVersion : 非推奨。ブラウザのバージョンです。5.0から始まる冗長な文字列を返すブラウザが多くて役に立ちません。
  • bluetooth : Web Bluetooth API用のオブジェクトを返します。Chromium系ブラウザが対応しています。
  • clipboard : Clipboard API用のオブジェクトを返します。
  • connection : ネットワーク情報に関するオブジェクトを返します。回線速度などが分かります。
  • cookieEnabled : Cookieが有効ならtrueを返します。
  • credentials : 認証情報管理APIに関するオブジェクトを返します。MDNにログイン情報処理のサンプルがあります。
  • deviceMemory : 0.25, 0.5, 1, 2, 4, 8 (単位:GB)の中からデバイスのメモリ量に最も近い値を返します。32GB積んでいても返り値は8です。
  • doNotTrack : サイトによるユーザー追跡を拒否するDo Not Track設定の状態を返します。
  • geolocation : Geolocation API用のオブジェクトを返します。地球上の位置情報を取得できます。
  • hardwareConcurrency : CPUのスレッド数(論理プロセッサ数)を返します。正確とは限らず、Mac Firefoxでは実際のスレッド数より少ない値が返されます。
  • keyboard : Keyboard API用のオブジェクトを返します。Chromium系ブラウザが対応しています。
  • language : ブラウザで第一に使われている言語の言語コードを返します。
  • languages : ブラウザが把握している言語コードのリストからなる配列を返します。
  • locks : Web Locks API用のオブジェクトを返します。複数のタブで開かれるページでローカルのストレージを操作する時に使います。
  • maxTouchPoints : デバイスが対応している同時タッチ数を返します。一般的なパソコンなどのタッチ非対応デバイスでは0となります。
  • mediaCapabilities : Media Capabilities API用のオブジェクトを返します。動画再生パフォーマンスの向上のために、メディアタイプやコーデックをサポートしているかを調べる時に使います。
  • mediaDevices : WebカメラやマイクをJavaScriptから操作する時に使います。
  • mediaSession : Media Session API用のオブジェクトを返します。MDNにメディアプレーヤーのロジック実装例があります。
  • mimeTypes : ブラウザがサポートしているMIMETypeのリストを返します。例としてChromium系ブラウザにはPDFビューアがインストールされているので、type: 'application/pdf'が含まれます。
  • onLine : ネットワークに接続されていればtrueが返されます。
  • permissions : Permissions API用のオブジェクトを返します。通知や位置情報取得の権限があるかを調べる時に使います。
  • platform : 非推奨。ブラウザの実行環境を示す文字列です。WHATWGの仕様では空文字を返すことも明記しているので、値の正確さを保証できません。
  • plugins : 非標準。ブラウザにインストールされたプラグインのリストを返します。Chromium系ブラウザにはPDFビューアがインストールされているので、name: 'Chromium PDF Viewer'が含まれます。
  • presentation : Presentation API用のオブジェクトを返します。プレゼンテーション機能を実装したい時に使います。
  • product : 非推奨。ブラウザの機能的側面からの名前を返します。どのブラウザもGeckoを返すので役に立ちません。
  • productSub : 非推奨。ブラウザのビルド番号を返します。多くがYYYYMMDDの日付形式なのですが、バージョンアップしても変わらないままなので役に立ちません。
  • sendBeacon() : Beacon APIを使って、Webサーバーにデータを送ります。サイトのアクセス解析などで使われます。
  • serviceWorker : Service Worker APIに関するオブジェクトを返します。PWAを作る時には欠かせない、JavaScriptの独立した実行環境を扱います。
  • setAppBadge() : Badging APIを使用して、PWAとして動作しているページのアイコンにバッジを表示します。
  • storage : Storage APIに関するオブジェクトを返します。IndexedDBなどがどのくらいの容量まで使うことができるかの概算値を調べることができます。
  • usb : WebUSB API用のオブジェクトを返します。接続したUSBデバイスにアクセスして情報を読み取ることができます。
  • userActivation : User Activation用のオブジェクトを返します。ユーザーによる操作がされているかの確認を統一化します。
  • userAgent : ブラウザのユーザーエージェント文字列を返します。歴史的なブラウザ戦争によって、UAによるブラウザ識別はとても難しいのが現状です。
  • vendor : ブラウザのベンダー名を返します。Chromium系ブラウザでは(OperaでもEdgeでも)Google Inc.が出力され、Firefoxでは空文字が出力あされてしまうので、役に立ちません。
  • vendorSub : 非推奨。ブラウザのベンダー名の内バージョン部分を返します。実際には揃いも揃って空文字を返すので役に立ちません。
  • vibrate() : Vibration APIを実行して、対応端末をバイブレーションさせます。
  • wakeLock : Screen Wake Lock API用のオブジェクトを返します。ディスプレイのスリープやスクリーンセーバーの起動を防ぐことができます。
  • webkitPersistentStorage : File and Directory Entries API向けに、永続データ用のストレージへのアクセスを提供します。Chromium系ブラウザが対応しています。
  • webkitTemporaryStorage : File and Directory Entries API向けに、一時データ用のストレージへのアクセスを提供します。Chromium系ブラウザが対応しています。
  • xr : WebXR Device API用のオブジェクトを返します。XR(ARやVR)デバイスを管理します。

クリップボード内容の操作から、USBデバイスの取得やXR体験までできてしまうのは、WebAPIのハッピーセットと言えるのかもしれません。ただそれらのAPIを使って実装しようとすると、対応ブラウザの幅が狭かったり動作がバラバラだったり、情報が少なかったり想定用途がニッチすぎてやる気が出なかったりで苦労は多いような気がします。それでも人より一歩先に新しい機能を使って時代の最先端を走りたいという方は、それぞれのAPIについて深く調べてみると良いでしょう。

参考リンク