How to Debug a Local Website on Android with Chrome DevTools

To debug a local website on a real Android device, enable Android Developer Options and USB debugging, connect the phone to your computer with a USB data cable, then open chrome://inspect/#devices in desktop Chrome. Enable Discover USB devices, authorize the computer on the phone if prompted, and click Inspect next to the Android Chrome tab. To load your computer’s local development server on the phone, configure Chrome’s USB port forwarding and visit the forwarded device-side localhost port in Android Chrome.

This guide covers the physical-device workflow, USB access to localhost, custom local hostnames, manual adb forwarding, troubleshooting, and when each approach fits. The Chrome menu labels can change; follow the current labels shown in your installed Chrome build.

1. Inspect an Android Chrome tab from your computer

Enable Developer Options and USB debugging on Android. Android’s settings differ by device and OS version; use Android’s instructions for enabling Developer Options, then turn on USB debugging.
Open the device inspector on your computer. In desktop Chrome, go to chrome://inspect/#devices. Make sure Discover USB devices is selected.
Connect the phone directly over USB. Use a cable that supports data transfer, not just charging. Unlock the phone. When Android asks whether to allow USB debugging from this computer, accept the prompt.
Open the page on the phone. Start Chrome on Android and navigate to the page you want to debug. The desktop device page should show the device model and its open Chrome tabs.
Open DevTools. Click Inspect beside the desired tab. Use Elements, Console, Network, Sources, and the other DevTools panels as needed. If Android asks for authorization and the device appears offline or pending authentication, unlock it and accept the prompt.

The Android Chrome version determines which DevTools version opens on the computer, so the interface may differ from desktop DevTools or from screenshots in older instructions. See Chrome’s official remote debugging documentation.

Inspecting and interacting with the page

Use Elements to inspect the DOM and computed styles. The element selection tool can need re-enabling after a touch on the device. Toggle Screencast when you need to view and interact with the phone’s page from the computer: clicks act as taps, and computer keystrokes go to the device. Chrome cautions that screencasting can reduce frame rates, so turn it off when measuring scroll or animation performance.

2. Open your computer’s local server on Android over USB

localhost on Android means the phone itself. A development server running on your computer is a different machine from the phone, so simply entering http://localhost:PORT on Android will not reach that server. USB port forwarding maps a port on the phone to the server address and port on your computer.

Complete the USB debugging connection above and confirm that the device appears in chrome://inspect/#devices.
Open Port forwarding in the device inspector and enable port forwarding. Chrome’s page shows a default localhost:8080 mapping.
Add a mapping. For example, set the device port to 5000 and the local address to localhost:5000 if your development server listens on port 5000 on the computer.
On Android Chrome, open http://localhost:5000. Use the device-side port from the mapping; it does not have to match the computer-side port.

For example, the device port can be 5000 while the computer address is localhost:3000. Then open http://localhost:5000 on Android. Confirm that the development server is running and listening on the computer-side address and port you entered. Chrome documents that forwarded traffic travels over USB, so this setup does not depend on the network configuration. See Access local servers and Chrome instances with port forwarding.

Which connection method should you choose?

Need	Use	Trade-off
Inspect an Android Chrome tab	`chrome://inspect/#devices` over USB	Requires USB debugging and an authorized device.
Open a server running on your computer	Chrome USB port forwarding	Map the device port to the correct computer-side address and port.
Test a custom local hostname	Proxy-based custom-domain mapping	Requires hosts-file and proxy setup, plus restoring Android’s Wi-Fi proxy settings afterward.
Connect directly to Chrome DevTools Protocol	Manual adb forwarding	More setup; intended for less common protocol access and automation needs.

3. Use a custom local hostname

If your application depends on a hostname such as chrome.devtools, mapping a device port to the computer’s localhost alone may not reproduce the hostname. Chrome’s documented approach uses a hosts-file entry on the development computer and a proxy-based mapping:

Add a hosts-file entry on the computer that maps the desired custom hostname to the computer’s localhost address.
Configure a proxy on the computer, using a different port from the development web server. Chrome names Charles, Squid, and Fiddler as proxy examples; the documentation does not require one particular proxy.
In chrome://inspect/#devices, enable port forwarding and forward a device-side port to the proxy’s computer-side port.
On Android, edit the Wi-Fi network’s proxy settings. Set the manual proxy host to localhost and its port to the forwarded device-side port.
Open the custom hostname in Android Chrome. Include the web server’s non-standard port in the URL when needed.
When finished, restore the Android Wi-Fi proxy setting so ordinary browsing uses the network’s normal configuration.

This workflow adds more configuration than forwarding a standard local server port. Use it when the hostname itself matters to the behavior under test, and keep track of both the proxy port and web server port.

4. Optional: forward Chrome DevTools Protocol with adb

Most developers should start with chrome://inspect/#devices. Manual adb forwarding is useful in less common cases where you need direct Chrome DevTools Protocol (CDP) access or automation.

Enable Android Developer Options and USB debugging, connect the phone, and authorize the computer.
Check that adb can see the device:

adb devices -l

Forward a local computer port to Chrome’s debugging socket on the device:

adb forward tcp:9222 localabstract:chrome_devtools_remote

List page targets and browser information from the computer:

