コントロール UI（ブラウザ）

コントロール UI は、Gateway が提供する小さな Vite + Lit シングルページアプリです:

  • デフォルト: http://<host>:18789/
  • オプションのプレフィックス: gateway.controlUi.basePath を設定（例: /openclaw）

同じポート上の Gateway WebSocket と直接通信します。

クイック起動（ローカル）

Gateway が同じコンピューターで実行されている場合、次を開きます:

ページの読み込みに失敗した場合は、最初に Gateway を起動します: openclaw gateway。

認証は WebSocket ハンドシェイク中に次を介して提供されます:

  • connect.params.auth.token
  • connect.params.auth.password ダッシュボード設定パネルでトークンを保存できます。パスワードは永続化されません。 オンボーディングウィザードはデフォルトでゲートウェイトークンを生成するため、最初の接続時にここに貼り付けます。

できること（現在）

  • Gateway WS 経由でモデルとチャット（chat.history、chat.send、chat.abort、chat.inject）
  • チャットでツール呼び出し + ライブツール出力カードをストリーム（エージェントイベント）
  • チャネル: WhatsApp/Telegram/Discord/Slack + プラグインチャネル（Mattermost など）のステータス + QR ログイン + チャネルごとの設定（channels.status、web.login.*、config.patch）
  • インスタンス: プレゼンスリスト + リフレッシュ（system-presence）
  • セッション: リスト + セッションごとの思考/詳細オーバーライド（sessions.list、sessions.patch）
  • Cron ジョブ: リスト/追加/実行/有効化/無効化 + 実行履歴（cron.*）
  • スキル: ステータス、有効化/無効化、インストール、API キー更新（skills.*）
  • ノード: リスト + 機能（node.list）
  • Exec 承認: ゲートウェイまたはノード許可リスト + exec host=gateway/node の ask ポリシーを編集（exec.approvals.*）
  • 設定: ~/.openclaw/openclaw.json を表示/編集（config.get、config.set）
  • 設定: 検証付きで適用 + 再起動（config.apply）し、最後のアクティブセッションを起動
  • 設定の書き込みには、同時編集の上書きを防ぐための base-hash ガードが含まれます
  • 設定スキーマ + フォームレンダリング（config.schema、プラグイン + チャネルスキーマを含む）。生の JSON エディターも引き続き利用可能
  • デバッグ: ステータス/ヘルス/モデルスナップショット + イベントログ + 手動 RPC 呼び出し（status、health、models.list）
  • ログ: フィルター/エクスポート付きのゲートウェイファイルログのライブテール（logs.tail）
  • 更新: パッケージ/git 更新を実行 + 再起動レポート付き再起動（update.run）

チャットの動作

  • chat.send はノンブロッキング: { runId, status: "started" } で即座に ack し、レスポンスは chat イベント経由でストリーミングされます。
  • 同じ idempotencyKey で再送信すると、実行中は { status: "in_flight" } を返し、完了後は { status: "ok" } を返します。
  • chat.inject はセッショントランスクリプトにアシスタントノートを追加し、UI のみの更新用に chat イベントをブロードキャストします（エージェント実行なし、チャネル配信なし）。
  • 停止:
    • 停止をクリック（chat.abort を呼び出す）
    • /stop（または stop|esc|abort|wait|exit|interrupt）を入力してアウトオブバンドで中止
    • chat.abort は { sessionKey } をサポート（runId なし）し、そのセッションのすべてのアクティブな実行を中止

Tailnet アクセス（推奨）

統合 Tailscale Serve（推奨）

Gateway をループバックに保ち、Tailscale Serve に HTTPS でプロキシさせます:

openclaw gateway --tailscale serve

開く:

  • https://<magicdns>/（または設定した gateway.controlUi.basePath）

デフォルトでは、gateway.auth.allowTailscale が true の場合、Serve リクエストは Tailscale ID ヘッダー （tailscale-user-login）経由で認証できます。OpenClaw は x-forwarded-for アドレスを tailscale whois で解決してヘッダーと照合することで ID を検証し、 リクエストが Tailscale の x-forwarded-* ヘッダーでループバックに到達した場合にのみこれらを受け入れます。Serve トラフィックでもトークン/パスワードを要求したい場合は、gateway.auth.allowTailscale: false を設定します（または gateway.auth.mode: "password" を強制）。

tailnet + トークンにバインド

openclaw gateway --bind tailnet --token "$(openssl rand -hex 32)"

次に開く:

  • http://<tailscale-ip>:18789/（または設定した gateway.controlUi.basePath）

UI 設定にトークンを貼り付けます（connect.params.auth.token として送信）。

非セキュア HTTP

プレーン HTTP（http://<lan-ip> または http://<tailscale-ip>）でダッシュボードを開くと、 ブラウザは非セキュアコンテキストで実行され、WebCrypto をブロックします。デフォルトでは、 OpenClaw はデバイス ID なしのコントロール UI 接続をブロックします。

推奨修正: HTTPS（Tailscale Serve）を使用するか、UI をローカルで開きます:

  • https://<magicdns>/（Serve）
  • http://127.0.0.1:18789/（ゲートウェイホスト上）

ダウングレード例（HTTP 経由のトークンのみ）:

{
  gateway: {
    controlUi: { allowInsecureAuth: true },
    bind: "tailnet",
    auth: { mode: "token", token: "replace-me" }
  }
}

これにより、コントロール UI のデバイス ID + ペアリングが無効になります（HTTPS でも）。ネットワークを信頼する場合にのみ使用してください。

HTTPS セットアップガイダンスについては、Tailscale を参照してください。

UI のビルド

Gateway は dist/control-ui から静的ファイルを提供します。次でビルドします:

pnpm ui:build # 初回実行時に UI 依存関係を自動インストール

オプションの絶対ベース（固定アセット URL が必要な場合）:

OPENCLAW_CONTROL_UI_BASE_PATH=/openclaw/ pnpm ui:build

ローカル開発用（別の dev サーバー）:

pnpm ui:dev # 初回実行時に UI 依存関係を自動インストール

次に、UI を Gateway WS URL（例: ws://127.0.0.1:18789）に向けます。

デバッグ/テスト: dev サーバー + リモート Gateway

コントロール UI は静的ファイルです。WebSocket ターゲットは設定可能で、 HTTP オリジンと異なる場合があります。これは、Vite dev サーバーをローカルに配置し、Gateway を別の場所で実行したい場合に便利です。

  1. UI dev サーバーを起動: pnpm ui:dev
  2. 次のような URL を開きます:
http://localhost:5173/?gatewayUrl=ws://<gateway-host>:18789

オプションのワンタイム認証（必要な場合）:

http://localhost:5173/?gatewayUrl=wss://<gateway-host>:18789&token=<gateway-token>

注意:

  • gatewayUrl はロード後に localStorage に保存され、URL から削除されます。
  • token は localStorage に保存されます。password はメモリにのみ保持されます。
  • Gateway が TLS の背後にある場合（Tailscale Serve、HTTPS プロキシなど）、wss:// を使用します。

リモートアクセスセットアップの詳細: リモートアクセス。

← ドキュメントに戻る