こんにちは。ワラゴンです。
先日、どうしてもこのサイトをスマホのChromeがどのように扱っているかを知りたくなって、環境を整えようとしたのですが、どっさりハマってしまったので、恨みを晴らすためにブログのネタにしておきます。
環境
PC: Windows 10 64bit
Android 端末: Samsung Galaxy S8
基本的な流れ
Windows PC からスマホをデバッグする時の基本的な流れは以下の記事が参考になります。
■Qiitaより
Android の Chrome で開発者ツールを使う方法
念のために、ここでも簡単にまとめておきます。
事前準備
・PCとスマホ、それぞれを接続するUSBケーブルを用意
・スマホ(Android)の開発者向けオプションを有効にして、USBデバッグをONにする
USBデバッグをONにするには2段階の手順が必要です。
1. 開発者向けオプションを有効にする
設定 -> 端末情報 -> ソフトウェア情報 と進み 「ビルド番号」を7回タップする。
※Androidのバージョンによって「ビルド番号」場所が異なります。とにかく「ビルド番号」を探すようにしましょう。
2. USB デバッグをONにする
上の作業が終わると、「設定」一覧の一番下に「開発者オプション」という項目が出現しています。
これを開いて、USB デバッグという項目をONにします。
何やらメッセージが出ると思いますが、OKで良いです。
・PCに Google USB Driver をインストールする
もしかしたら既に入っているかもしれません。
私は既に入っていました。
操作
1. PCとスマホをUSBケーブルでつなぐ
スマホの画面で「デバッグモードに入るけどいい?」と聞かれるので、OKとする。
2. PCのChromeでアドレスバーに「chrome://inspect/#devices」と入力して、デベロッパーツールを表示
3. Remote Targetの下に、スマホの端末情報が出ているので、inspectをクリック
これだけです。
これだけで、いつものデベロッパーツールがPC上で表示され、スマホ側のChromeがサーバとどんなやり取りを行っているのかを見ることができます。
すごいですね。
ところが、私の場合はうまく行きませんでした。
デベロッパーツール上にスマホが表示されない(認識されない)
上の手順の1.のところで、スマホをPCにつないでも、ピンポンと音はするものの、スマホで何かダイアログが出るわけでもなく、PCの方ではRemote Targetの下に何も表示されない。
以下のような状況。
良く調べてみると、どうも Samsung の Galaxy シリーズによく出る症状の様子。
以下の記事が参考になりました。
■Stack overflowより
Chrome DevTools Devices does not detect device when plugged in
このStack overflowで扱っているのはSamsung Galaxy S4 なのでちょっと古いかな?と思って書かれている処置を実施するのをためらっていましたが、最終的にはこの記事に従ったところ、うまくデバッグモードに入ることができました。
Samsung Galaxy がデベロッパーツールで認識されない場合の解決手順
というわけで、私と同じように困っている人がいるかどうかは分かりませんが、私が行った手順をまとめておきます。
1. 上の準備と手順を終わらせる
2. Android SDK をインストールする(ソフトのダウンロードやインストールであれこれ2時間くらいかかると思います)
3. SDK platform tools をインストールする
実際には、Android SDK をインストールして、最初に起動したときに最新版がインストールされたので、特に作業なし
4. Minimal ADB and Fastboot をインストールする
おそらく、これが一番大きかったと思います。
2と3はやる意味あったのかどうか疑問です、、、
5. スマホをPCにつないだ状態で、ADBを起動する
手順2と3は、とにかくAndroid SDKをインストールすれば良いので詳しく説明しませんが、手順4と5は少し説明を加えておきます。
4. Minimal ADB and Fastboot をインストールする
このサイトに行って、最新版のMinimal ADB and Fastboot をダウンロードします。
英語のサイトなので、どこからダウンロードしていいか迷いますが、以下の画像のあたりを探してダウンロードしました。
.exeを起動すると、スタートメニューを作るかどうか、どこにインストールするか、を聞かれますが、私は何も変更せずに次に進みました。
スタートメニューに「Minimal ADB and Fastboot」というのができているので、起動するとコマンドプロンプトが立ち上がります。
注意: Don't create a Start Menu Folder にチェックを入れた場合
インストールするときに、余分なスタートメニューを作りたくないという人は多いかもしれません(私がそうなので、、、)。
そんな人は、上の画面でDon't create a Start Menu Folderにチェックを入れてしまうかもしれません(下図参照)。
その場合は、スタートメニューが作られていないので、ツールがインストールされた場所を開いて、直接起動します。
Win 10でデフォルトのままだと、ツールは「C:\Program Files (x86)\Minimal ADB and Fastboot」にインストールされます。
インストールされたフォルダを見ると、以下のような構成になっています。
ここで、「cmd-here.exe」をダブルクリックすると、コマンドプロンプトが開きます。
5. スマホをPCにつないだ状態で、「adb devices」と打つ
スマホをPCにつないだ状態で、しかも、スマホの方はなるべくロックを解除した状態にしておきます。
PCのコマンドプロンプトのほうで、adb devicesと打つと、晴れて「USB デバッグモードに入るけどいい?」と聞かれました!
ここで許可(allow)を押して、晴れてPC側のデベロッパーツールで認識させることができました。
スマホでChromeを開くと、以下のように開いているページの情報が出てくるようになります。
あとは、inspectをクリックしてデベロッパーツールを立ち上げるだけでいつものデバッグをすることができます!
補足
adb コマンドはadbのサービスが起動していることが前提のようです。
何らかの理由でadbのサービスを停止・再起動する必要がある場合は、以下のコマンドを実行します。
adb の停止: adb kill-server
adb の起動: adb start-server
以下のようなメッセージが出る場合は、もしかして自分でコマンドプロンプトを開いていないでしょうか?
'adb' is not recognized as an internal or external command, operable program or batch file.
adb コマンドは、adbがインストールされたフォルダでしか実行できない(※1)ので、スタートメニューの「Minimal ADB and Fastboot」でコマンドプロンプトを表示するか、ADBがインストールされたフォルダ(上で説明した所)に行ってcmd-here.exeを起動するかしてから、adb コマンドを使う必要があります。
※1:adb.exe を絶対パスで指定すればどこからでも実行はできます。
まとめ
いかがでしたでしょうか?
日本ではGalaxy シリーズはそんなに人気はないんでしょうかね?
私は気に入っているんですが、、、
まあ、今回の記事は、Androidアプリを開発するような人には当たり前な内容だったかもしれません。
でもせっかくどっぷりハマったので、ブログのネタにでもしないと報われないと思ったのでまとめてみました。
誰かのお役に立てるといいのですが、、、