Chrome を使用して携帯電話でローカル Web コードをデバッグする

元の翻訳コンテンツ:

開発用コンピューターのネットワーク サーバー上でサイトをホストし、Android デバイスからコンテンツにアクセスします。

USB ケーブルと Chrome DevTools を使用して、開発マシンから Web サイトを実行し、Android デバイスで Web サイトを表示できます。

TL;DR

ポート転送を使用すると、Android デバイス上の開発マシンから Web サーバーのコンテンツを表示できます。

Web サーバーがカスタム ドメインを使用している場合は、カスタム ドメイン マッピング ドメインを使用してコンテンツにアクセスするように Android デバイスを設定できます。

ポート転送を設定する

ポート転送を使用すると、Android デバイスが開発用コンピューターの Web サーバー上のコンテンツにアクセスできるようになります。ポート転送は、Android デバイスの TCP ポートを開発マシンのリスニング TCP ポートにマッピングすることによって機能します。ポート間の通信は、Android デバイスと開発用コンピューター間の USB 接続を介して行われるため、接続はネットワーク構成に依存しません。

ポート転送を有効にするには:

開発マシンと Android デバイスの間でリモート デバッグを設定します。完了すると、[Android Device Check Device] ダイアログ ボックスと左側のメニューに [Connection Status] インジケータが表示されます。

DevTools の [デバイスの確認] ダイアログ ボックスで、ポート転送を有効にします。

クリックしてルールを追加します。