OpenClawをまだインストールしていませんか?ワンラインインストールコマンドはこちら
curl -fsSL https://openclaw.ai/install.sh | bash
iwr -useb https://openclaw.ai/install.ps1 | iex
curl -fsSL https://openclaw.ai/install.cmd -o install.cmd && install.cmd && del install.cmd
PCへの影響が心配ですか?ClawTankならクラウド上で動作し、インストール不要で誤削除のリスクもありません
主要な知見
  • OpenClawは3つの操作インターフェースを提供:CLI、Gateway Dashboard Web UI、サードパーティChannels。このうちGateway Dashboardが公式組み込みのグラフィカル管理パネルであり、追加インストール不要で利用可能[1]
  • Dashboard Web UIはデフォルトでhttp://127.0.0.1:18789で稼働し、Agent管理、会話履歴、Channelステータス、システムリソース監視の4つのコア機能を提供[8]
  • Control UI設定(gateway.auth.tokenallowedOrigins)はWeb UIを不正アクセスから保護するための重要なセキュリティメカニズム[4][5]
  • Tailscale、SSHトンネル、Cloudflareトンネルを使えば、エンジニア以外でも複雑なネットワーク設定を理解することなく、あらゆるデバイスからリモートDashboardに安全にアクセス可能[10]
  • OpenWebUIなどのサードパーティGUIソリューションやデスクトップShell連携と組み合わせることで、OpenClawは商用SaaS製品に近いグラフィカル操作体験を企業に提供可能[9]

AIエージェントツールと聞くと、まず思い浮かぶのは黒いターミナル画面に白い文字が並ぶ光景でしょう。コマンドを入力し、応答を待ち、次のコマンドを入力する。コマンドラインに慣れた開発者にとって、CLIは効率的で直感的な操作方法です。しかし、マーケティング、営業、プロジェクト管理など非技術職のチームメンバーにとって、この壁はOpenClawから遠ざけるのに十分な高さです。[6]

実はOpenClawは、そのアーキテクチャ設計の段階からグラフィカル操作機能を組み込んでいます。Gatewayサービスは単にWebSocket通信のコアハブであるだけでなく、同じポート上でフル機能のWeb Dashboardも提供します。ブラウザを開いてhttp://127.0.0.1:18789と入力するだけで、エージェントの管理、会話履歴の確認、システムステータスの監視をビジュアルに行えます。CLIコマンドを一切入力する必要はありません。[1]

本記事では、OpenClawの3つの操作モードを起点に、Gateway Dashboard Web UIの全機能、Control UIセキュリティ設定、リモートアクセスソリューション、サードパーティGUI連携、デスクトップショートカット、エンタープライズのベストプラクティスを体系的に紹介します。初めてOpenClawに触れるエンジニア以外の方も、チームへのグラフィカルデプロイを計画する技術リーダーも、本ガイドで必要な技術リファレンスを見つけることができます。

I. OpenClawの3つの操作モード

Web UIに入る前に、OpenClawが提供する3つの操作インターフェースを明確にしましょう。これら3つは排他的な代替手段ではなく、異なるシナリオに対応する補完的な選択肢です。[2]

操作モード インターフェースタイプ 対象ユーザー リアルタイムインタラクション タスク管理 リモートアクセス
CLI ターミナルコマンドライン 開発者、DevOps リアルタイム会話 基本(手動クエリ) SSH経由
Gateway Dashboard Web UI ブラウザグラフィカルインターフェース 全チームメンバー リアルタイム会話+可視化 完全(ダッシュボードパネル) Tailscale / トンネル
Channel(Telegram / Slack / API) メッセージングプラットフォーム連携 モバイル、自動化 非同期メッセージング 限定的(Channelにより異なる) ネイティブ対応

1.1 CLI:開発者のファーストチョイス

CLIはOpenClawの最も基本的で強力な操作方法です。Gateway管理、設定変更、Nodeスケジューリングなど、すべての高度な機能をCLIで完了できます。ターミナルに慣れたユーザーにとって、CLIは最速の操作速度と最大の柔軟性を提供します。[2]

1.2 Gateway Dashboard Web UI:ビジュアル管理

DashboardはGatewayに組み込まれたブラウザインターフェースで、Agent管理、会話記録、Channel監視、システムリソースダッシュボードを提供します。最大の利点はインストール不要であること。Gatewayが稼働していれば、Web UIが自動的に利用可能になります。[1]

