Chrome を用いたリモートデバッグ方法

端末のセンサー等を活用するアプリケーションにおいては、 ブラウザ上ではその機能が全く利用できないためにデバッグや実行時の分析が難しい場合があります。

この場合 Chrome のリモートデバッグ機能を用いて端末に接続して、 実際の端末上でのアプリケーションの振る舞いをチェックするのが便利です。

Chrome から Android に接続する方法

まずデバッグのターゲットとなる Android を接続し、デバッグするアプリケーションを開きます。 USB デバッグが有効であることを確認してください。

この状態で Chrome を開き、 Tools メニューの Inspect Devices を選択します。

リモートターゲット以下にデバッグ可能なプログラムが表示されます。inspect をクリックします。

すると新しいウィンドウが開き、ターゲットデバイスの内容が表示されます。

Console には確かに、ブラウザで実行する時と同様に console.log の内容が確認できます。

また、Network でも確かにターゲット環境からのアクセスが記録されています。

ブラウザで動作するけど、スマホからでは動作しない、という場合は、 この方法で実行時の状況を確認することが非常に有効です。