Videocall Guide

PreviousAudiocall Guide NextSIPcall Guide

Last updated 7 months ago

Videocall Guide

Video call 은 영상 통화 기능을 앱으로 구현한 것입니다. 통화 발신자는 caller, 착신자를 callee라는 통신 용어로 구분합니다. Omnitalk SDK를 이용하여 offerCall(), answerCall()을 각각 호출하고 해당 이벤트 메시지에 대응하는 것으로 전화 기능을 간단히 구현할 수 있습니다.

에서는 audiocall의 흐름을 sequence diagram으로 보여줍니다.

Step 0. SDK 초기화 및 객체 생성

Developer's Guide의 에서 장치 설정 및 개발 공통 사항을 참고하시기 바랍니다.

Step 1. 세션 생성

Omnitalk SDK 초기화를 제외한 모든 API 기능은 유효한 세션의 존재를 전제로 하고 있습니다. 세션의 생성을 위해 createSession API를 호출합니다. 사용하고 싶은 번호나 문자열을 userId로 전달해 등록할 수 있으며 생략시엔 Omnitalk 서버에서 부여한 임의의 id를 리턴받을 수 있습니다.

await sdk.createSession();

Step 2. 발신

동일한 Service Id로 세션을 생성한 사용자 중 idle state의 사용자에게 전화 요청을 할 수 있습니다.

offerCall API를 이용하여 전화 발신 요청을 할 수 있습니다. 애플리케이션에서는 비디오 객체의 컴포넌트를 그리기 위해 react-native-webrtc 패키지를 import 하여 사용합니다.

call_type: 전화 타입을 의미합니다. CallType은 Omnitalk SDK에서 enum type으로 제공합니다. 영상 통화를 위해서는 videocall 을 전달하시면 됩니다.
callee: callee의 user_id를 전달하시면 됩니다.
record: Optional 파라미터로, 녹음 여부를 의미합니다. (defalut = false)
localRenderer : streamURL을 담을 객체입니다.
remoteRenderer : streamURL을 담을 객체입니다.


import {RTCView} from 'react-native-webrtc'; //비디오 영상을 담을 컴포넌트

let localvideo = {streamURL: ''};
let remoteVideo = {streamURL: ''};

await sdk.offerCall(
    call_type:  CALL_TYPE.VIDEO_CALL,
    callee: callee, 
    record:false, 
    local_renderer: localVideo, 
    remote_renderer: remoteVideo
    );

<RTCView
streamURL={localVideo.streamURL}
/>

Step 3. 수신

callee가 RINGING_EVENT를 받은 경우

callee가 세션을 생성한 상태에서 caller가 offerCall(전화 요청)을 하여RINGING_EVENT를 받은 경우, callee는 자신과 상대의 영상을 담을 객체로 answerCall()을 호출하여 전화를 수신할 수 있습니다. RINGING_EVENT에서 받은 call type과 caller정보와 녹음 여부, RTCVideoRenderer 타입으로 초기화된 객체를 전달하면 됩니다. 수신 거절을 하고싶은 경우 RINGING_EVENT에서 받은 caller의 session을 인수로 전달하여 leave()를 호출하시면 됩니다.

callee가 전화 요청(offerCall) 이후에 session을 생성한 경우

callee가 세션을 생성하기 전 caller가 offerCall(전화 요청)을 하여 RINGING_EVENT를 받지 못한 경우, 애플리케이션에서 callee 에게 callType과 caller를 전달해 주어야 합니다. answerCall()의 파라미터 callType과 caller에 인수를 전달하고 RTCVideoRenderer 타입으로 초기화된 객체를 전달하여 전화를 수신할 수 있습니다.

call_type: 전화 타입을 의미합니다. caller가 offerCall()을 호출할 떄와 동일하게 videocall 을 전달하시면 됩니다.
caller: caller(전화 발신자)의 user_id를 전달하시면 됩니다.
localRenderer : streamURL을 담을 객체입니다.
remoteRenderer : streamURL을 담을 객체입니다.

await sdk.answerCall(
    call_type: CALL_TYPE.VIDEO_CALL, 
    caller: caller, 
    local_renderer: localVideo, 
    remote_renderer: remoteVideo
    );

Step 4. 연결 성공

영상 통화 연결이 성공하면 caller, callee 양층 모두 CONNECTED_EVENT 를 수신합니다.

비디오 장치 제어

mute/unmute

await sdk.setMute(TRACK.VIDEO);  //비디오 송출만 off
await sdk.setUnmute(TRACK.VIDEO );

비디오 카메라 변경

switchVideoDevice API를 호출하면 전/후면 카메라 스위칭 됩니다.