1.3 Channels:どこからでもアクセス

Channelsは外部コミュニケーションプラットフォーム(Telegram、Slack、Discord、LINEなど)とのOpenClawの統合インターフェースです。お気に入りのチャットツールからAIエージェントと直接やり取りでき、モバイルデバイスや非同期ワークフローに最適です。[9]

3つのモードはすべて同時に実行可能です。ターミナルでCLIを使って設定を調整し、ブラウザのDashboardでエージェントステータスを監視し、スマートフォンからTelegram Bot経由でいつでもタスクをトリガーできます。すべての操作は最終的に同じGatewayに集約されます。

II. Gateway Dashboard Web UI

Gateway DashboardはOpenClawの組み込みグラフィカル管理パネルで、Gatewayサービスと同時に起動します。GatewayのHTTPエンドポイント上にフル機能のシングルページアプリケーション(SPA)を提供し、日常の運用に必要なすべての機能をカバーしています。[1][8]

2.1 起動とアクセス

Gatewayが既に稼働している場合(ほとんどの場合、インストール後に自動起動します)、ブラウザを開いてデフォルトアドレスにアクセスするだけです:

# Gatewayが稼働していることを確認
openclaw gateway status

# ブラウザでDashboardを開く
# デフォルトアドレス: http://127.0.0.1:18789

# またはCLIのショートカットでブラウザを直接開く
openclaw dashboard

openclaw dashboardコマンドはOSを自動検出し、対応するブラウザ起動コマンドを呼び出します(macOSはopen、Linuxはxdg-open、Windowsはstart)。[8]

2.2 Dashboardの4つのコア領域

Dashboardのインターフェースは左ナビゲーション・右コンテンツエリアのクラシックSPAレイアウトを採用し、4つの主要な機能領域で構成されています:

III. Dashboard機能の詳細

以下では、各Dashboard機能領域の操作と実用的な価値を詳しく解説します。[1]

3.1 エージェント管理

エージェント管理ページはDashboardのコア機能です。新しいAgentの作成、既存のAgent設定の変更、各Agentの実行履歴の確認が可能です。

新しいAgentの作成:右上の「New Agent」ボタンをクリックし、Agent名を入力、モデルを選択、許可するSkillsにチェックを入れればAgentが作成されます。CLIコマンドのopenclaw agent createと同等です。

Agent設定の変更:Agent名をクリックすると詳細ページに入り、モデル(Primary / Fallback)、システムプロンプト、最大トークン制限、temperatureなどのパラメーターを直接変更できます。すべての変更はGatewayの再起動なしで即座に反映されます。

# CLI同等の操作(参考)
openclaw agent create --name "research-bot" \
--model claude-opus-4-6 \
--skills browser,shell,file

openclaw agent config research-bot \
--system-prompt "You are a research assistant..."
--temperature 0.3
--max-tokens 8192

会話の可視化:Dashboardは各Agentの会話履歴をチャット形式のインターフェースで表示します。ユーザーの入力、Agentの推論プロセス、ツール呼び出し、最終応答という完全なコンテキストフローを確認できます。これはデバッグや教育シナリオで特に価値があります。非技術者のチームメンバーが「AIエージェントがどのように考えるか」を直感的に理解できます。

3.2 会話記録とワークスペース

各Agentの会話記録はワークスペース別に整理されます。Dashboardのワークスペース管理インターフェースでは以下が可能です:

3.3 Channelステータス監視

OpenClawにTelegram Bot、Slack App、その他のChannelを設定済みの場合、DashboardのChannelページで各チャンネルのリアルタイムステータスが表示されます。[9]

3.4 システムリソース監視

Dashboardの概要ページには、サーバーにSSH接続せずに稼働状況を追跡できるリアルタイムシステムリソース監視パネルが含まれています:

# CLI同等の操作
openclaw gateway status --deep
openclaw gateway status --json

IV. Control UI設定

Gateway Dashboardはデフォルトでローカル(127.0.0.1)からのみアクセス可能ですが、Gatewayをリモートモードに設定したりトンネル経由で外部に公開する場合は、Control UIセキュリティメカニズムを有効にする必要があります。[4][5]

4.1 gateway.auth.token

