GoogleChromeのUser Agent(ユーザーエージェント)の変更・偽装方法!

GoogleChromeのUser Agent(ユーザーエージェント)の変更・偽装方法を解説します。PCのGoogleChrome上でUser Agent(ユーザーエージェント)を変更・偽装する方法を使って、スマホなどの別端末のwedサイト表示を確認できます。

GoogleChromeのUser Agent(ユーザーエージェント)の変更・偽装方法!のイメージ

目次

  1. 1ChomeのUser Agentを変更・偽装する方法とは?
  2. UA(ユーザーエージェント)はWebサイトの構築に便利
  3. 2デベロッパーツールでChrome User Agentを偽装
  4. デベロッパーツールを開く
  5. 3拡張機能User-Agent Switcher for Chromeを偽装
  6. User-Agent Switcher for Chromeをインストール
  7. 4デバイスエミュレータでChrome User Agentを偽装
  8. スマホをエミュレータする
  9. 5Network conditionsでChrome User Agentを偽装
  10. Network conditionsを表示
  11. 6Chrome User Agentは機能性で選ぼう!
  12. GoogleChromeの記事が気になった方にはこちらもおすすめ!

ChomeのUser Agentを変更・偽装する方法とは?

User Agent(ユーザーエージェント、略称UA)とは、ウェブサイトを閲覧する際に開示される、閲覧している端末の種類(PC、スマホ、タブレットなどの種類、またはiPhone、iPadなどの銘柄)やそのOSの種類(Windows、iOS)、アクセスしているブラウザ(Google Chrome、Microsoft Edge、Firefox)などのユーザー情報のことです。

User Agent変更

私たちがwebサイトで閲覧するたびに、そのwebサイトに対して自分の端末のこうしたユーザー情報をその都度、開示しています

User Agent変更

丁度、他人の家に訪問するときに「どちらさまですか」と聞かれて「〇〇です」と答えることで信用されて家のドアを開けてもらえるようなイメージで、webサイトにアクセスするときは必ずこのUser Agent(ユーザーエージェント、略称UA)をwebサイト側に開示することになっています。

User Agent変更

つまり、このUser Agent(ユーザーエージェント、略称UA)からそのwebサイトの利用者の傾向も割り出せます。WindowsPCのユーザーが多い、スマホからの閲覧者が全体の何割、といったユーザー分析にも活用されます。

User Agent変更

このUser Agent(ユーザーエージェント、略称UA)は、あえて便宜上、変更・偽装できます。なぜそのようなことをする必要があるのかというと、現在は閲覧する端末に合わせてwebサイトのデザインを用意していることが多いため、普通にwebサイトを閲覧するとその端末に合わせた画面にしかアクセスできません。

User Agent変更

これは、User Agent(ユーザーエージェント、略称UA)を基に、webサイト側でその端末に合った画面に切り替えているためです。しかし、User Agent(ユーザーエージェント、略称UA)を変更・偽装することで、別の端末用の画面を閲覧できるのです。

User Agent変更

アプリによってはPCとスマホの両方で閲覧できても、スマホの画面からしか使えない機能がある場合があります。こうした場合でも、User Agent(ユーザーエージェント、略称UA)を変更・偽装することで、PCからでもスマホの画面を表示させて操作することが可能です。

User Agent変更

Chromeでは、付属のツールや拡張機能を使ってUser Agent(ユーザーエージェント、略称UA)を変更・偽装する方法が複数用意されています。以下、User Agent(ユーザーエージェント、略称UA)に関する情報や変更・偽装の方法について説明します。

User Agent変更

UA(ユーザーエージェント)はWebサイトの構築に便利

User Agent(ユーザーエージェント)の変更・偽装の方法を知っておくと、自分がアクセスするWebサイトの構築に大変便利です。

User Agent変更

例えばインスタグラムの場合は、普通にPCでWebサイトにアクセスした場合は閲覧しかできません。画像投稿する機能がPC用のwebサイトにはないのです。しかし、User Agent(ユーザーエージェント)の変更・偽装の方法を使って、PCでスマホ用の画面を表示できれば、PCから画像投稿が可能です。

User Agent変更

また、webサイトの管理者にとってもUser Agent(ユーザーエージェント)の変更・偽装の方法を知っておくことは大切です。webサイトの実際の見え方・操作性は、webサイトを閲覧する端末環境によって左右されます。PCかスマホかという点だけでなく、OSやブラウザによっても違ってきます。

User Agent変更

そうした点を踏まえ、自分のwebサイトの実際の見え方・操作性などを確認するために、自分ですべての端末環境を用意するのは大変な労力です。しかし、このUser Agent(ユーザーエージェント)の変更・偽装の方法を使えば、自分のPC上であらゆる端末環境を再現して、見え方・操作性を確認できます。

User Agent変更

