SIGN UP

Video Recording

Video Recording

Video Recorder

We have recently released video recording functionality (not to be confused with client side recording released by browser vendors) and there is a number of cases when it can be very useful. This tutorial explains how to use this new functionality to build video recorder web app using our Web SDK in minutes.

Functionality

The application will have rather simple functionality - user logs in, click record button and the video recording starts, after he clicks stop button video being saved and URL to the video is sent to the client for further playback in HTML video element.

Creating VoxImplant entities

First of all, we need to create a videorecorder application with a VideoRecorder scenario in it. The scenario will be processing inbound calls and record it:

VoxEngine.addEventListener(AppEvents.CallAlerting, (e) => {
  e.call.addEventListener(CallEvents.Connected, handleCallConnected);
  e.call.addEventListener(CallEvents.RecordStarted, handleRecordStarted);
  e.call.addEventListener(CallEvents.Failed, VoxEngine.terminate);
  e.call.addEventListener(CallEvents.Disconnected, VoxEngine.terminate);
  e.call.answer();
});

function handleCallConnected(e) {
  // Record call including video
  e.call.record({video:true});
}

function handleRecordStarted(e) {
  // Send video URL to client
  e.call.sendMessage(JSON.stringify({url: e.url}));
}

Staying in the application, switch to the Routing tab to create a rule that will route the call made on a browser side to our scenario (if we dial videorec number – see the Pattern input):

Then we need to assign at least one user to the application and it's time to work on the client application.

Web application

We have started to use TypeScript and React for web app development recently, so let's make our app using this stack. You can get the app from https://github.com/voximplant/videorecorder

Tags:videorecording
B6A24216-9891-45D1-9D1D-E7359CEB8282 Created with sketchtool.

Comments(0)

Add your comment

Please complete this field.

Recommended

Sign up for a free Voximplant developer account or talk to our experts
SIGN UP