Dashboardのアクセス認証はGateway WebSocket認証と同じトークンを共有します。ブラウザでDashboardを開くと、管理インターフェースにアクセスする前にGatewayトークンの入力が求められます。

# Gatewayトークンの生成または更新
openclaw doctor --generate-gateway-token

# トークン形式: ogt_プレフィックス + 32文字のランダム文字列
# 例: ogt_a1b2c3d4e5f6g7h8i9j0k1l2m3n4o5p6

# openclaw.jsonでの配置
{
  "gateway": {
    "auth": {
      "token": "ogt_a1b2c3d4e5f6g7h8i9j0k1l2m3n4o5p6",
      "dashboard_enabled": true,
      "session_timeout_minutes": 480
    }
  }
}

ローカルモードでトークンが設定されていない場合、Dashboardは認証をスキップして管理インターフェースを直接表示します。ただし、リモートアクセスが関わる限り、トークンは必須のセキュリティ対策です。[5]

4.2 allowedOrigins

allowedOrigins設定は、どのドメインオリジンのブラウザリクエストがDashboardにアクセスできるかを制御します。クロスサイトリクエストフォージェリ(CSRF)攻撃に対する重要な防御策です。

# 許可するオリジンドメインを設定
openclaw config set gateway.allowed_origins \
'["https://gateway.yourdomain.com", "https://admin.yourdomain.com"]'

# openclaw.jsonでの完全な構造
{
  "gateway": {
    "allowed_origins": [
      "https://gateway.yourdomain.com",
      "https://admin.yourdomain.com"
    ],
    "cors": {
      "enabled": true,
      "allow_credentials": true,
      "max_age": 86400
    }
  }
}

リバースプロキシ(Nginx / Caddy)経由でDashboardにアクセスする場合、allowedOriginsのドメインはユーザーがブラウザのアドレスバーで見るものと一致する必要があります。一致しない場合、ブラウザがCORS制限によりすべてのAPIリクエストをブロックします。[4]

4.3 Dashboardの表示オプション

Dashboardの表示動作をさらにカスタマイズできます:

# Dashboardを無効化(WebSocketとREST APIのみ保持)
openclaw config set gateway.auth.dashboard_enabled false

# 自動ログアウト時間を設定(デフォルト480分 = 8時間)
openclaw config set gateway.auth.session_timeout_minutes 60

# 読み取り専用モードを有効化(閲覧のみ、設定変更不可)
openclaw config set gateway.auth.dashboard_readonly true

# 特定の機能領域を非表示(例:非管理者にログを見せない)
openclaw config set gateway.auth.dashboard_sections \
'["overview", "agents", "channels"]'

V. Web UIへのリモートアクセス

Dashboardの最大の価値はリモートシナリオで発揮されます。OpenClaw Gatewayがクラウドサーバーやオフィスのワークステーションにデプロイされている場合、外部デバイスからDashboardに安全にアクセスする方法が必要です。以下は3つの主要なアプローチです。[10]

5.1 Tailscale(推奨)

TailscaleはゼロコンフィグのWireGuard VPNで、すべてのデバイス間に暗号化トンネルを作成します。リモートDashboardにアクセスするための最良のソリューションであり、ポートの開放、DNS設定、TLS証明書の管理が一切不要です。

# ステップ1:GatewayサーバーにTailscaleをインストール
curl -fsSL https://tailscale.com/install.sh | sh
sudo tailscale up

# ステップ2:Tailscale IPを確認
tailscale ip -4
# 例: 100.64.0.1

# ステップ3:クライアントデバイスにもTailscaleをインストール
# macOS / Windows / iOS / Android すべて対応
sudo tailscale up

# ステップ4:クライアントブラウザから直接アクセス
# http://100.64.0.1:18789
# またはMagicDNS:
# http://my-server.tailnet-name.ts.net:18789

Tailscaleの無料プランは最大100デバイスに対応しており、個人やスモールチームには十分です。[10]

5.2 SSHトンネル

Gatewayサーバーへの既存のSSHアクセスがある場合、最もシンプルなアプローチは、リモートDashboardポートをローカルマシンに転送するSSHトンネルの作成です:

# ラップトップで実行
ssh -L 18789:127.0.0.1:18789 user@your-server-ip

# SSH接続を維持したまま、ローカルブラウザで開く:
# http://127.0.0.1:18789

