Klleon SDK

Klleon SDKは、WebアプリケーションにKlleonのリアルタイムインタラクティブアバターを統合するJavaScript SDKです。WebRTC接続とシグナリングを抽象化し、API呼び出しだけでアバター対話を実現します。

主な機能

• <script> タグでインストール、UMDバンドル提供
• テキスト/音声の双方向通信
• 標準Web Component提供または独自UI構成
• コールバックベースのイベント購読（状態、シグナル、エラー）
• TypeScript型定義提供

事前準備

SDKを使用する前に、以下の準備が必要です。

1. Klleon Studioアカウント — Klleon Studioで登録
2. ドメイン登録 — SDKを使用するWebサイトのドメイン登録（SDK管理メニュー）
3. SDKキー発行 — ドメイン登録後に sdk_key を発行
4. アバターID確認 — アバター一覧で avatar_id を確認（IDコピーが可能なアバターのみSDK連携可能）

お問い合わせ

ドメイン登録またはSDKの使用でお困りの場合は、partnership@klleon.io までお問い合わせください。

クイックスタート

JavaScript

const SDK = window.KlleonSDK;

// イベント登録
SDK.onStatus((status) => console.log(status));
SDK.onSignal((data) => console.log(data.signal, data.payload));
SDK.onError((error) => console.error(error.code));

// 初期化
SDK.init({ sdk_key: 'YOUR_SDK_KEY', avatar_id: 'YOUR_AVATAR_ID' })
  .then(() => SDK.sendMessage('こんにちは'))
  .catch((e) => console.error(e.message));

React

import { useEffect, useRef } from 'react';

function AvatarChat() {
  const initialized = useRef(false);

  useEffect(() => {
    const SDK = window.KlleonSDK;

    SDK.onStatus((status) => console.log(status));
    SDK.onSignal((data) => console.log(data.signal, data.payload));
    SDK.onError((error) => console.error(error.code));

    SDK.init({ sdk_key: 'YOUR_SDK_KEY', avatar_id: 'YOUR_AVATAR_ID' })
      .then(() => { initialized.current = true; })
      .catch((e) => console.error('初期化失敗:', e.message));

    return () => {
      if (initialized.current) SDK.destroy();
    };
  }, []);

  return (
    <>
      <avatar-container style={{ width: 400, height: 400 }} />
      <button onClick={() => window.KlleonSDK.sendMessage('こんにちは')}>
        送信
      </button>
    </>
  );
}

LLMリファレンス

LLMでこのドキュメントを参照するには、プレーンテキスト版をご利用ください。

• /llms.txt — 要約版
• /llms-full.txt — 全文ドキュメント