ChromeでUA偽装する
みなさんはChromeでUA偽装、つまりユーザーエージェント(useragent)を変更したいと思ったことはないでしょうか?
UA偽装するケースとしてはやはり開発時のデバッグが一番多いのではないでしょうか。
偽装という言葉がついているので、何か悪い事をしている感じに聞こえますが、UA偽装をして開発機で他のブラウザやスマホやガラケーのユーザーエージェント(useragent)での挙動を確認する際には非常に便利な方法となります。
今回はChromeでUA偽装する方法をご紹介します。ユーザーエージェント(useragent)を変更する方法を把握して、ぜひ開発に役立てましょう。
ChromeでUA偽装するには?ユーザーエージェント(useragent)変更方法!
ChromeでUA偽装をする方法はいくつかありますので、ご紹介していきます。
デベロッパーツールを利用する
Chromeに付属されているデベロッパーツールを使ってUA偽装することができます。まずはデベロッパーツールを開きましょう。
[Mac]
Command + Option + I
[Windows]
Ctrl + Shift + I
のショートカットでデベロッパーツールを開くことができます。
メニューが開いたら、「More tools」を選択し、「Network conditions」をクリックします。
デベロッパーツールの下部にNetwork conditionsの設定画面が表示されるかと思います。
「User Agent」の項目で「Select automatically」のチェックを外しましょう。
これでユーザーエージェントが変更された状態になります。この状態で下記の「UAの確認」のサイトにアクセスしましょう。
※下記はAprico内の確認用の機能です。ぜひ利用して下さい。
(UAやブラウザ、プラットフォームなどの情報を表示しているだけのとてもシンプルなページです)
今回はInternet ExplorerにUA偽装しましたがしっかりと出来ているようです。
また元に戻す方法ですが、「Select Automatically」にチェックを入れると元のUAに切り替わります。
拡張機能を利用する
「User-Agent Switcher for Chrome」という拡張機能を使うことでもUAの切り替えが便利になります。デベロッパーツールでも十分という方は入れなくても大丈夫ですが、デベロッパーツールを開かなくても利用できるので、より手軽に利用できる利点はあるかなと思います。
「User-Agent Switcher for Chrome」は下記からインストールができます。
もちろんiOS、Androidなどスマホのユーザーエージェントも用意されていますので、必要に応じて利用しましょう。
ただしガラケーなど用意されたUA以外のユーザーエージェントが必要になった場合は先に紹介したデベロッパーツールの方法を利用するようにしましょう。
IE6で再度UAの確認をしてみると確かにIE6になっています。
UA偽装した後は、User-Agent Switcher for Chromeを再度開きUAを元に戻すことを忘れないようにしましょう。
ChromeでUA偽装
- デベロッパーツールを利用する方法: 「Network conditions」からユーザーエージェントを変更する
- 拡張機能を利用する方法: 「User-Agent Switcher for Chrome」をインストールして利用する
まとめ
いかがでしたでしょうか。UA偽装(ユーザーエージェントの変更)についてやり方を解説していきました。
基本Chromeではデベロッパーツールで事足りますが、よりUA偽装する頻度の高い方にとっては「User-Agent Switcher for Chrome」をインストールして、素早くユーザーエージェントの変更をできるようにしておいてもいいかと思います。
今回ご紹介した内容で、開発の効率が上がれば幸いです。