# -Nと-fパラメーターでバックグラウンド実行
ssh -fNL 18789:127.0.0.1:18789 user@your-server-ip

# 必要に応じて閉じる
# macOS/Linux:
kill $(lsof -t -i :18789 -sTCP:LISTEN)
# または:
ps aux | grep "ssh -fNL" | grep -v grep | awk '{print $2}' | xargs kill

SSHトンネルの利点は追加ソフトウェアのインストールが不要なことですが、接続のたびにトンネルの手動確立が必要であり、不安定なネットワーク環境では切断されやすいです。autosshと組み合わせることで自動再接続が可能です。

5.3 Cloudflareトンネル

安定した永続的なリモートアクセスが必要なシナリオでは、Cloudflare Tunnel(旧Argo Tunnel)がエンタープライズグレードのソリューションを提供します。GatewayサーバーとCloudflareのエッジ間に暗号化トンネルを作成し、カスタムドメインでDashboardにアクセスしながら、CloudflareのDDoS防御とZero Trustアクセス制御を享受できます。

# ステップ1:cloudflaredをインストール
# macOS
brew install cloudflared
# Linux
curl -fsSL https://github.com/cloudflare/cloudflared/releases/latest/download/cloudflared-linux-amd64 \
-o /usr/local/bin/cloudflared && chmod +x /usr/local/bin/cloudflared

# ステップ2:認証とトンネル作成
cloudflared tunnel login
cloudflared tunnel create openclaw-dashboard

# ステップ3:トンネルルーティングの設定
# ~/.cloudflared/config.yml
tunnel: <your-tunnel-id>
credentials-file: /root/.cloudflared/<your-tunnel-id>.json

ingress:
  - hostname: dashboard.yourdomain.com
    service: http://127.0.0.1:18789
  - service: http_status:404

# ステップ4:DNS設定と起動
cloudflared tunnel route dns openclaw-dashboard dashboard.yourdomain.com
cloudflared tunnel run openclaw-dashboard

# ステップ5:Cloudflare Zero Trustでアクセスポリシーを設定
# 特定のメールアドレスのみDashboardへのアクセスを許可

Cloudflare Tunnelの無料プランにはトラフィック制限がありません。Zero TrustのEmail OTP認証と組み合わせることで、非技術者のチームメンバーもシンプルなメール認証で安全にDashboardにアクセスできます。VPNクライアントやSSHキーは不要です。

VI. サードパーティGUIソリューション

Gateway Dashboardの機能が特定のニーズを満たさない場合、OpenClawのオープンアーキテクチャによりサードパーティGUIフロントエンドの接続やカスタムインターフェースの構築が可能です。[3]

6.1 OpenWebUI連携

OpenWebUIは人気のオープンソースチャットインターフェースプロジェクトで、元々OllamaおよびOpenAI互換APIのために設計されました。OpenClaw GatewayもOpenAI互換のREST APIエンドポイントを提供するため、OpenWebUIをGatewayに向けてよりリッチなチャット体験を得ることができます。

# DockerでOpenWebUIを起動し、OpenClaw Gatewayに接続
docker run -d \
--name openwebui \
-p 3000:8080 \
-e OPENAI_API_BASE_URL=http://host.docker.internal:18789/v1 \
-e OPENAI_API_KEY=ogt_your_gateway_token \
-v open-webui:/app/backend/data \
ghcr.io/open-webui/open-webui:main

# ブラウザでhttp://localhost:3000を開く
# OpenWebUIがリクエストをOpenClaw Gatewayに転送

OpenWebUIはDashboardにない機能を提供します。Markdownプレビュー、コードシンタックスハイライト、ファイルアップロード、会話共有リンクなど、リッチなチャット体験が求められるシナリオに適しています。

6.2 カスタムフロントエンドの構築

OpenClaw GatewayのREST APIとWebSocket APIは完全にドキュメント化されており、任意のフロントエンドフレームワーク(React、Vue、Svelteなど)でカスタム管理インターフェースを構築できます。

# Gateway REST APIの例

# 全Agentリストを取得
curl -H "Authorization: Bearer ogt_your_token" \
http://127.0.0.1:18789/api/agents

# 特定のAgentの会話履歴を取得
curl -H "Authorization: Bearer ogt_your_token" \
http://127.0.0.1:18789/api/agents/research-bot/conversations

