diff --git a/docs.json b/docs.json index 5e5a778a0..c919f0378 100644 --- a/docs.json +++ b/docs.json @@ -225,6 +225,7 @@ ] }, "openhands/usage/agent-canvas/customize-and-settings", + "openhands/usage/agent-canvas/mobile-access", "openhands/usage/agent-canvas/critic", "openhands/usage/agent-canvas/acp-agents", "openhands/usage/agent-canvas/development", diff --git a/openhands/usage/agent-canvas/mobile-access.mdx b/openhands/usage/agent-canvas/mobile-access.mdx new file mode 100644 index 000000000..804073efe --- /dev/null +++ b/openhands/usage/agent-canvas/mobile-access.mdx @@ -0,0 +1,52 @@ +--- +title: Phone & Tablet Access +description: Access Agent Canvas from a phone or tablet using Tailscale or ngrok. +--- + +If Agent Canvas is running on your computer, you can access it from a phone, tablet, or another device without exposing it to the public internet. + +## Tailscale (Recommended) + +[Tailscale](https://tailscale.com/) creates a private network between your devices. No port forwarding, DNS, or firewall rules are required. + +### Setup + +1. Install [Tailscale](https://tailscale.com/download) on both your computer and your phone or tablet. +2. Sign in with the same account on both devices. +3. Find your computer's Tailscale IP in the Tailscale app. It usually looks like `100.x.y.z`. +4. Start Agent Canvas on your computer: + + ```bash + agent-canvas + ``` + +5. Open `http://:8000/` in your phone or tablet browser. + +That's it. The connection is encrypted and only devices in your Tailscale network can reach it. + + + If the mobile browser still points at `127.0.0.1` or `localhost`, open `Manage Backends` and edit the local backend's `Host / Base URL` to `http://:8000`. If it keeps reverting, clear site data for the Agent Canvas URL in your browser settings and reload the page. + + +## ngrok (Remote / Public Access) + +Use [ngrok](https://ngrok.com/) when Tailscale is not an option or when you need a temporary public URL. Because the URL is reachable from the internet, run Agent Canvas in public mode with a strong backend API key first: + +```bash +export LOCAL_BACKEND_API_KEY="" +agent-canvas --public +``` + +Then start ngrok in a second terminal: + +```bash +ngrok http 8000 +``` + +Open the ngrok forwarding URL in your phone or tablet browser. + + + Do not expose Agent Canvas over the internet without authentication. Public mode requires users to enter `LOCAL_BACKEND_API_KEY` before the backend can be used. Without authentication, anyone with the URL can use your instance and the LLM API keys configured in it. See [VM / Self-Hosted Backend](/openhands/usage/agent-canvas/backend-setup/vm) for the full remote-access setup. + + +ngrok also supports OAuth, IP allowlists, and other access controls for additional protection.