Overview Because our primary users are on mobile web, testing on physical devices is mandatory. I use Cloudflare Tunnels (cloudflared) to expose our local development environment to mobile devices.

Why Tunnels? Mobile browsers strictly enforce Secure Contexts (https:// or localhost) for hardware permissions like the Camera, Microphone, Geolocation, and Gyroscope.

• Local Area Network (LAN): Accessing the dev server via a local IP (e.g., http://192.168.x.x:3000) is flagged as an insecure origin, causing Snap AR camera permissions to fail.
• USB Port Forwarding: This maps directly to localhost and works perfectly for Android, it is not supported on iOS Safari.

cloudflared solves both issues simultaneously by wrapping the local Next.js server in a temporary, secure https:// URL that is accessible from any mobile device.

Cloudflared Setup & Usage

1. Install Cloudflared: Install the CLI tool (e.g., via Homebrew: brew install cloudflared) or from the official Cloudflare docs.

2. Start Local Server: Run your Next.js development server normally.

3. Start the Tunnel: In a new terminal tab, run the tunnel command

   cloudflared tunnel —url localhost:3000

4. Test on Device: Open the generated https://[random-words].trycloudflare.com URL