Skip to the page

Guides

How to open localhost on your phone

On a phone, localhost means the phone itself. Reach your dev server over your Wi-Fi, or with an https link that works on any network.

Updated

Type localhost:5173 into your phone's browser and nothing loads. On a phone, localhost means the phone itself, and your dev server runs on your computer. There are two ways to reach it: over your Wi-Fi, or with a public link.

On the same Wi-Fi

Your phone can reach your computer at its address on the local network, as long as both are on the same Wi-Fi and the dev server listens on that network.

Let the dev server listen on your network

Most dev servers listen only on localhost, which turns the phone away. Vite and Astro take --host:

npm run dev -- --host

Next.js already listens on every address with next dev. But Next.js 16 blocks hot reload and its other dev resources for addresses it doesn't know, and says so in the terminal: Blocked cross-origin request to Next.js dev resource. Add your computer's address to next.config.ts and restart the dev server:

import type { NextConfig } from "next"; const nextConfig: NextConfig = {  allowedDevOrigins: ["192.168.1.20"],}; export default nextConfig;

Other dev servers have a host setting too. Set it to 0.0.0.0 to listen on every address.

Find your computer's address

Vite, Astro and Next.js print it as the Network address when they start. If yours doesn't, ask the computer:

# macOS, on Wi-Fiipconfig getifaddr en0# Linuxhostname -I# Windows: look for IPv4 Addressipconfig

Open it on the phone

In the phone's browser, type the address with http:// and the port, like http://192.168.1.20:5173.

When it doesn't connect

  • The phone is on mobile data, or on another Wi-Fi such as a guest network.
  • The network keeps devices apart from each other. Office, hotel and café Wi-Fi often do.
  • A firewall on your computer turns the phone away. On Windows, when it asks, let Node.js through on private networks.
  • The address changed. Computers get a new local address now and then, so look it up again.

Even when it works, the page comes over plain http. Browsers only allow features like the camera, location and service workers on https pages and on localhost, so on the phone they stay off.

With a link that works on any network

ouicu gives your dev server a public https link, and draws it as a QR code in your terminal. Point the phone's camera at it and the site opens, on Wi-Fi or mobile data.

On macOS and Linux, install the command line tool with:

curl -fsSL https://ouicu.com/install.sh | sh

On Windows, run this in PowerShell:

irm https://ouicu.com/install.ps1 | iex

Then log in. It opens ouicu.com in your browser, where you approve this computer:

ouicu login

You need a ouicu account to log in. ouicu is in a closed beta, so accounts are for people we have invited: write to [email protected] to join.

Then share the port your dev server listens on:

ouicu share 5173

Scan the code under the link. There's no --host to add and no allowedDevOrigins to set: ouicu connects to localhost on your computer, and your dev server sees each request as coming to localhost too.

  • It works on any network, and on someone else's phone: send them the link.
  • It's https, so the camera, location and service workers work as they do on localhost.
  • Hot reload passes through: save a file and the phone updates.
  • Each request shows in your terminal, so you can see what the phone asked for and what failed.

On Free, the phone shows a short notice from ouicu first; tap Open the preview. Each browser sees it once a week for each share, and a share on Free runs for up to 2 hours.

The QR code is on the dashboard too: on the Shares page, by each live share and uploaded site. To leave it out of the terminal, add --no-qr. More in QR codes.

Which one to use

Opening localhost on a phone: the two ways
Same Wi-Fiouicu link
Set-upA dev server setting and your computer's addressInstall, log in, one command
NetworksThe same Wi-Fi onlyAny, mobile data too
Whose phoneYours, or one in the roomAnyone you send it to
Connectionhttphttps

Use the Wi-Fi for a quick look on your own phone at your desk. Use a link when the network gets in the way, when you need https, or when the phone is someone else's.