ライブチャットシステム

はじめる

  1. サインアップ/ログインし、ダッシュボードでサイトを作成します
  2. APIキーを取得してコードを埋め込む
  3. Paste into your site's <head> and optionally set visitor id/nickname

1. 埋め込みスクリプト

Place the following code in your website's <head>, replace with your actual domain and API KEY:

<script>
// オプション: スクリプトをロードする前に、重複排除と表示のために訪問者 ID とニックネームを設定します。window.OCS = {
  externalId: 'user_12345', // 同一ユーザーの固定ID  nickname: 'ジョン・ドゥ'        // ウィンドウタイトル/バックエンドに表示されます};
</script>
<script>(function(){
  var s=document.createElement('script');
  s.src='http://www.chatgonow.com/api/widget.js?key=YOUR_API_KEY';
  s.async=true;document.head.appendChild(s);
})();</script>

2. テーマとスタイル

「個人用サイト」でカスタマイズできます。

3. 画像のアップロードとテキストメッセージ

訪問者ウィンドウはテキストと画像 (png/jpg/gif) の送信をサポートしています。画像はプラットフォームに安全にアップロードされ、バックエンドと訪問者側の両方に表示されます。

4. レート制限

スパムを防ぐために、「個人用サイト」で 1 分あたりの最大メッセージ数を設定できます。しきい値を超えると、「送信頻度が高すぎます」と表示されます。

チャット API レート制限: 取得と返信は同じ 1 分あたりのしきい値を共有しますが、別々にカウントされます。

5. 訪問者の重複排除

システムは重複排除に window.OCS.externalId の使用を優先します。設定されていない場合は、ローカル Cookie/LocalStorage で ocs_external_id が自動的に生成され、再利用されます。同じサイトの同じ externalId は同じ訪問者として扱われます。

6. オペレーターコンソール

ログイン後、「マイサイト」からオンラインチャットコンソールに入り、訪問者のセッションをリアルタイムで表示したり、テキストや画像を送信したり、未読通知を確認したりできます。

7. オープンAPI

チャット データを社内システムに統合するのに役立つ、シンプルで使いやすい API を提供します。

API フィールドの説明

Get Messages API 応答フィールド:

フィールド名 タイプ 説明
conversation_id string チャットセッションを識別する会話ID
sender_type string 送信者のタイプ: 訪問者またはエージェント
sender_user_id string 送信者 ID: 訪問者はランダム、エージェントは API キー
message_type string メッセージの種類: テキストまたは画像
content string メッセージ内容、画像メッセージの場合は空
image_url string|null 画像 URL、画像メッセージのみ
created_at string メッセージ作成時刻（形式：YYYY-MM-DD HH:MM:SS）

エージェント応答 API リクエスト フィールド:

フィールド名 タイプ 必須 説明
conversation_id integer ✓ 会話ID
content string ✓* 返信内容 (これまたは image_base64)
image_base64 string ✓* Base64 でエンコードされた画像 (これまたはコンテンツのいずれか)
agent_name string - エージェント名、デフォルトは「エージェント」

* は、content または image_base64 のいずれかを指定する必要があることを意味します

例

1. 最近のメッセージを取得する

リクエスト例 
curl "http://www.chatgonow.com/api/chat_api.php?action=get_recent_messages&key=CHAT_API_KEY"
成功応答の例:
応答データ 
{
  "success": true,
  "data": [
    {
      "conversation_id": "123",
      "sender_type": "visitor",
      "sender_user_id": "visitor_abc123",
      "message_type": "text",
      "content": "こんにちは、商品の価格についてお聞きしたいのですが",
      "image_url": null,
      "created_at": "2024-01-15 14:30:25"
    },
    {
      "conversation_id": "123",
      "sender_type": "agent",
      "sender_user_id": "chat_xyz789",
      "message_type": "text",
      "content": "Hello! I'm happy to help you. Which product pricing would you like to know about?",
      "image_url": null,
      "created_at": "2024-01-15 14:31:10"
    },
    {
      "conversation_id": "124",
      "sender_type": "visitor",
      "sender_user_id": "visitor_def456",
      "message_type": "image",
      "content": "",
      "image_url": "/uploads/chat_images/visitor_20240115_143200.jpg",
      "created_at": "2024-01-15 14:32:00"
    }
  ]
}
エラー応答の例:
エラー応答 
// API キーがありません{
  "success": false,
  "message": "missing key"
}

// 無効な API キー{
  "success": false,
  "message": "invalid key"
}

// リクエストが多すぎます{
  "success": false,
  "message": "too many requests, wait 3s"
}

2. エージェントの応答

リクエスト例 
curl -X POST "http://www.chatgonow.com/api/chat_api.php?action=reply_as_agent&key=CHAT_API_KEY" \
  -H "Content-Type: application/json" \
  -d '{"conversation_id":123,"content":"こんにちは、メッセージを受け取りました","agent_name":"エージェント ワン"}'
成功応答の例:
応答データ 
{
  "success": true
}
エラー応答の例:
エラー応答 
// API キーがありません{
  "success": false,
  "message": "missing key"
}

// 無効な API キー{
  "success": false,
  "message": "invalid key"
}

// 会話が見つかりません{
  "success": false,
  "message": "conversation not found"
}

// 空のコンテンツ{
  "success": false,
  "message": "empty content"
}