webサイトの開発者にとっては、User Agent(ユーザーエージェント)の変更・偽装の方法はさらに重要なスキルになります。webサイトの開発途中段階でそれぞれのOSやブラウザ、端末ごとの見え方・操作性を確認しながら開発を進めていくことで、作業の効率化や作品としてのwebサイトのクオリティを高めていくことが可能です。

User Agent変更

レスポンシブルデザインを使ったWebサイト

端末に合わせたwebサイトデザインの傾向としてレスポンシブデザインというものがあります。これはwebサイトの運営は一元管理しながらも、webサイトの見せ方として、アクセスしてくる端末に合わせてデザインを切り替えて表示するという方式のことです。

User Agent変更

このデザインの切り替えに利用されているのが、閲覧者がアクセスしてきたときに開示されるUser Agent(ユーザーエージェント)です。

User Agent変更

レスポンシブルデザインは、主にスマホ対応としてGoogleも推奨している方式ですが、デメリットも少なからずあります。端末によってwebサイトのデザインは変わるので見やすくなりますが、そもそもPCで閲覧するwebサイトをスマホでも閲覧するということであり、webサイトの情報量が多く、スマホでは読み込みに時間がかかる場合があります。

User Agent変更

各種デバイスの表示を確認

そうした点も踏まえて、webサイトの管理者にとって、レスポンシブルデザインを構築した後に実際のスマホからの見え方を確認することは重要なことです。User Agent(ユーザーエージェント)の変更・偽装の方法を使えば、PCでスマホからみたwebサイトの見え方を確認できます。

User Agent変更

Twitterでの口コミ

Twitterの口コミ記事でも「PCからスマホのページを表示したい」という声が見受けられます。現在は、webサイトを閲覧できる端末の種類も増え、個人でPCやスマホなど、複数の端末を持つことも多いため、こうしたニーズが生まれているのかもしれません。

User Agent変更

デベロッパーツールでChrome User Agentを偽装

Chromeにはデベロッパーツールという機能が付属しています。デベロッパーツールとは、Webサイトをデザインするときに使う「要素の検証機能」ツールです。具体的には、webサイトのHTMLなどを置き換えてテスト表示させたり、他のwebサイトの構造やコードなどを参考に閲覧したりできるツールです。

User Agent変更

デベロッパーツールを使えば、User Agent(ユーザーエージェント)の変更・偽装によって、Chrome上でFirefoxやスマホの画面を表示させ、それぞれの画面サイズでの見え方を確認できます。

User Agent変更

デベロッパーツールを開く

デベロッパーツールを開く手順を説明します。Chromeの画面右上の「設定アイコン」をクリックします。

User Agent変更

開いたウインドウのメニューから「その他のツール」「デベロッパーツール」をクリックします。

User Agent変更

また、コマンドでデベロッパーツールを開く場合は、Windowsでは「F12」キー、もしくは「Control + Shift + I」を押します。Macでは「Control + Option + I」を押します。

User Agent変更

デベロッパーツールでUAを変更する

デベロッパーツールが表示されるので、画面右上の「設定マーク」をクリックします。

User Agent変更

開いたウインドウから「Setting」を選択します。

User Agent変更

切り替わったウインドウ内の左側のメニューから「Devices」を選ぶと、端末の一覧が表示されます。この一覧の中から表示を確認したい端末を選んでチェックを入れます。ここでチェックの入った端末が、後述する「デバイスエミュレータ」で選択できる端末になります。

User Agent変更

また、この画面で任意のUAを一覧に加えることもできます。「add custom device」をクリックすると入力欄が表示されるので、UAの名称と任意のUA(ユーザーエージェント文字列)を入力します。入力後に「Add」をクリックします。

User Agent変更

ユーザー エージェント文字列とは、UAを識別するための文字列です。例えば、Firefox30.0であれば、「Mozilla/5.0 (Windows NT 6.1; WOW64; rv:30.0) Gecko/20100101 Firefox/30.0」というユーザー エージェント文字列が割り当てられています。

User Agent変更
ThumbGoogleChromeのブックマーク(お気に入り)をインポート/エクスポートする方法!
Google Chromeでよく見るサイトを検索してアクセスをかける方が多いですが、ブックマ...

拡張機能User-Agent Switcher for Chromeを偽装

Chromeは、User Agent(ユーザーエージェント)を変更・偽装できる拡張機能として「User-Agent Switcher for Chrome」を用意しています。この拡張機能を使って、スマホや他のブラウザとしてUser Agentを偽装してwebサイトを閲覧できます。拡張機能なので使い勝手も良く便利な機能です。

User Agent変更

Chromeの拡張機能は「Chromeウェブストア」で入手できます。Chromeの拡張機能はほとんどが無料ですが、中には有料の拡張機能もあります。「User-Agent Switcher for Chrome」は無料の拡張機能です。「Chromeウェブストア」で拡張機能名で検索することで、ダウンロードページを見つけられます。

User Agent変更

User-Agent Switcher for Chromeをインストール

拡張機能「User-Agent Switcher for Chrome」のインストールの手順を説明します。まず、Chromeの新規画面の右上にある「アプリのアイコン」をクリックします。

