Debug a Web page in your Android device in desktop Chrome

Preparatory work

1, desktop version of Chrome

2, Android device (with Chrome browser installed)

3, ANDROID-SDK

ANDROID-SDK Installing and setting up SKD installation

Download ANDROID-SDK Development Kit from http://developer.android.com/sdk/index.html, install, execute SDK Manager.exe, install Android SDK Platform-tools Toolkit.

Environment variable configuration:

Add path to environment variables and add paths <sdk>/platform-tools;

After adding, execute adb in the cmd window and see the following information indicating that the configuration was successful.

Android device working on USB debug option

Go to Settings, select developer Options, check USB debug

Turn on the USB page debug option in Chrome above Android device

Start debugging to prepare for device detection

After connecting the data cable, go to the cmd command line and enter the ADB devices to see if there is a list of devices.

Chrome shortcuts

Add Chrome shortcut to Desktop, modify target: <path>\chrome.exe--remote-debugging-port=9222--user-data-dir=remote-profile

Click the shortcut to start Chrome, and in the browser address bar, enter: localhost:9222

There are thumbnails to choose from. Once clicked, if the page cannot be displayed, configure the host file

Host Configuration

Enter C:\Windows\System32\drivers\etc, edit the host file, and add the following configuration.

203.208.46.178 chrome-devtools-frontend.appspot.com

Unable to save permissions, please find related tutorials.

Debug Page

After the previous work is done, click on the thumbnail in localhost:9222 to go to the Debug page:

You can see the console, and you can see the printing information in the console window.

Debug a Web page in your Android device in desktop Chrome