ChromeでUserAgent(ユーザーエージェント)を変更する方法【UA偽装】

User Agent（ユーザーエージェント ）とは、ユーザーがあるサイトにアクセスしたときに伝える、ソフトウェアやハードウェアなどユーザーの利用環境の情報です。

利用している OS（WindowsやMac OS）、Webブラウザ（ChromeやInternet Explorerなど）、スマートフォンの機種などの情報を伝えます。

近年、レスポンシブデザインが重要視されています。

レスポンシブデザインとは、デバイスの画面サイズに依存しないwebサイトを構築する方法です。PCやスマートフォンなど、 ユーザーの インターネットの利用環境に合わせたWebサイトを表示させることができます。

レスポンシブデザインを採用すれば、PC用サイトとスマートフォン用サイトを別々に作る必要がありません。共通のWebサイトを1つ構築して、ページごとに1種類ずつ管理すればいいのです。

User Agent（ユーザーエージェント）により、ユーザーの利用環境を伝えることで、Webサイトはその ユーザーに合わせた情報を送信することができます。

レスポンシブルデザインを採用してWebサイトを構築する際、それぞれのデバイスからの表示画面を確認したくても、あらゆるデバイスを実際に用意するのは難しいでしょう。

User Agentを偽装（UA偽装）してデバイスエミュレータを表示できます。User Agentは、本来のデバイスとは異なる情報を送ることで偽装することができます。UA偽装をすることで、PC上でも「スマートフォンで閲覧したページ」を表示することができます。

UA偽装をするには、Chromeに付属しているデベロッパーツールを使う方法やChromeの拡張機能を使う方法などがあります。

ガラケーなど用意されたUA以外のユーザーエージェントが必要になった場合は、デベロッパーツールを利用する必要があるなど、それぞれのメリットデメリットがあります。機能性と選べる対象を考慮して偽装方法を決めましょう。

Chromeに付属しているデベロッパーツール（Web開発のための要素の検証機能）を使用し、User Agent（ユーザーエージェント）を偽装をすることができます。

User Agentを偽装することで、Chrome上でInternet Explorerの画面やスマートフォンの画面を表示させたり、デバイスエミュレータとして表示することができます。

Chromeメニューから、「その他のツール」「デベロッパーツール」の順にクリックします。

また、Chrome画面上で、Windowsなら「F12」キーを押す、または「Control + Shift + I」を同時に押す、Macなら「Control + Option + I」を同時に押すことで、デベロッパーツールが開きます。

Chrome画面の左側にデベロッパーツールが表示されます。

デベロッパーツールの「Hide drawer」(Settingsボタンの左にある >>ボタン)をクリックします。

「Emulationタブ」をクリックします。タブがない場合は、「Settings」をクリックし、「General」を表示して、「Show 'Emulation' view in console drawer.」をチェックします。

「User Agent」を表示し、「Spoof user agent」をチェックします。

User Agentをセレクトボックスから選択します（Spoof user agentにチェックを入れるとセレクトボックスがアクティブになります）

Chromeの拡張機能「User-Agent Switcher for Chrome」で、User Agentを変更することもできます。Chromeで、スマートフォンやIEなどのブラウザにUA偽装をして、ページを見ることができます。

Chromeのデベロッパーツールよりも、手軽に利用できます。確認するページが多い場合は、拡張機能「User-Agent Switcher for Chrome」を使うほうが便利です。

「chrome ウェブストア」から「拡張機能」を開きます。検索ボックスに「User-Agent Switcher for Chrome」を入れます。

インストール画面が表示されます。右端の「Chromeに追加」ボタンをクリックしてChromeの拡張機能「User-Agent Switcher for Chrome」をインストールします。

Chromeに拡張機能「User-Agent Switcher for Chrome」のアイコンが追加されました。

追加されたChromeの拡張機能「User-Agent Switcher for Chrome」のアイコンをクリックすると、UAを変更できるブラウザの一覧表が表示されます。

「User-Agent Switcher for Chrome」で変更できるUAの種類は、
Chrome、Internet Explorer、iOS、Android、Windows Phone、Firefox、Opera、Safari

偽装したいブラウザをクリックすると、変更できるブラウザのバージョン一覧が表示されます。ここでは、Internet Explorerをクリックしました。

また、任意のUAを追加することもできます。

「User-Agent Switcher for Chrome」アイコンを右クリック→「オプション」をクリックします。「User-Agent Switcher for Chrome」の画面が表示されます。

「Custom User-Agent List」欄から次の項目を入力します。
 

• New User-agent name：UAの名称
• name New User-Agent String：任意のUAを入力

Chromeのデバイスエミュレータ機能で、User Agent（ユーザーエージェント）を変更して、Chrome上にブラウザを表示させることができます。

デバイスエミュレータ機能では、UA偽装だけでなく、ページの表示領域の再現などもできます。

Chromeのデベロッパーツールを起動します。

デベロッパーツールの左上にあるスマートフォンのアイコンをクリックします。

スマートフォンのアイコンをクリックすると、Webページの表示が変わり、デバイスエミュレータが表示されます。

デバイスエミュレータの画面上にデバイスツールバーが表示されます。デバイスツールバーから、エミュレートしたいデバイスを選択します。

デベロッパーツールのNetwork conditionsからGoogle Chromeが用意したUserAgentに設定したり、任意のUserAgentを入力して設定することができます。

Network conditionsを利用すれば、デバイスエミュレータ機能よりも、細かい粒度の動作確認ができます。

Chrome上で、Windowsなら「F12」キーを押す、または「Control + Shift + I」を同時に押す、Macなら「Control + Option + I」を同時に押すことで、デベロッパーツールを表示させます。

「︙」をクリックし、「More Tools」→「Network conditions」をクリックします。

デベロッパーツールに「Network conditions」が追加されます。「Network conditions」にある「Select automatically」のチェックを外します。

「Network conditions」の「Select automatically」のチェックを外すと、その下のセレクトボックスやテキストボックスの表示されます。ここから、ユーザーエージェント (UA) が変更できるようになります。

「User agent」のセレクトボックスから、User Agentを設定することができます。

セレクトボックスに一覧表示されるUser Agentには、主要なブラウザが一通り用意されています。また、Googlebotなど特殊なUser Agentもあります。

任意のUser Agentを設定する場合は、セレクトボックス下にあるテキストボックスに直接、設定したいUser Agentを入力します。

User Agentを設定後、目的のページを開いたり、再読込したりして設定を反映させます。