🌐

WebChat 連携

OpenClawをWebChatに接続して、AIアシスタントをウェブサイトに直接埋め込みましょう。

概要

  • ✓ openclaw.jsonでWebSocket Gatewayを設定
  • ✓ Gatewayを有効にしてOpenClawを起動
  • ✓ チャットウィジェットをウェブサイトに埋め込み
  • ✓ 所要時間：約5分

設定ステップ

ステップ1：openclaw.jsonを設定

{
  "channels": {
    "webchat": {
      "enabled": true,
      "gateway": {
        "port": 3000,
        "path": "/ws",
        "auth": {
          "enabled": true,
          "apiKeys": ["your-api-key-1", "your-api-key-2"]
        }
      }
    }
  }
}

ステップ2：OpenClawを起動

openclaw start

WebSocket Gatewayはデフォルトでポート3000で起動します。

ステップ3：チャットウィジェットを埋め込み

OpenClawチャットウィジェットをウェブサイトに追加：

<script src="https://your-openclaw-server.com/widget.js"></script>
<script>
  OpenClaw.init({
    server: 'wss://your-openclaw-server.com/ws',
    apiKey: 'your-api-key',
    theme: {
      primaryColor: '#FF4500',
      position: 'bottom-right'
    }
  });
</script>

機能

カスタマイズ可能

ウィジェットの外観を完全にカスタマイズできます。

APIキー

APIキーによる安全な認証。

リアルタイム

インスタントレスポンス用のWebSocket。

テーマ

複数のテーマオプションとダークモード。