132 views
この記事は最終更新から 458日 が経過しています。
1. やりたいこと
Androidスマホ上の Google Chromeで Webページを表示している。
このとき…
Androidスマホ版 Chrome上の DOM, Console, Network情報を
パソコン版 Chromeの開発者ツールで覗きたい。
2. やってみる
方法1: パソコンとつないでリモートデバッグする。
- PCに Google Chromeをインストールする。
- USBデバッグを有効にする。スマホで「設定」→「開発者オプション」に移動し、「USBデバッグ」を有効にする。開発者オプションが見つからない場合は、「設定」→「端末情報」→「ビルド番号」を数回タップして開発者モードを有効にする。
- スマホをPCにUSBケーブルで接続する。
- PCのChromeで chrome://inspect にアクセスする。
- Discover USB devices にチェックを入れて、接続したスマホが表示されるのを確認する。
- PC上にスマホ上で開いているページが表示されるので inspect をクリックする。これにより、新しいウィンドウが開き、そのページのDevTools(開発者ツール)が表示される。
この時点で、所望の開発者機能が使えるようになっている。