@ringcentral/rcv-react-native-sdk

RingCentral Video React Native SDK

Example

Quickstart sample app

Getting Started

Install SDK

# yarn
yarn add @ringcentral/rcv-react-native-sdk
# npm
npm install @ringcentral/rcv-react-native-sdk
# pnpm
pnpm add @ringcentral/rcv-react-native-sdk

For each platform (iOS/Android) you plan to use, follow one of the options for the corresponding platform.

Installation for Android

Update ./android/build.gradle

Make sure android/build.gradle minSdkVersion > 21

Add camera and microphone permission at AndroidManifest.xml

Update ./android/app/src/main/AndroidManifest.xml

<manifest>
...

  <!-- set following config to AndroidManifest.xml-->
  <uses-permission android:name="android.permission.CAMERA" />
  <uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS" />
  <uses-permission android:name="android.permission.RECORD_AUDIO" />
  <uses-feature android:name="android.hardware.camera" android:required="false" />
  <uses-feature android:name="android.hardware.camera.autofocus" android:required="false" />
  <uses-feature android:name="android.hardware.microphone" android:required="false" />
...
</manifest>

Installation for IOS

Add rcv-react-native-sdk dependencies in Podfile

pod 'rcv-react-native-sdk' , :path => '../node_modules/@ringcentral/rcv-react-native-sdk'

Then cd ios pod install

Open xcworkspace file of your iOS project with Xcode:

1. Set Validate workspace to Yes at Target -> Build Settings -> Build Options

2. Add $(PROJECT_DIR)/../node_modules/@ringcentral/rcv-react-native-sdk/ios/Frameworks into Framework Search Paths at Target -> Build Settings -> Search Paths

3. Add rcsdk.framework at Target -> General -> Frameworks, Libraries, and Embedded Content

   1. Click '+' button
   2. Select 'Add Files...'
   3. Select 'rcsdk.framework' in the pop file select panel at ./node_modules/@ringcentral/rcv-react-native-sdk/ios/Frameworks

General Usage

Init

Import SDK

import { EngineEvent, RcvEngine } from '@ringcentral/rcv-react-native-sdk';

Init RcvEngine

// ...
const engine = await RcvEngine.create(clientId, clientSecret);
await engine.setAuthToken(JSON.stringify(userToken), true);
// ...

Events Listener

// ...
engine.on(EngineEvent.MEETING_JOINED, e => {
  console.log('receive join meeting success event', e);
  console.log('meeting id', e.meetingId);
});
engine.on(EngineEvent.MEETING_LEFT, e => {
  console.log('receive leave meeting success event', e);
});
// ...

Start Instant Meeting

await engine.startInstantMeeting();

Join Meeting

await engine.joinMeeting(meetingId);