作成日:2018-03-05, 更新日:2018-05-22
基本
私の環境はWin10、アンドロイド5.0。
１．アンドロイドで「開発者向けオプション」の設定
２．PCとアンドロイドをUSB接続
５．PCでデバッグ
アンドロイドで「開発者向けオプション」の設定
アンドロイドで「開発者向けオプション」を「オン」にして「USBデバッグ」をチェック
開発者向けオプションの表示
どっちのやり方をするにしてもアンドロイド端末を「開発者向けオプション」が利用できるようにする必要あり。
「設定」→「端末情報」をタップ。ソコに「ビルド番号」があるかチェック。
無ければ「ソフトウェア情報」をタップ。ソコに「ビルド番号」があるかチェック。
無ければAndroidバージョンを調べて、Googleに聞く。
「ビルド番号」を５回ぐらいタップする。もっと多くタップする必要があるかもしれない。
すると「設定」→「開発者向けオプション」が表示されるようになる。
開発者向けオプションの非表示
こっちはどうでもいいけど・・・いずれ必要になるかもしれないからメモっておく。
「設定」→「アプリ」から「タブ：すべて」の中から「設定」をタップし、「データを消去」。
※自己責任で。
PCとアンドロイドをUSB接続
PCとアンドロイドをUSB接続したら、PCとアンドロイドでChromeを起動。
※USB接続する前が間違いないような気もする。どっちでも良いと思う。
PCでデバッグ
PC:Chrome(バージョン: 64.0.3282.186（Official Build） （64 ビット） ：2018/03/06時点)
１．PCのChromeで「デベロッパーツール」を起動。
２．「デベロッパーツール」のメニューから「More tools」→「Remote devices」をクリック
３．「Remote devices」にアンドロイド端末が表示されるまで待つ
４．「Remote devices」に表示されたアンドロイド端末の情報にURL等が表示されていると思うので「Inspect」をクリック
５．あとはPCでもアンドロイド端末のどちらでもChromeの操作を行って好きにデバッグする。
・どっかのタイミングでアンドロイド側で何か許可するように求められていると思うので許可しておく
・「Remote devices」に表示されたアンドロイド端末から「New tab」で新しいURLを入れるのもOK
メモ：Chromeと標準ブラウザ
挫折したけど、再調査するとき用のメモ。
PCとアンドロイド端末をUSB接続して、ログ出力させる・・・予定。
基本
標準ブラウザでデバッグしたいならアンドロイド端末だけでOKとある。
「PCと接続してデバッグが出来ない」という意味なのか「PCと接続してデバッグが出来るけど、アンドロイド端末単体でもOK」という意味なのかは不明。
標準ブラウザでのデバッグ
標準ブラウザの場合はアドレスバーに「about:debug」を入力すればOK。
・・・私の端末（ZenFone 2 / ASUS_Z00AD, ver 5.0）では出てこない。
しょうがないので（本来のやり方らしいが）AndroidSDKってのを使う。
「C:\Users\〇〇〇\AppData\Local\Android\Sdk\platform-tools\adb.exe」をCMDで実行させればいい。
情報が新旧あって・・・何が正しいかは分からない。
▼PATHを通さないならひとまずカレントを移しておく。
> cd C:\Users\〇〇〇\AppData\Local\Android\Sdk\platform-tools
接続しているデバイスを表示
> adb device
を実行するも「adb: usage: unknown command device」と「deviceっていうコマンドなんて無い」って怒られる。
ひとまずCMDで下記のように実行
> adb
これでおそらくヘルプが表示されるはず。
各サイトでは「adb device」を実行とあるけど、ヘルプには「adb devices」と「device」の後に「s」がついた「devices」。
> adb devices
これを実行するとアンドロイド端末に何かを許可してってアラートが出ると思うので許可してあげる。
▼許可する前だと下記のような感じ。
> adb devices List of devices attached * daemon not running; starting now at tcp:5037 * daemon started successfully XXXXXXXXXXX unauthorized
▼許可した後だと下記のような感じ。
> adb devices List of devices attached XXXXXXXXXXX device
ログの表示
> adb logcat
これがリアルタイムでログが吐き出される・・・終了させるには「ctrl + c」
ブラウザのみログ出力
grepしておく→CMDだと「findstr」になるっぽい。
> adb logcat -v time | findstr browser
※「-v time」は日時表示。
アンドロイドの標準ブラウザの場合
javascriptで「console.log(〇〇〇)」をした場合、「アンドロイド＋Chrome」はログ出力されるけど「アンドロイド＋標準ブラウザ」は出力されない。
原因は・・・不明。