• 記事・論説
  • UA(ユーザーエージェント)を偽装した状態でChromeを起動する方法

UA(ユーザーエージェント)を偽装した状態でChromeを起動する方法

デザイン・イラスト 仕事ハック

デザイナーの毛利です!

今日びのクインテットはレスポンシブ前提での制作を行っていますが、まだまだ根強いユーザーエージェント(以下UA)切り分けのSP対応サイト。
Windowsのままページを確認するには、GoogleChromeの開発者ツールでスマホになりすまして確認する方法が一般的で、ほとんどはこの方法で問題なく確認できます。

数ページなら良いのですが…

開発者ツールでも特に問題は無いのですが、いかんせん数が多い時は大変です。
大量に作成したLPなどを一度に数十ページも確認する必要があるとき、タブごとに開発者ツールを起動して・・・となると、ショートカットを使っていても腱鞘炎を心配してしまうレベルです・・・汗。

要するに、開発者ツールを開かないでもUAを偽装したい

そんな都合のいい方法は~と思っていたら、意外にもあったのでご紹介します。

結果はこのようになります。

結果はこのようになります.png

やり方(超簡単)

手っ取り早く結果だけを求めたい方は以下の方法を

【1】デスクトップに、Chromeのショートカットを作成(既にある場合は、ショートカットを複製)

やり方_1.png

【2】ショートカットにわかりやすい名前を付ける

やり方_2.png

【3】ショートカットを右クリック → プロパティを開く

やり方_3.png

【4】リンク先(T) に、ショートカットのパスが書いてあるので、末尾に以下を追記してOK

--user-agent="Mozilla/5.0 (iPhone; CPU iPhone OS 10_2 like Mac OS X) AppleWebKit/602.3.12 (KHTML, like Gecko) Version/10.0 Mobile/14C92 Safari/602.1" --user-data-dir="c:\temp

※ "~~~~パス~~~~" の後ろに半角スペースを開けて追記してください

【5】ショートカットからChromeを起動し、UAを確認する

  ユーザーエージェント確認 ←から確認できます。

【6】下記のほうに表示されれば正常に動いています。おめでとうございます。

やり方_5.png

これで、開発者ツールを開かずともUAの振り分けでSP用ページが表示されるようになります。 簡単ですね。
ここで作成したショートカットはそのまま残しておき、UAを偽装する必要がある時は、偽装用ショートカットでChromeを起動すればいつでも使うことができます。

解説

ショートカットパスに書いた内容

全部つなげた場合
設定の間は半角スペースで区切ってください。

"C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" --user-agent="Mozilla/5.0 (iPhone; CPU iPhone OS 10_2 like Mac OS X) AppleWebKit/602.3.12 (KHTML, like Gecko) Version/10.0 Mobile/14C92 Safari/602.1" --user-data-dir="c:\temp
"C:\Program Files (x86)\Google\Chrome\Application\chrome.exe"

↑はショートカットを作成した際のデフォルト値をそのまま使ってください。

UA設定

--user-agent="Mozilla/5.0 (iPhone; CPU iPhone OS 10_2 like Mac OS X) AppleWebKit/602.3.12 (KHTML, like Gecko) Version/10.0 Mobile/14C92 Safari/602.1"

上記の設定では、iOS10.2のSafariで見ているという設定になります。
その他のデバイス、OSは以下を参照して状況に併せて設定してください。
UA設定一覧

作業ディレクトリの指定

--user-data-dir="c:\temp

ユーザー設定などを保存するディレクトリを指定します。
この設定が無くても動くのですが、指定が無く通常のChromeが先に起動していた場合UA設定が先に起動していた方と同じとなるため、通常版とUA偽装版を同時に起動することができなくなってしまいます。

わかりやすい場所としてc:/tempを指定していますが、パスは任意に変えても問題ありません。

ワンポイント

UA偽装版Chromeを使いたい時は、おそらくたくさんのページを確認したい時だと思いますので、以下の拡張機能を入れておくと便利です。
Pasty

◆使い方 複数のURLを一気に開く!Chromeの拡張機能「Pasty」は超便利!

※UAがiPhoneのままだとGoogleStoreが開けないので、拡張機能を入れる時だけUAをデフォルトに戻す必要があります。

アイコンも作ってシャレオツに

デスクトップアイコンが同じだと見分けづらいのでオリジナルのアイコンを設定してあげると便利です!
アイコンも作ってシャレオツに.png

以上です!


この記事を書いた人