How to view VS Code Live Server on your phone

Why 127.0.0.1:5500 doesn't open on your phone

When you click Go Live, VS Code opens http://127.0.0.1:5500/index.html. 127.0.0.1, like localhost, is the loopback address, and it always means "the device I'm on". Type it on your phone and the phone tries to connect to itself, finds nothing on port 5500, and gives up.

To reach Live Server, your phone needs your computer's address on the Wi-Fi network, something like 192.168.1.14.

Method 1: One tap with DevMirror (Android)

1. Install DevMirror on your Android phone.
2. Make sure the phone and computer are on the same Wi-Fi.
3. Click Go Live in VS Code.
4. Open DevMirror. Your Live Server shows up under Live servers, labelled with your page's <title>. Tap it.

DevMirror checks ports 5500, 5501 and 5502, so it also finds a second or third Live Server if you have several projects open.

Method 2: Open it manually (any phone, including iPhone)

Step 1: Put both devices on the same network

Your phone and computer must be on the same Wi-Fi. Mobile data won't work, and neither will a separate guest network.

Step 2: Start Live Server and note the port

Right-click your HTML file and choose Open with Live Server, or click Go Live in the status bar. The status bar then shows the port, usually Port : 5500.

Step 3: Find your computer's local IP address

Your local IP almost always starts with 192.168., 10. or 172.16–172.31. Ignore addresses belonging to vEthernet (WSL/Hyper-V), Docker or VPN adapters. Your phone can't reach those.

Step 4: Open it on your phone

In your phone's browser, type your IP, a colon and the port:

Include http:// and don't use https. If your page isn't index.html, add its path: http://192.168.1.14:5500/about.html. Live reload works on the phone too: save a file and the phone refreshes.

Live Server not working on your phone? Fixes

Your firewall is blocking it

This is the most common cause. The first time Visual Studio Code accepts a network connection, Windows asks whether to allow it. If you dismissed that prompt, the connection is silently blocked. To fix it, open Windows Security → Firewall & network protection → Allow an app through firewall, find Visual Studio Code, and tick Private. Also check that your Wi-Fi is set to a Private network, not Public.

On macOS, if the firewall is on, go to System Settings → Network → Firewall → Options and allow incoming connections for Visual Studio Code.

Your phone and computer aren't really on the same network

Guest networks, public Wi-Fi and many office networks use client isolation, which stops devices from talking to each other. Some routers also separate their 2.4 GHz and 5 GHz networks. If you can't change the network, turn on your phone's hotspot and connect your computer to it. That works every time. A VPN on your computer can also block local traffic, so pause it while testing.

You used the wrong IP address

If ipconfig lists several adapters, make sure you used the one for your Wi-Fi (or Ethernet). A 172.x address from vEthernet (WSL) won't work from your phone.

Live Server only responds on the computer

Live Server normally accepts connections from other devices. If yours doesn't, tell it to listen on every network interface. Add this to settings.json, then stop Live Server (click Port : 5500 in the status bar) and start it again:

"liveServer.settings.host": "0.0.0.0"

The page loads but CSS, images or data are missing

Look for paths that only make sense on your computer: file:///C:/… or C:\… paths, and API calls to http://localhost:3000. On the phone, localhost means the phone. Use relative paths (css/style.css) and call your API by IP instead.

Wi-Fi won't cooperate? Use USB (Android)

With USB debugging enabled and Android platform-tools installed, forward the port over the cable:

Now http://localhost:5500 on the phone reaches your computer. In DevMirror, enter 127.0.0.1 and port 5500. No Wi-Fi involved.