Saltare al contenuto
Capgo - Aggiornamenti in tempo reale per le Capacitor Capgo

Inizio

  1. Installa il pacchetto

    Finestra del terminale
    bun add @capgo/capacitor-incoming-call-kit

  2. Sincronizza progetti nativi

    Finestra del terminale
    bunx cap sync

  3. Scegli la tua fonte di anello Decidi se l'evento di chiamata in arrivo proviene dal tuo backend, un SDK come Twilio o Stream, o un percorso di push nativo come FCM o PushKit.

Come si inserisce l'integrazione

Sezione intitolata “Come si inserisce l'integrazione”

Questo plugin possiede solo la presentazione di chiamata in arrivo nativa. La tua app possiede ancora il trasporto, l'autenticazione e la sessione media effettiva.

Il modello di produzione comune è:

  1. Il tuo backend o il SDK di chiamata emette un evento di anello.
  2. La tua app chiama showIncomingCall().
  3. Il plugin presenta la UI di chiamata in arrivo nativa.
  4. callAccepted Informato la tua app di unirsi alla sessione di VoIP o alla stanza effettiva.
  5. callDeclined, callEndedo callTimedOut insegna all'app di pulire lo stato remoto.

Integrazione minima

Sezione intitolata “Integrazione minima”
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',
  },
});

Opzioni importanti

Sezione intitolata “Opzioni importanti”
  • callId: identificatore stabile riutilizzato in seguito con endCall()
  • timeoutMs: timeout di risposta non garantito
  • extra: JSON casuale riprodotto nelle payload dei listener
  • android.channelId e android.channelName: regolazione del canale delle notifiche Android
  • android.showFullScreen: richiede l'attività di chiamata in arrivo Android a schermo intero
  • ios.handleType: scegli generic, phoneNumber, o emailAddress per CallKit

Gestione delle chiamate attive

Sezione intitolata “Gestione delle chiamate attive”
const { calls } = await IncomingCallKit.getActiveCalls();


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


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

Modello di evento

Sezione intitolata “Modello di evento”
  • incomingCallDisplayed: l'interfaccia utente nativa è stata visualizzata con successo
  • callAccepted: l'utente ha accettato dalla UI nativa
  • callDeclined: l'utente ha rifiutato prima di unirsi
  • callEnded: la tua app o la piattaforma ha interrotto la chiamata tracciata
  • callTimedOut: la chiamata rimase senza risposta fino a timeoutMs

Ogni evento porta il payload normalizzato call e il tuo oggetto originale. extra Nota della piattaforma

Sezione intitolata “Nota della piattaforma”

Leggi il