chuckbutkusandopenhands 578589af7f fix(static-server): expose runtime session key via window global (#1091)
The published `agent-canvas` binary is built with no `VITE_SESSION_API_KEY`
baked in. At runtime, `scripts/static-server.mjs --session-api-key <key>`
injects the key into `index.html`, but only as a write to
`localStorage["openhands-agent-server-config"].sessionApiKey`.

PR #1046 ("Simplify backend registry selection") removed the legacy
localStorage fallback from `getAgentServerSessionApiKey()`, leaving it
reading only `import.meta.env.VITE_SESSION_API_KEY`. The combination
broke the first-launch experience for users who installed the npm
package globally:

  1. Fresh browser → `localStorage["openhands-backends"]` is null.
  2. `readLegacyBackend()` requires `baseUrl` AND `sessionApiKey` in
     `openhands-agent-server-config`; the injection only writes the key,
     so it returns null.
  3. `makeDefaultLocalBackend()` reads `VITE_SESSION_API_KEY` → null →
     returns null.
  4. Registry seeds empty → `MissingAgentServerScreen` renders the
     Manage Backends modal ("No extra backends added yet.") with no
     way out.

The fix mirrors how `__AGENT_CANVAS_AUTH_REQUIRED__` already passes the
public-mode flag from `static-server.mjs` to the bundle:

  - `static-server.mjs` now also injects
    `window.__AGENT_CANVAS_SESSION_API_KEY__ = <key>` in the `<head>`
    script. The window global is set first so it is available even if
    the localStorage write throws (private mode, etc.).
  - `getBakedSessionApiKey()` in `src/api/agent-server-config.ts` falls
    back to the window global when `VITE_SESSION_API_KEY` is empty.

Tests:
  - Unit tests in `__tests__/api/agent-server-config.test.ts` cover the
    window-global fallback, env-takes-precedence ordering, whitespace,
    and non-string injected values.
  - `__tests__/scripts/static-server.test.ts` asserts the new window
    assignment lands before the localStorage write.
  - A new mock-LLM E2E spec in
    `tests/e2e/mock-llm/mock-llm-auth-modes.spec.ts` exercises the
    exact user scenario: a fresh browser context with no pre-seeded
    localStorage must reach the onboarding modal (not the Manage
    Backends trap modal) when launched against the prebuilt stack.
  - Updated docstrings in the auth-modes spec and helper to remove
    references to the deleted `syncBakedSessionApiKey()` function.

AGENTS.md updated to document the window-global path and the current
key-rotation reconciliation (`syncLauncherDefaultLocalBackend()` in
`storage.ts`).

Co-authored-by: openhands <openhands@all-hands.dev>
2026-06-03 13:46:25 -04:00
2026-04-24 17:33:22 -04:00

agent-canvas

Warning

This project is in the Beta phase. It may be vibecoded, untested, or out of date. OpenHands takes no responsibility for the code or its support. Learn more.

Project Status: Beta

OpenHands is a platform for orchestrating coding agents across different environments. You can:

  • ⌨️ prompt agents manually
  • 🕐 run agents on a schedule
  • ⚡ trigger agents automatically — e.g. from Slack, GitHub, or Datadog.

Agents can run anywhere:

  • 🧑‍💻 on your laptop
  • 🖥️ on a remote virtual machine
  • ☁️ in our hosted cloud
  • 🏢 or inside your company’s infrastructure

The same Agent Canvas frontend can swap between each of these environments, so you can see everything in one place.

OpenHands works with any agent harness (e.g. Claude Code, Codex) or connect directly to an LLM (e.g. Anthropic, OpenAI, Gemini, Mistral, Minimax, Kimi).

If you have questions or feedback, please open a GitHub issue or join the #proj-agent-canvas channel in Slack.

Screenshot 2026-05-11 at 10 13 19 AM

Project ownership and support

  • Current status: Beta.
  • Support channel: #proj-agent-canvas.
  • Support level: Best effort while the project remains in Beta.

Quickstart

You can install OpenHands to run agents on any machine: on your laptop, on a dedicated computer like a Mac Mini, or on a server in the cloud.

The most powerful way to run OpenHands is on a server in the cloud. This allows your agents to continue running even when your laptop is shut, and makes it easier to trigger your agents through third-party services like Slack, GitHub, and Datadog. See SELF_HOSTING.md for details, especially with respect to security hardening.

Notably, you can run the backend in multiple different environments, and switch between them from the same Agent Canvas frontend. E.g. you can share an Agent Server with your team for agents doing code review and dependency updates, then have your personal agents running on your laptop.

Option 1: Without a Sandbox

Warning

This runs the agent-server directly on the machine you're installing on — the agent will have full access to your filesystem!

Prerequisites: Node.js 22.12.x or later, uv

npm install -g @openhands/agent-canvas
agent-canvas

The agent-canvas command starts the full local stack by default. You can also split it when you want to run pieces separately:

agent-canvas --frontend-only  # static frontend + ingress only
agent-canvas --backend-only   # agent server + automation backend + ingress only

Option 2: With a Docker Sandbox

Prerequisites:

  • Docker: Docker Desktop on macOS/Windows, or Docker Engine/Docker Desktop on Linux.
  • A host directory for PROJECTS_PATH containing the project folders you want the agent to access. Create it before starting the container.

macOS / Linux:

export PROJECTS_PATH="$HOME/projects"  # directory containing your project folders
mkdir -p "$PROJECTS_PATH" "$HOME/.openhands"

docker run -it --rm \
  -p 8000:8000 \
  -v "$HOME/.openhands:/home/openhands/.openhands" \
  -v "${PROJECTS_PATH}:/projects" \
  ghcr.io/openhands/agent-canvas:1.0.0-beta.6

Windows (PowerShell / Windows Terminal): See README.windows.md for the equivalent commands.

The agent will be able to access any project under PROJECTS_PATH.

Option 3: From Source

Warning

This runs the agent-server directly on the machine you're installing on — the agent will have full access to your filesystem!

Prerequisites: Node.js 22.12.x or later, npm, uv (for running the agent server via uvx)

git clone https://github.com/OpenHands/agent-canvas.git
cd agent-canvas
npm install
npm run dev

Access the UI at http://localhost:8000. You can add additional backends directly from the UI.

Architecture

Agent Canvas is powered by the OpenHands Agent Server, a REST API for running multiple agents on a single machine. Each Agent Server runs on a single host/port; the Agent Canvas can connect to multiple Agent Servers and easily flip between them.

You can run an Agent Server anywhere:

  • Directly on your laptop (be careful!)
  • On a dedicated machine like a Mac Mini
  • On a virtual machine in the cloud
  • Inside OpenHands Cloud (our commercial offering)

The Agent Server is often paired with an Automation Server, which lets you set up agents that run on a schedule or in response to events.

image

More documentation

S
Languages
TypeScript 93.7%
JavaScript 4.7%
Python 0.9%
Shell 0.3%
CSS 0.2%
Other 0.1%