ユーザーエージェント切り替え（User-Agent Switcher）とは？できることと必要な場面

ユーザーエージェント切り替えツールが何を変えるのか、それだけではスマホ表示にならない理由、クライアントヒントとの関係、安全な拡張機能の選び方を解説します。

ユーザーエージェント切り替えツール（User-Agent Switcher）は、ブラウザがWebサイトに送るユーザーエージェント文字列を書き換え、別のブラウザや端末を使っているようにサイトに思わせるツールで、たいていは拡張機能です。開発者は、特定のブラウザ向けに配信される内容を見たり、端末判定を確認したりするのに使います。ただし、ユーザーエージェントを変えるだけではスマホのレイアウトにはなりません。表示領域、画面サイズ、ピクセル比が変わらないからです。モバイルのテストには、それらも変えられるツールが必要です。

ユーザーエージェントとは

ブラウザが送るすべてのリクエストには、ブラウザ、エンジン、OSを表す文字列である User-Agent ヘッダーが含まれます。最近のWindows版Chromeなら、次のような文字列を送ります。

Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/<major version>.0.0.0 Safari/537.36

AndroidスマホのChromeなら次のようになります。

Mozilla/5.0 (Linux; Android 10; K) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/<major version>.0.0.0 Mobile Safari/537.36

「Mozilla」「AppleWebKit」「like Gecko」「Safari」といった名前が入り混じっているのは歴史的な経緯によるものです。特定のブラウザを判定するサイトに締め出されないよう、各ブラウザが互いの文字列を真似してきたのです。多くのサーバーは、モバイル用ページを返すかどうかを Mobile という単語で判断しています。

User-Agentの簡略化とクライアントヒント

Chrome、Edgeなど、Chromium系のブラウザは現在、簡略化されたユーザーエージェントを送っています。マイナーバージョンはゼロに置き換えられ、Androidのバージョンと端末の機種は汎用的な値に固定され（上の Android 10; K がそれです）、Windowsのバージョンも固定されています。詳しい情報は User-Agent Client Hints に移り、次のようなヘッダーで送られます。

Sec-CH-UA：ブラウザのブランドとメジャーバージョン
Sec-CH-UA-Mobile：モバイルなら ?1、デスクトップなら ?0
Sec-CH-UA-Platform：OS

サーバーは必要に応じて、機種や完全なバージョンなど追加のヒントを要求できます。JavaScriptは同じ情報を navigator.userAgentData で読み取ります。

これは切り替えツールにとって重要です。User-Agent ヘッダーだけを変えてクライアントヒントは「デスクトップ」のままにするツールは矛盾した情報を送ることになり、それに気づくサイトもあります。優れたツールは両方を変えます。

ユーザーエージェント切り替えが役立つ場面

端末判定の確認。 サーバー、CDN、WordPressのプラグインがスマホに別のHTMLを返している場合、ユーザーエージェントを切り替えればそのバージョンを確認できます。
不具合報告の再現。 訪問者から「Samsung Internetで崩れる」と言われたら、そのユーザーエージェントを設定することで、ユーザーエージェントによって分岐する処理が見つかることがあります。
「非対応ブラウザ」バナーの確認や、ブラウザ別のポリフィルのテスト。
ボットに見えている内容の確認。 SEOやボット用のルールをデバッグするとき、クローラーのユーザーエージェントなどで確認します。

ユーザーエージェント切り替えでできないこと

ユーザーエージェントを変えても、次のものは変わりません。

表示領域の幅。 そのためCSSのメディアクエリは反応しません。
JavaScriptに伝わる screen.width、devicePixelRatio、タッチ対応
描画エンジン。 Safariのふりをしても、ChromeがWebKitのように描画するわけではありません。

そのため、iPhoneのユーザーエージェントにしたPCのChromeのウィンドウでは、サーバーが返したモバイル用HTMLがデスクトップの幅に引き伸ばされた、奇妙な表示になりがちです。本当のスマホ表示には、表示領域、ピクセル比、ユーザーエージェントをまとめてエミュレートする必要があります。Chrome DevToolsのデバイスモードはそれを行いますし、Mobile View Extension のようなスマホ表示の拡張機能も同様で、端末ごとのユーザーエージェント、対応するクライアントヒント、画面サイズ、ピクセル比、タッチの設定を一度に適用します。両者の比較はスマホシミュレーター拡張機能とDevToolsの比較をご覧ください。

そもそも拡張機能は必要か

一度きりのテストなら不要です。Chrome DevToolsの Network conditions で現在のタブのユーザーエージェントを上書きできますし、デバイスモードでスマホを選べば自動的に設定されます。手順はChromeでユーザーエージェントを変更する方法で解説しています。

頻繁に切り替える、サイトごとのルールがほしい、DevToolsを閉じても設定を維持したい、という場合には拡張機能を入れる価値があります。

ユーザーエージェント切り替え拡張機能の選び方

ユーザーエージェント切り替えツールは、あなたのすべてのリクエストを見て書き換えられます。広い権限を持つほかの拡張機能と同じように慎重に選びましょう。

プライバシーポリシー。 閲覧データを収集しないことが明記されているべきです。広告や解析を埋め込むものは避けましょう。
クライアントヒント。 User-Agent 文字列だけでなく、Sec-CH-UA-* ヘッダーと navigator.userAgentData も変えるか。
サイト単位またはタブ単位のルール。 偽のユーザーエージェントを銀行のサイトでうっかり使い続けないためです。
最新のプリセット。 Chrome 60やiOS 11の古い文字列のプリセットでは、「古いブラウザ」の警告が出ます。
最近の更新。 Chromeウェブストアで確認しましょう。

プライバシー：ランダムなユーザーエージェントで身を守れるか

「ランダムなユーザーエージェント」をうたう拡張機能は、トラッキングを難しくすると約束しています。しかし効果は限定的です。フィンガープリントのスクリプトは、画面サイズ、フォント、タイムゾーン、GPUなど多くの情報を使うので、ほかの情報と合わないユーザーエージェントは、むしろブラウザを目立たせかねません。プライバシーのためには、文字列を切り替えるより、フィンガープリント対策が組み込まれたブラウザのほうが効果的です。

よくある質問

ユーザーエージェント切り替えツールは何をするものですか？

ブラウザがWebサイトに送るブラウザや端末の情報を変えて、別のブラウザや端末として扱われるようにします。

ユーザーエージェントを切り替えればサイトのモバイル版が見られますか？

サーバーがモバイル端末に返すHTMLは見られますが、表示領域の幅は変わらないので、モバイルのレイアウトにはなりません。表示領域も変えられるデバイスエミュレーションか、スマホ表示の拡張機能を使いましょう。

ユーザーエージェント切り替えツールは安全ですか？

手法そのものは無害で、リスクは拡張機能のほうにあります。プライバシーポリシーが明確で、権限が最小限、最近も更新されているものを選び、使わないときはオフにしておきましょう。