Migrate from Twilio Video to EnableX

Migration Guide from Twilio to EnableX: Web SDK

Web SDK

Introduction

This guide is designed to help you transition from your current Twilio Video setup to the EnableX Video SDK. For those starting a new project, we recommend consulting the EnableX Video SDK documentation for guidance. We ensure a smooth transition for all Twilio users looking to switch to a reliable alternative without any hassle. Begin with a free trial and experience the ease of integration firsthand.

Quick Start with EnableX Web Video Sample Applications

Explore a variety of sample applications tailored for different programming environments, including Node.js, PHP, Python, C#, Laravel, and Vue.js. Each sample app is available on GitHub, providing practical examples to kickstart your video calling project.

Video Calling QuickStart documentation - iOS

Step 1: Begin with EnableX

Start Your Free Trial in Minutes

We’ve got you covered with a migration path that feels familiar yet innovative.

  • Sign Up Easily: Go to the EnableX portal and select Try for Free.
  • Quick Registration: Provide your details; name, phone number, company, email and agree to the Terms of Service.
  • Account Verification: Check your email and click the verification link.
Try for Free

Step 2: Set Up Your Video Calling Project

Step 3: Integrate EnableX on the Client Side

Start Your Free Trial in Minutes

Incorporate video calling into your app with our comprehensive SDKs.

Step 4: Install EnableX Video SDK

Download the EnableX Web SDK and extract the contents from the zip file. Then, save the extracted files to your hosting server or the designated directory in your project structure.

Install SDK Using Package Managers
# with npm
                npm i enableX-rtc-sdk-ng
                # or with pnpm
                pnpm add enableX -rtc-sdk-ng
                # or with yarn
                yarn add enableX -rtc-sdk-ng
Add the SDK to your HTML file
<SCRIPT SRC="https://yourdomain/path/EnxRtc.js"></SCRIPT>

Step 5: Start and Join Sessions

Twilio
// Replace Twilio Video import
                    import * as TwilioVideo from 'twilio-video'
                    
                    var twilioVideo = TwilioVideo
                    var twilioRoom
                    
                    twilioRoom = await twilioVideo.connect(TOKEN, { name: 'yourName', audio: false, video: false, dominantSpeaker: true })
EnableX
/* Configure your Media Stream to publish */ 
                    var PublishStreamInfo = { 
                      audio: true,  
                      video: true, 
                      videoSize: [640, 480, 640, 480], 
                      attributes : {    
                          name: "John", 
                          age: 21, 
                          emp_id: "EMP039" 
                      }  
                    }; 
                    
                    /* Create Empty Object, if not to publish Media Stream */ 
                    var PublishStreamInfo = {} ; 
                    
                    /* Connect to Video Room */ 
                    localStream = EnxRtc.joinRoom(TOKEN, PublishStreamInfo, function(success, error) { 
                    if (error && error != null) { 
                     /* Handle Connection Error */ 
                    } 
                    if (success && success != null) {   
                     /* Connected Room Information */  
                     room = success.room;    
                    } 
                    });

Step 6: Publish Remote Stream

Twilio
// video
                    let localVideoTrack = await twilioVideo.createLocalVideoTrack({
                       height: { ideal: 720, min: 480, max: 1080 },
                       width:  { ideal: 1280, min: 640, max: 1920 },
                       aspectRatio: 16/9,
                    })
                    
                    twilioRoom.localParticipant.publishTrack(localVideoTrack)
                    const localMediaContainer = document.getElementById('video-container-div')
                    localMediaContainer!.appendChild(localVideoTrack.attach())
                    
                    // audio
                    let localAudioTrack = await twilioVideo.createLocalAudioTrack()
                    
                    twilioRoom.localParticipant.publishTrack(localAudioTrack);
                    const audioElement = localAudioTrack.attach();
                    document.body.appendChild(audioElement);
EnableX
// Configure Optional Publishing Options
                    var PublishOpt = {
                         "minVideoBW":"Number",  
                         "maxVideoBW": "Number" 
                    };
                    
                    room.publish(localStream, PublishOpt, function(StreamId) {
                    });

Step 7: Unpublish Remote Stream

Twilio
twilioRoom.localParticipant.videoTracks.forEach((publication) => {
                    publication.unpublish();
                    publication.track.stop();
                    var selfTwilioVideo = document.getElementById('video-container-div')
                    selfTwilioVideo?.querySelector('video')?.remove()
                })
               
                twilioRoom.localParticipant.audioTracks.forEach((publication) => {
                    publication.track.disable()
                })
EnableX
room.unpublish(localStream, function(result, error) {
                    if (result === undefined) {
                        // Failed       
                     } else {
                        // Unpublished      
                     }  
                });

Step 8: End Session

Leaving a Session in Twilio

In Twilio, you might have used the disconnect function to leave a session.

twilioVideo.disconnect()
room.disconnect(); 
 
                    room.addEventListener("room-disconnected", function(event) { 
                         // You are disconnected 
                    }); 
                     
                    room.addEventListener("user-disconnected", function(event) { 
                         // One user is disconnected 
                         // event - User Information of disconnected user 
                     });

For detailed information on the features and implementation of the EnableX Web Video SDK, please refer to the EnableX Video SDK Documentation. This resource offers comprehensive insights into the capabilities of the SDK, enabling the development of sophisticated and feature-rich video conferencing solutions. If you have specific feature needs, the documentation offers valuable instructions and support.