DEV Community

Cover image for How to add Video Calling Facilities in your App
Yogender Singh
Yogender Singh

Posted on

How to add Video Calling Facilities in your App

A Video SDK facilitates video communication between the server and the client endpoint applications. A wide range of SDKs is available for developing web browser-based applications and mobile native and hybrid applications. For effective RTC sessions, these SDKs provide functions that use the underlined APIs to communicate with the EnableX server through web sockets. SDKs propagate various types of events to each endpoint connected to a session to update or communicate the state of operations or the session.
We will be using the Video SDK provided by EnableX, which offers a range of video communication and AI-based solutions for businesses.

The Video SDK handles the following four major entities:
EnableX Room: This represents the client-side session and is used to handle all room or session-related events. It handles the connection, local stream publication, and remote stream subscriptions. It creates the room object by passing the token to the users who received it from your service. As this is a user access token, it is retrieved using the Server API.

EnableX Stream: Represents the user (audio, video, and/or data) stream, identifies the stream, and shows how to draw it.

Events: Represents events related to client-side entities.

Room Events: Represents events related to room connection.
Stream Events: Represents events related to streams within a room.
Player: Represents the customizable UI element that can be used to render the stream in the DOM or View Handler in a browser or mobile SDK, respectively.

Types of Video SDKs
EnableX provides different types of SDKs for video application development on different platforms and application frameworks, such as:

For Web Browser-based Applications
Web Video SDK
Used in the web page to add Live Video Sessions. SDK is a JavaScript Library

For Native Mobile Applications
Android Video SDK
Used to develop Live Video Calls in native Android Applications.
iOS Video SDK
Used to develop Live Video Calls in native iOS Applications.

For Hybrid Mobile Applications
Flutter Video SDK
Used to add Live Video Calls in Flutter Framework for Hybrid Application development.

React Native Video SDK
Used to add Live Video Calls in React Native Framework for Hybrid Application development.

Cordova/Ionic Video SDK
Used to add Live Video Calls in Cordova/Ionic Framework for Hybrid Application development.

Downloading and Installing Video SDKs
You can download and install video SDKs into your application development environment on different platforms and application frameworks.

How Do Video SDKs Work?
The video SDKs facilitate connection between client endpoint applications and video sessions and negotiate network fluctuations so that the applications can stay connected. The SDKs handle media transmission and reception to and from the EnableX server to maintain an effective session until disconnection. This is accomplished through the following:

Socket Connection
Web sockets connect a client endpoint with the EnableX server. All messaging and communication between the client and EnableX services are channelled through web sockets. If the web socket connection breaks, the communication stops.
The SDKs also help to reconnect with the EnableX Sever to restore the session automatically.

Methods
The SDK methods are called by the client endpoint applications to perform their actions. These method calls work asynchronously.
An action request is sent to the EnableX server through the web socket.
An immediate response is received to notify whether the method has been received for onward execution.

Example: Web SDK/Start Recording: The moderator of a session starts recording the session using the start record () method call.

// To start recording
room.startRecord( function( result, error ) { // Method call & Callback
if (result == 0) {
// Recording started
}
});

Event Notifications
Various event notifications are sent out by the EnableX server through the web socket to a designated application or all client endpoint applications connected to a video session. A notification is generated as:
An action or a method call from your endpoint.
A result of an action triggered by others from their endpoints.
A client endpoint application must listen to these events and take necessary actions.

Example:
Web SDK/Recording Started: All client endpoints are notified when a video session recording is started.
Sample Code

// Notification recording started to all
room.addEventListener( "room-record-on", function(event) {
// Recording started, Update UI
// event.message.moderatorId = Moderator who stated recording.
});

Media Stream Handling
The SDKs handle the media stream flow between the client endpoint and the EnableX media server and help select the right candidate to route the media to the EnableX media server.

Example: If the primary UDP ports are restricted in a corporate network, the SDKs route the media through the EnableX TURN server over a standard HTTP port to ensure communication.

Note: EnableX uses UDP ports 30000 to 35000 for media streaming. For optimum video communication, ensure that these ports are not restricted in your network.
To refer to the sample codes, see Sample Codes for Video Applications or Sample Codes for Multi-party Video Applications.

Top comments (0)