# Agentにメッセージを送信(RESTメソッド)
curl -X POST \
-H "Authorization: Bearer ogt_your_token" \
-H "Content-Type: application/json" \
-d '{"message": "最新のAI安全性研究論文を検索してください"}' \
http://127.0.0.1:18789/api/agents/research-bot/chat

# WebSocketリアルタイム会話
# ws://127.0.0.1:18789/ws?token=ogt_your_token

カスタムフロントエンド構築の典型的なシナリオには、OpenClawエージェントの企業内部プラットフォームへの埋め込み、業種特化型インターフェースの構築、既存のIT監視ダッシュボードへの統合などがあります。[3]

VII. デスクトップ統合のヒント

ブラウザのWeb UI以外にも、OpenClawは各OSのデスクトップで便利な統合方法を備えており、日々の操作がスムーズになります。

7.1 macOS統合

# openclawをPATHに追加(通常はインストール時に自動設定)
export PATH="$HOME/.openclaw/bin:$PATH"

# Spotlightで検索可能なアプリショートカットを作成
cat <<'EOF' > /tmp/OpenClaw-Dashboard.command
#!/bin/bash
open "http://127.0.0.1:18789"
EOF
chmod +x /tmp/OpenClaw-Dashboard.command
mv /tmp/OpenClaw-Dashboard.command ~/Applications/

# Alfred / Raycastショートカット
# Workflowを作成し、キーワード「oc」で入力:
# 1. Gatewayを起動(未起動の場合)
# 2. Dashboardを開く

# システムトレイ統合(macOSネイティブ対応)
# Gateway起動後、メニューバーにカニのアイコンが表示
# アイコンをクリックすると以下にクイックアクセス:
#   - Dashboardを開く
#   - Gatewayステータスを表示
#   - Gateway起動 / 停止
#   - 最近のAgent会話

7.2 Windows統合

# PowerShell Profileショートカット関数
# $PROFILEに追加(通常 ~\Documents\PowerShell\Microsoft.PowerShell_profile.ps1)

function oc-dash { Start-Process "http://127.0.0.1:18789" }
function oc-status { openclaw gateway status }
function oc-tui { openclaw tui $args }

# Windows Terminal カスタムプロファイル
# settings.jsonにOpenClaw専用Profileを追加:
{
  "name": "OpenClaw",
  "commandline": "openclaw tui",
  "icon": "%USERPROFILE%\\.openclaw\\icon.png",
  "startingDirectory": "%USERPROFILE%",
  "colorScheme": "One Half Dark"
}

# タスクバーショートカット
# デスクトップ右クリック > 新規作成 > ショートカット
# 対象: cmd /c start http://127.0.0.1:18789
# 名前: OpenClaw Dashboard

7.3 Linux統合

# GNOME / KDE デスクトップショートカット
cat <<EOF > ~/.local/share/applications/openclaw-dashboard.desktop
[Desktop Entry]
Name=OpenClaw Dashboard
Comment=OpenClaw Agent Management Dashboard
Exec=xdg-open http://127.0.0.1:18789
Icon=web-browser
Type=Application
Categories=Development;Utility;
EOF

# i3 / Sway キーボードショートカット
# ~/.config/i3/configに追加:
bindsym $mod+Shift+o exec xdg-open http://127.0.0.1:18789

# Shellエイリアス(bash / zsh)
echo 'alias ocd="openclaw dashboard"' >> ~/.bashrc
echo 'alias ocs="openclaw gateway status"' >> ~/.bashrc
echo 'alias occ="openclaw tui"' >> ~/.bashrc

VIII. エンタープライズシナリオ:エンジニア以外がOpenClawを使う方法

OpenClawのグラフィカルインターフェース設計は、単に「見た目が良い」ことだけが目的ではありません。コマンドラインに馴染みのないマーケティング、営業、人事、経理など他部署にもAIエージェントの能力を拡張することが目的です。[6][7]

8.1 デプロイアーキテクチャの推奨

典型的なエンタープライズデプロイアーキテクチャ:

# エンタープライズデプロイアーキテクチャ
[マーケティングチーム - ブラウザ]  ──┐
[営業チーム - ブラウザ]          ──┼── Cloudflare Zero Trust ── [Nginx] ── [Gateway :18789]
[PMチーム - ブラウザ]            ──┘                                          |
                                                         ┌────────┼────────┐
                                                      [Node 1]  [Node 2]  [Node 3]
                                                   (リサーチ  (コンテンツ (データ
                                                    Agent)      Agent)    Agent)

