コンテンツにジャンプ
Capgo - Capacitor アプリのリアルタイム更新 Capgo

はじめに

  1. パッケージをインストール

    ターミナル画面
    bun add @capgo/capacitor-incoming-call-kit

  2. ネイティブプロジェクトを同期

    ターミナル画面
    bunx cap sync

  3. リングソースを選択してください 着信イベントが来るのは、バックエンドから、SDK であるTwilioやStream、またはネイティブのプッシュパスであるFCMやPushKitからですか。

統合の仕組み

統合の仕組み

このプラグインは、着信のネイティブ表示のみを管理します。アプリは、通信、認証、実際のメディアセッションを管理します。

一般的なデプロイパターンは

  1. バックエンドまたは呼び出しSDKがリングイベントを発行します。
  2. アプリは showIncomingCall().
  3. プラグインはネイティブの着信UIを表示します。
  4. callAccepted アプリに実際のルームまたはVoIPセッションに参加するように指示します。
  5. callDeclined, callEndedアプリにリモートの状態をクリーンアップするように指示します。 callTimedOut アプリは

最小限の統合

最小限の統合
import { IncomingCallKit } from '@capgo/capacitor-incoming-call-kit';


await IncomingCallKit.requestPermissions();
await IncomingCallKit.requestFullScreenIntentPermission();


await IncomingCallKit.addListener('callAccepted', async ({ call }) => {
  console.log('Accepted', call.callId, call.extra);
  // Start or join your real call session here.
});


await IncomingCallKit.addListener('callDeclined', ({ call }) => {
  console.log('Declined', call.callId);
  // Tell your backend or SDK that the user declined.
});


await IncomingCallKit.addListener('callTimedOut', ({ call }) => {
  console.log('Timed out', call.callId);
  // Clear ringing state in your backend or SDK.
});


await IncomingCallKit.showIncomingCall({
  callId: 'call-42',
  callerName: 'Ada Lovelace',
  handle: '+39 555 010 020',
  appName: 'Capgo Phone',
  hasVideo: true,
  timeoutMs: 45_000,
  extra: {
    roomId: 'room-42',
    callerUserId: 'user_ada',
  },
  android: {
    channelId: 'calls',
    channelName: 'Incoming Calls',
    showFullScreen: true,
  },
  ios: {
    handleType: 'phoneNumber',
  },
});

重要なオプション

重要なオプション
  • callId: その後再利用される安定した識別子 endCall()
  • timeoutMs: 最善の努力で回答できないタイムアウト
  • extra: リスナーパイロードに反映される任意のJSON
  • android.channelId そして android.channelName: Android 通知チャンネルの調整
  • android.showFullScreen: Android のフルスクリーンIncomingCallアクティビティを要求
  • ios.handleType: 選択 generic, phoneNumber, または emailAddress CallKit のために

アクティブなコールを管理する

「アクティブなコールを管理する」
const { calls } = await IncomingCallKit.getActiveCalls();


await IncomingCallKit.endCall({
  callId: 'call-42',
  reason: 'remote-ended',
});


await IncomingCallKit.endAllCalls({
  reason: 'session-reset',
});

イベント モデル

「イベント モデル」
  • incomingCallDisplayed: 画面表示が成功しました
  • callAccepted: ユーザーが画面から承認しました
  • callDeclined: ユーザーが参加する前に拒否しました
  • callEnded: アプリまたはプラットフォームがトラッキングされたコールを終了しました
  • callTimedOut: コールは未回答のまま残りました timeoutMs

各イベントには、正規化されたペイロードと元のオブジェクトが含まれます。 call プラットフォームに関する注意 extra 「プラットフォームに関する注意」セクション

iOS向けのガイドを読んでください。

PushKitまたはAPNsフローにCallKitを組み込む前に、iOSガイドを読んでください。