Share a local Next.js app
#

Expose gives your Next.js dev server a public HTTPS URL, so you can receive webhooks in route handlers, test on a real phone, or send a preview to someone else.

1. Start Next.js and share it
#

npm run dev

Next.js listens on port 3000 by default. In a second terminal:

expose share http://localhost:3000

Open the URL Expose prints. With Expose Pro, add --subdomain=my-app for a URL that stays the same.

2. Allow the Expose host in development
#

Recent Next.js versions block cross-origin requests to dev-only resources such as hot reloading. If the page loads but doesn't update, or the terminal shows a blocked cross-origin request warning, add your Expose host to allowedDevOrigins in next.config.js:

module.exports = {
  allowedDevOrigins: ['*.sharedwithexpose.com'],
}

Restart the dev server after changing the config.

3. Use the public URL where your app needs one
#

Some settings must contain the public URL instead of localhost while you share the app:

  • Auth libraries: for example NEXTAUTH_URL or AUTH_URL, and the callback URL registered with your OAuth provider. See OAuth callbacks on localhost.
  • Webhook endpoints at your providers, pointing to a route handler such as /api/webhooks/stripe. See Stripe webhooks.

4. See the requests
#

The Expose dashboard at http://127.0.0.1:4040 lists every request to your app with headers, body and response, and can replay a request to a route handler.

Other ways to share
#

  • Only on your Wi-Fi: expose share http://localhost:3000 --lan gives phones and colleagues on the same network a URL and a QR code, without an account. See Local Network Sharing.
  • With a password: add --basicAuth="user:secret". See Password Protection.