curl http://localhost:9222/json
curl http://localhost:9222/json/version

The /json endpoint lists page targets; /json/version exposes browser-target information. This is a protocol connection, not the same thing as forwarding your development server’s port. For the documented manual workflow and adb Wi-Fi context, see Chrome’s remote debugging guide.

5. Troubleshoot common problems

Symptom	Likely cause	What to do
Device does not appear in `chrome://inspect`	USB debugging is off, cable is charge-only, connection is through a troublesome hub, or the device is locked.	Enable USB debugging, connect directly to the computer, unlock both screens, unplug and reconnect, and try a cable that lets the computer access files on the phone.
Windows does not detect the phone	A device-specific USB driver may be needed.	Install the phone maker’s USB driver if required, then reconnect and check device discovery again.
Device is offline or waiting for authorization	The phone has not approved this computer’s debugging key.	Unlock the phone and accept the USB debugging prompt. If no prompt appears, reconnect with desktop DevTools open and the Android home screen visible, and prevent the phone from sleeping during setup. Chrome also lists trying PTP USB mode or revoking USB debugging authorizations as possible troubleshooting steps; settings vary by device.
Android can’t load the forwarded local page	Port forwarding is disabled, the wrong device-side port is in the URL, the computer-side address or port is wrong, or the server is not running.	Check the mapping and its status in the device inspector, verify the server is listening on the configured computer-side port, and browse to the mapped device-side port.
Custom hostname does not resolve or load	The hostname, proxy, or port mapping is incomplete, or proxy and server use a conflicting port.	Check the computer hosts entry, ensure the proxy and web server use different ports, verify the Android Wi-Fi proxy points to the forwarded proxy port, and include a non-standard server port in the URL when necessary. Restore the Wi-Fi proxy after the session.
Scrolling or animation looks slower while mirrored	Screencast affects frame rates.	Turn screencast off while measuring scrolling or animation performance.
`adb devices -l` lists no usable device	USB debugging, authorization, cable, or adb connection is not ready.	Resolve device authorization and USB connectivity first; then repeat the adb command and forwarding step.

6. Reliability, performance, and cost

USB port forwarding: it sends traffic through the USB connection, so it does not rely on the phone and computer sharing a working Wi-Fi network. The device must remain connected and authorized, and the local server must remain available.
Custom hostname proxying: it adds multiple configuration points. Record the proxy and server ports and restore Android’s proxy setting when done to avoid affecting later browsing.
Performance profiling: remote inspection is useful for reproducing behavior on the real device, but screencast can reduce frame rates. Disable it for visual performance measurements.
Cost: the documented workflows use Chrome, USB, and adb tools; no paid service is required by these instructions. A data-capable USB cable is required for the physical USB workflow. The cited Chrome pages provide no benchmark comparing these connection methods.

7. Capture a page screenshot without connecting an Android device

Remote DevTools is the right workflow when you need to reproduce an issue in Android Chrome, inspect live DOM state, or interact with a page on the phone. If you only need a screenshot of a URL, ScreenshotNeo is a website screenshot API and MCP server for developers. Its GET endpoint returns an image or PDF from a URL. See the ScreenshotNeo API documentation for request options.

cURL

curl -G "https://api.screenshotneo.com/v1/shot" -d access_key=YOUR_API_KEY --data-urlencode url=https://stripe.com -o shot.webp

Python

import requests

r = requests.get(
    "https://api.screenshotneo.com/v1/shot",
    params={"access_key": "YOUR_API_KEY", "url": "https://stripe.com"},
    timeout=90,
)
open("shot.webp", "wb").write(r.content)

Node.js

const q = new URLSearchParams({ access_key: 'YOUR_API_KEY', url: 'https://stripe.com' });
const res = await fetch(`https://api.screenshotneo.com/v1/shot?${q}`);

Use a ScreenshotNeo API key in place of YOUR_API_KEY and substitute the URL you want to capture. For command-line automation, cURL writes the response to a file; Python writes the response bytes; Node.js returns the fetch response for your code to handle.

Or skip the browser setup

ScreenshotNeo removes cookie banners, popups, and chat widgets before the shot. Bot checks, blank pages, failed loads, timeouts, and cache hits are never billed; response headers identify the page verdict and billing status. An MCP server lets AI agents use take_screenshot, get_page_info, and capture_pdf. The Free plan includes 1,000 screenshots a month with no card; paid plans start at $5 for 3,000 screenshots.

curl -G "https://api.screenshotneo.com/v1/shot" -d access_key=YOUR_API_KEY --data-urlencode url=https://stripe.com -o shot.webp

8. FAQ

Can I debug a website served from my computer without Wi-Fi?

Yes. Chrome’s USB port forwarding carries the forwarded traffic over the USB connection, so it does not depend on the network configuration.

Does this inspect every browser on Android?

The documented workflow lists tabs from Android Chrome. The available tabs and inspection behavior depend on the browser and its debugging support.

Why does DevTools look different from the one on my computer?

The Android Chrome version determines the DevTools version opened on the development computer.

Should I use adb forwarding for ordinary debugging?

Usually no. Start with chrome://inspect/#devices; use manual adb forwarding when direct CDP access is specifically useful.