react-native-webrtc-simple

A simple and easy to use module that help in making video call for React Native. Implemented using react-native-webrtc.

Getting started

npm install react-native-webrtc-simple --save

or

yarn add react-native-webrtc-simple

Now we need to install react-native-webrtc

Document

WebrtcSimple

Method	Description
start	Create connections
stop	Stop connections
getSessionId	Get your session id
getLocalStream	Get your video stream
getRemoteStream	Get remote video stream
listenings	Listenings call events
events	Method call events

WebrtcSimple.start

Value	Type	Description
optional	Object or null	Option peer configuration (https://peerjs.com/)
key	String	Your session id

Peer-to-Peer

WebrtcSimple.listenings.callEvents

Value	Type	Description
START_CALL	String	Your start call status
RECEIVED_CALL	String	Call received status
ACCEPT_CALL	String	Call aceept status
END_CALL	String	Call end status
MESSAGE	String	Listenings a message

WebrtcSimple.events

Method	Params	Description
call	sessionId:String, data:any	Initiate a call
acceptCall	No	Accept a call
endCall	No	Reject a call
switchCamera	No	Switch camera
videoEnable	No	On/Off video
audioEnable	No	On/Off audio
message	data:any	Events send message

Multiple Peer

WebrtcSimple.listenings.callEvents

Value	Type	Description
START_GROUP_CALL	String	Your start call status
RECEIVED_GROUP_CALL	String	Call received status
JOIN_GROUP_CALL	String	Call received status
LEAVE_GROUP_CALL	String	Call reject status

WebrtcSimple.events

Method	Params	Description
groupCall	groupSessionId: string[], userData: object = {}	Start group call
joinGroup	arrSessionId: string[]	Join group call
leaveGroup	No	Leave group call
addStream	sessionId: string	Create a stream
switchCamera	No	Switch camera
videoEnable	No	On/Off video
audioEnable	No	On/Off audio
message	data:any	Events send message

Usage

import WebrtcSimple from 'react-native-webrtc-simple';

useEffect(() => {
    const configuration = {
      optional: null,
      key: Math.random().toString(36).substr(2, 4), //optional
    };

    WebrtcSimple.start(configuration)
        .then((status) => {
        if (status) {
            const stream = WebrtcSimple.getLocalStream();
            console.log('My stream: ', stream);

            WebrtcSimple.getSessionId((id: string) => {
                console.log('UserId: ', id);
            });
        }
        })
        .catch();

    WebrtcSimple.listenings.callEvents((type, userData) => {
      console.log('Type: ', type);
      // START_CALL
      // RECEIVED_CALL
      // ACCEPT_CALL
      // END_CALL
      // MESSAGE
      // START_GROUP_CALL
      // RECEIVED_GROUP_CALL
      // JOIN_GROUP_CALL
      // LEAVE_GROUP_CALL
    });

    WebrtcSimple.listenings.getRemoteStream((remoteStream) => {
      console.log('Remote stream', remoteStream);
    });

}, []);

const callToUser = (userId) => {
  const data = {};
  WebrtcSimple.events.call(userId, data);
};

const acceptCall = () => {
  WebrtcSimple.events.acceptCall();
};

const endCall = () => {
  WebrtcSimple.events.endCall();
};

const switchCamera = () => {
  WebrtcSimple.events.switchCamera();
};

const video = (enable: boolean) => {
  WebrtcSimple.events.videoEnable(enable);
};

const audio = (enable: boolean) => {
  WebrtcSimple.events.audioEnable(enable);
};

const sendMessage = (message: any) => {
    WebrtcSimple.events.message(message);
};

const groupCall = (sessionId: string[]) => {
    const data = {};
    WebrtcSimple.events.groupCall(sessionId, data);
};

const joinGroup = (groupSessionId: string[]) => {
  WebrtcSimple.events.joinGroup(groupSessionId);
};

const leaveGroup = () => {
  WebrtcSimple.events.leaveGroup();
};