User Agent変更

切り替わった画面で「ウェブストア」をクリックします。

User Agent変更

Chromeウェブストアの画面が表示されるので、検索枠で「User-Agent Switcher for Chrome」を検索します。

User Agent変更

「User-Agent Switcher for Chrome」が見つかったらページを開いて画面右にある「Chromeに追加」をクリックしてインストールします。

User Agent変更

User-Agent Switcher for ChromeでUAを変更する

拡張機能がインストールされると、Chrome画面上方のツールバーにアイコンが表示されます。アイコンをクリックするとメニューが開くので、UAを変更・偽装したいブラウザを選択すれば閲覧できます。用意されているブラウザは「Chrome、Internet Explorer、iOS、Android、Windows Phone、Firefox、Opera、Safari」になります。

User Agent変更

「User-Agent Switcher for Chrome」でも任意のUAを入力できます。アイコンを右クリックして、表示されたウインドウから「オプション」を選びます。

User Agent変更

入力画面が表示されるので、UAの名称と任意のUA(ユーザーエージェント文字列)を入力します。

User Agent変更
ThumbGoogleChromeの拡張機能とは?オススメのアドオン13選を紹介!
Google Chromeをより便利に利用するための拡張機能を紹介します。Google Ch...

デバイスエミュレータでChrome User Agentを偽装

Chromeは前述した「デベロッパーツール」内に搭載された、「デバイスエミュレータ」でUAを変更・偽装したwebサイトの閲覧が可能です。

User Agent変更

スマホをエミュレータする

デベロッパーツールの画面を開いて、画面中央上になる「スマホマーク」をクリックします。

User Agent変更

デバイスツールバーからデバイスを選択する

「スマホマーク」をクリックすると画面左上に「Responsive」と表示されたデバイスツールバーが表示されるのでタブをクリックします。開いたウインドウから、UAを変更・偽装したい端末を選択すれば閲覧できます。このウインドウの一覧は前述したデベロッパーツールの「Setting」→「Devices」で設定した端末です。

User Agent変更
ThumbGoogleChromeでFlashPlayerを有効/無効設定する方法!更新や注意点は?
Chrome上でFlashPlayerの有効化、無効化する設定方法と注意点を紹介します。Fl...

Network conditionsでChrome User Agentを偽装

他にデベロッパーツールを使った方法で、「Network conditions」という設定を使ってUAを変更・偽装して閲覧する方法があります。

User Agent変更

Network conditionsを表示

デベロッパーツールの「設定マーク」をクリックし、「More tools」「Network conditions」を選択します。

User Agent変更

Network conditionsからUAを変更する

画面下方に「Network conditions」のウインドウが表示されます。デフォルトでは「Select automatically」にチェックが入っているので、これを外します。

User Agent変更

チェックを外すとブラウザを選択できるようになるので、右端のタブをクリックします。

User Agent変更

選択できるブラウザ一覧のウインドウが開くので、UAを変更・偽装したいブラウザを選択します。用意されたブラウザは「Android、BlackBerry、Chrome、Edge、Firefox、Googlebot、Internet Explorer、Opera、Safari、UC Browser」です。

User Agent変更

また、ブラウザは選択せず、下の入力欄に任意のUA(ユーザーエージェント文字列)を入力することもできます。

User Agent変更

設定が完了したら、画面左上の更新マークをクリックすれば、選択したブラウザで閲覧できます。

User Agent変更

Chrome User Agentは機能性で選ぼう!

Chromeでは、User Agent(ユーザーエージェント)を変更・偽装してwebサイトを閲覧する方法が数種類用意されています。それぞれの方法に特長があるので、一度一通り体験してみて、自分のニーズに合った方法で閲覧しましょう。

GoogleChromeの記事が気になった方にはこちらもおすすめ!

ThumbGoogleChromeのホームページ設定方法!起動時のトップページ変更方法は?
Chromeのホームページとは、Chromeを起動した時に表示されるトップページのことを言い...
ThumbChromeの文字化けを直す方法!PC/スマホで文字コードを変更しよう!
Google Chromeで文字化けが起きてしまった場合には、直す方法にはどんなものがあるの...
ThumbChromeの拡張機能で翻訳!Google翻訳より使えるアドオンも紹介!
Google社が提供するウェブブラウザー、Chromeには拡張機能があるのをご存知でしょうか...
ThumbChrome拡張機能の設定方法!管理画面での削除やシークレットモードでの適用方法は?
Chromeブラウザの拡張機能の追加方法や設定、管理方法をご紹介します。Chromeブラウザ...
ThumbGoogleChromeの拡張機能とは?オススメのアドオン13選を紹介!
Google Chromeをより便利に利用するための拡張機能を紹介します。Google Ch...

関連するまとめ

Original
この記事のライター
KOUSUKE
困ったときに役に立つ情報、今気になっている情報をピックアップして分かりやすく解説していきます。