このアーキテクチャの主要な設計原則:

8.2 エンジニア以外向けワークフローの設定

以下は、エンジニア以外のメンバーを迅速に立ち上げる標準フローです:

  1. IT部門がGatewayをデプロイし、Cloudflare Tunnel + Zero Trustを設定
  2. IT部門が専用Agent(例:「マーケティングコンテンツアシスタント」)を作成し、システムプロンプトとSkill権限を事前設定
  3. ユーザーがURL(例:https://ai.company.com)と操作説明を受け取る
  4. ユーザーが企業メールでOTP認証を完了し、Dashboardに入る
  5. ユーザーがAgent会話エリアに直接リクエストを入力。ChatGPTを使うのと同じくらい自然

このプロセスを通じて、ユーザーはソフトウェアのインストール、ターミナルコマンドの理解、GatewayやNodesの技術的な詳細を知る必要がありません。彼らにとってOpenClawは単に「もっと多くのことができるChatGPT」です。

8.3 よくあるエンタープライズユースケース

部門 Agent名 典型的なタスク 使用Skills
マーケティング content-writer SNS投稿作成、SEOコピー生成 browser, file
営業 lead-researcher 見込み客リサーチ、競合分析 browser
人事 hr-assistant 求人票作成、面接質問生成 file
経理 report-analyzer 財務報告のサマリー、データトレンド分析 file, shell
PM spec-drafter 要件定義書作成、技術仕様書の編集 browser, file

IX. セキュリティベストプラクティス

Dashboardを外部に公開することは、OpenClawの管理インターフェースがより広い攻撃対象面に晒されることを意味します。以下のセキュリティ対策は本番環境の基本要件です。[5]

9.1 トークン管理

# トークンのローテーション(旧トークンは即座に無効化)
openclaw doctor --generate-gateway-token --force

# 環境変数でトークンを管理
export OPENCLAW_GATEWAY_TOKEN=ogt_new_token_here
openclaw gateway restart

# 最近のログエントリを表示
openclaw logs --follow --limit 100

9.2 HTTPS暗号化

DashboardはHTTPで配信され、通信中にトークンが平文で送信されます。ローカル以外のアクセスでは必ずHTTPSを使用すること。最もシンプルな方法はCaddy(自動TLS)またはNginx + Let's Encryptです。

# Caddy自動HTTPS(最もシンプルな設定)
# /etc/caddy/Caddyfile
dashboard.yourdomain.com {
  reverse_proxy 127.0.0.1:18789
}

# Nginx + Let's Encrypt
# /etc/nginx/sites-available/openclaw-dashboard
server {
  listen 443 ssl http2;
  server_name dashboard.yourdomain.com;

  ssl_certificate /etc/letsencrypt/live/dashboard.yourdomain.com/fullchain.pem;
  ssl_certificate_key /etc/letsencrypt/live/dashboard.yourdomain.com/privkey.pem;

  location / {
    proxy_pass http://127.0.0.1:18789;
    proxy_http_version 1.1;
    proxy_set_header Upgrade $http_upgrade;
    proxy_set_header Connection "upgrade";
    proxy_set_header Host $host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_read_timeout 3600s;
  }
}

9.3 アクセス制御

# Nginxでレートリミットを設定
limit_req_zone $binary_remote_addr zone=dashboard:10m rate=10r/s;

server {
  location / {
    limit_req zone=dashboard burst=20 nodelay;
    proxy_pass http://127.0.0.1:18789;
  }
}

# NginxでIPホワイトリストを設定
location / {
  allow 10.0.0.0/8;       # 社内ネットワーク
  allow 100.64.0.0/10;    # Tailscale
  deny all;
  proxy_pass http://127.0.0.1:18789;
}

X. トラブルシューティング

以下はDashboard Web UIで最もよく遭遇する問題とその解決方法です。[8]

10.1 Dashboardが開かない

症状:ブラウザで「接続できません」または「ERR_CONNECTION_REFUSED」と表示

# トラブルシューティング ステップ1:Gatewayが稼働していることを確認
openclaw gateway status

# トラブルシューティング ステップ2:Gatewayのリスニングアドレスとポートを確認
ss -tlnp | grep 18789
# 127.0.0.1:18789 LISTEN と表示されるべき

# トラブルシューティング ステップ3:Dashboardが無効化されていないことを確認
openclaw config get gateway.auth.dashboard_enabled
# true と表示されるべき

# トラブルシューティング ステップ4:HTTPエンドポイントを直接テスト
curl -v http://127.0.0.1:18789/health

# よくある原因:Gatewayが--headlessで起動しdashboard_enabledがfalse
# 修正:
openclaw config set gateway.auth.dashboard_enabled true
openclaw gateway restart

10.2 トークン認証の失敗

症状:Dashboardログインページで「Invalid Token」または「Authentication Failed」と表示

# トラブルシューティング ステップ1:トークンが正しいことを確認
openclaw config get gateway.auth.token

# トラブルシューティング ステップ2:ブラウザが古いセッションをキャッシュしていないか確認
# ブラウザのCookieをクリアしてリフレッシュ

# トラブルシューティング ステップ3:トークンを再生成
openclaw doctor --generate-gateway-token --force
# 新しいトークンをコピーし、Dashboardログインページで再入力

10.3 リモートアクセス時のWebSocket切断

症状:Dashboardページは開くがリアルタイムデータが更新されない、または頻繁に「Connection Lost」と表示

# 最も一般的な原因:リバースプロキシがWebSocket転送を正しく設定していない

# Nginxの修正:Upgradeヘッダーが適切に渡されていることを確認
location / {
  proxy_pass http://127.0.0.1:18789;
  proxy_http_version 1.1;
  proxy_set_header Upgrade $http_upgrade;
  proxy_set_header Connection "upgrade";
  proxy_read_timeout 3600s;  # 重要:最低1時間
  proxy_send_timeout 3600s;
}

# Cloudflareの制限:無料プランのWebSocket接続には100秒のアイドルタイムアウトあり
# 解決策:Gateway設定でハートビート間隔を設定
openclaw config set gateway.websocket.ping_interval 30

10.4 CORSエラー

症状:ブラウザの開発者ツールでAccess-Control-Allow-Origin関連のエラーが表示

# allowedOriginsに正しいドメインが含まれていることを確認
openclaw config get gateway.allowed_origins

# 修正:アクセスドメインを追加
openclaw config set gateway.allowed_origins \
'["https://dashboard.yourdomain.com"]'

openclaw gateway restart

10.5 Dashboardが空白ページを表示

症状:ブラウザが接続できるがページが空白で、開発者ツールにJavaScriptエラーが表示

# トラブルシューティング ステップ1:ブラウザキャッシュをクリア
# Ctrl+Shift+R(Windows/Linux)またはCmd+Shift+R(macOS)で強制リフレッシュ

# トラブルシューティング ステップ2:OpenClawバージョンを確認
openclaw --version
# Dashboardフロントエンドとgatewayバージョンが非互換の可能性
# 同じバージョンであることを確認

# トラブルシューティング ステップ3:OpenClawを更新
curl -fsSL https://openclaw.ai/install.sh | bash
openclaw gateway restart

まとめ

OpenClawのグラフィカル操作機能は、Gateway Dashboard Web UIからデスクトップ統合まで、重要な設計思想を体現しています:強力なツールはコードを書ける人だけのものであってはならない。CLIは開発者の効率武器ですが、Web UIはAIエージェントを組織全体に届けるための重要な架け橋です。[7]

本記事でカバーした操作パスは、3つの段階的なレベルにまとめることができます:

どのレベルを選ぶかは具体的なニーズ次第です。個人開発者ならレベル1で十分。5人のリモートチームならレベル2が適切。マーケティング、営業、人事部門すべてがAIエージェントを使う必要がある企業なら、レベル3のフルデプロイが必要です。[6]

OpenClawコミュニティの成長に伴い、Dashboard機能も急速に進化しています。[2]今後期待される改善には、より完全なチームコラボレーション機能、より精緻なRBAC権限モデル、組み込みのAgentテンプレートマーケットプレイス、ネイティブモバイルアプリケーションなどがあります。最新のグラフィカル操作機能を把握するため、公式設定ドキュメントやコミュニティの議論に定期的にアクセスすることをお勧めします。[1]