메인 콘텐츠로 건너뛰기
@capgo/capacitor-twilio-voice 커뮤니케이션 오픈 소스

Twilio Voice Capacitor 플러그인

Twilio Voice를 사용하여 앱 내 통화 기능을 구현하는 VoIP 통화 만들기 및 받기

설치

bun add @capgo/capacitor-twilio-voice bunx cap sync
npm, pnpm 또는 yarn
  • npm install @capgo/capacitor-twilio-voice
  • pnpm add @capgo/capacitor-twilio-voice
  • yarn add @capgo/capacitor-twilio-voice

기능 보고서 제출

How to use Twilio Voice in Capacitor

기능 보고서 제출

다운로드하여 Capgo 앱을 설치한 다음 QR code 코드를 스캔하세요.

Twilio Voice 플러그인 미리보기 QR code

@capgo/capacitor-twilio-voice를 사용하세요.

Twilio Voice SDK을 Capacitor에 통합합니다.

설치

bun add @capgo/capacitor-twilio-voice
bunx cap sync

bunx cap sync 플러그인의 네이티브 code을 프로젝트에 복사합니다. 플러그인 업그레이드 후 다시 실행하세요.

임포트

import { CapacitorTwilioVoice } from '@capgo/capacitor-twilio-voice';

API을 한눈에

방법 설명
login Twilio Voice에 대한 접근 토큰을 사용하여 사용자를 인증합니다.
logout 현재 사용자 로그아웃하고 Twilio Voice에서 등록 해제합니다.
isLoggedIn 사용자가 현재 로그인되어且유효한 접근 토큰을 가지고 있는지 확인합니다.
makeCall 전화번호 또는 클라이언트로 전송하는 호출을 시작합니다.
acceptCall 들어오는 호출을 수락합니다.
rejectCall 들어오는 호출을 거부합니다.
endCall 활성 호출을 종료합니다.
muteCall 활성 호출 중 마이크를 무음 또는 음성으로 설정합니다.
setSpeaker 활성 호출 중 스피커 모드를 활성화 또는 비활성화합니다.
getCallStatus 활성 호출의 현재 상태를 확인합니다.
checkMicrophonePermission 마이크 권한이 승인되었는지 확인합니다.
requestMicrophonePermission 사용자에게 마이크 권한을 요청하세요.

예시

login()

사용자 인증

import { CapacitorTwilioVoice } from '@capgo/capacitor-twilio-voice';

const result = await CapacitorTwilioVoice.login({
  accessToken: 'eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9...'
});
console.log('Login successful:', result.success);

logout()

사용자 로그아웃 및 Twilio Voice 등록 해제

import { CapacitorTwilioVoice } from '@capgo/capacitor-twilio-voice';

const result = await CapacitorTwilioVoice.logout();
console.log('Logout successful:', result.success);

isLoggedIn()

사용자가 현재 로그인되어 있는지 및 유효한 접근 토큰이 있는지 확인

import { CapacitorTwilioVoice } from '@capgo/capacitor-twilio-voice';

const status = await CapacitorTwilioVoice.isLoggedIn();
if (status.isLoggedIn && status.hasValidToken) {
  console.log('User identity:', status.identity);
} else {
  // Re-authenticate the user
}

makeCall()

전화번호 또는 클라이언트로 호출을 시작

import { CapacitorTwilioVoice } from '@capgo/capacitor-twilio-voice';

// Call a phone number
const result = await CapacitorTwilioVoice.makeCall({
  to: '+1234567890'
});
console.log('Call SID:', result.callSid);

// Call another Twilio client with a readable name for CallKit Recents
await CapacitorTwilioVoice.makeCall({
  to: 'client:alice',
  displayName: 'Alice Smith'
});

// Call a PSTN number using a specific caller ID
await CapacitorTwilioVoice.makeCall({
  to: '+1234567890',
  callerId: '+10987654321'
});

acceptCall()

입장한 전화 수락

import { CapacitorTwilioVoice } from '@capgo/capacitor-twilio-voice';

CapacitorTwilioVoice.addListener('callInviteReceived', async (data) => {
  console.log('Incoming call from:', data.from);
  const result = await CapacitorTwilioVoice.acceptCall({
    callSid: data.callSid
  });
  console.log('Call accepted:', result.success);
});

rejectCall()

입장한 전화 거절

import { CapacitorTwilioVoice } from '@capgo/capacitor-twilio-voice';

CapacitorTwilioVoice.addListener('callInviteReceived', async (data) => {
  if (shouldRejectCall(data.from)) {
    await CapacitorTwilioVoice.rejectCall({
      callSid: data.callSid
    });
  }
});

위 표에는 12 개의 핵심 메서드가 나열되어 있습니다. 리스너 및 버전 헬퍼, 각 메서드의 전체 계약은 GitHub 저장소.

이벤트 듣기

addListener handle을 반환합니다. 호출 handle.remove() 화면이 언마운트되거나, CapacitorTwilioVoice.removeAllListeners() 모든 리스너를 삭제합니다.

전체 참조

@capgo/capacitor-twilio-voice

Capacitor-Twilio-Voice를 사용 중이라면 Using @capgo/capacitor-twilio-voice Capacitor-Twilio-Voice의 구현 세부 사항을 참조하세요 @capgo/capacitor-twilio-voice capgo/capacitor-twilio-voice 구현 세부 사항을 위해 시작하기 시작하기 구현 세부 사항에 대해 Capgo 플러그인 디렉토리 Capgo 플러그인 디렉토리에서 제품 워크플로에 대해 Capacitor Capgo 플러그인 Capacitor Capgo 플러그인 구현 세부 사항 및 플러그인 추가 또는 업데이트 __CAPGO_KEEP_0__ 플러그인 추가 또는 업데이트 구현 세부 사항에 대해

FAQ

Twilio Voice 플러그인 FAQ

Twilio Voice 플러그인을 Capacitor 앱에 설치하는 방법은?

Run "bun add @capgo/capacitor-twilio-voice" (또는 "npm install @capgo/capacitor-twilio-voice"), 그리고 "bunx cap sync"를 실행하여 iOS와 Android 프로젝트가 네이티브 code를 인식하도록 하세요. 그리고 "@capgo/capacitor-twilio-voice"를 앱의 code에서 임포트하세요.

React, Vue 및 Angular과 함께 @capgo/capacitor-twilio-voice가 작동하는지 여부는?

예. Twilio Voice는 Capacitor 패키지이므로, Ionic, React, Vue, Angular, Svelte 및 일반 JavaScript와 같은 웹 프레임워크가 Capacitor 내에서 실행되는 경우에 작동합니다.

어떤 Capacitor 버전을 @capgo/capacitor-twilio-voice가 지원하는가요?

Capgo plugins follow Capacitor's major version: use the plugin major version that matches your Capacitor major version (for example plugin v8 with Capacitor 8). The compatibility table in the GitHub README lists the maintained versions.

@capgo/capacitor-twilio-voice는 무료이고 오픈 소스인가요?

네. code의 소스는 GitHub에 공개되어 있습니다. https://github.com/Cap-go/capacitor-twilio-voice/에서 확인할 수 있고, npm에서 무료로 설치할 수 있습니다. 버그 리포트와 풀 리퀘스트는 환영합니다.

code를 사용하는 Twilio Voice를 업데이트할 수 있나요?

플러그인을 설치하거나 업그레이드하면 네이티브 code이 변경되므로, 새로운 스토어 빌드를 필요로 합니다. 그 후에 Capgo의 라이브 업데이트를 통해 즉시 자바스크립트, HTML, CSS 변경 사항이 플러그인을 호출하는 경우에 적용됩니다.

Twilio Voice 변경 Ship without 앱 리뷰 기다리기

플러그인은 스토어 빌드에 포함된 후, Capgo live updates 사용하여 사용자에게 JavaScript, HTML 및 CSS 변경을 몇 분 안에 푸시합니다.

Capgo로 시작하세요