Suggestions

close search

Back to Archiving Overview

Archiving: Recording your session to an archive

To see the code for this sample, switch to the archiving branch of the learning-opentok-web repo:

git checkout archiving

The code in the archiving branch builds on the code from the basics branch. Here is the added code: diff.

Important: You can only archive sessions that use the OpenTok Media Router (sessions with the media mode set to routed). The default learning-opentok-php code used by this tutorial app uses routed sessions.

The OpenTok archiving API lets you record a session's audio-video streams to MP4 files. You use server-side code to start and stop archive recordings. In the config.js file, you set the SAMPLE_SERVER_BASE_URL variable to the base URL of the web service the app calls to start archive recording, stop recording, and play back the recorded video.

The archiving application uses the same code available in the basics branch to initialize an OpenTok session, connect to the session, publish a stream, and subscribe to stream in the session. If you have not already gotten familiar with the code in that branch, consider doing so before continuing (see the previous sections).

To start recording the video stream, the user clicks the Start Recording button which invokes the startArchive() method in app.js. This method in turn sends an XHR (or Ajax) request to server. The session ID of the session that needs to be recorded is passed as a URL parameter to the server. As soon as the startArchive() method is called, the Start Recording button is hidden and the Stop Recording button is displayed.

function startArchive() {
  $.post(SAMPLE_SERVER_BASE_URL + '/start/' + sessionId);
  $('#start').hide();
  $('#stop').show();
}

To stop the recording, the user clicks the Stop Recording button, which invokes the stopArchive() method. This method is similar to the startArchive() method in that it sends an Ajax request to the server to stop the archive. The only difference is that this method passes the archive ID of the archive that needs to be stopped as a URL parameter instead of the sessionId. The Stop Recording button is hidden and the View Archive button is enabled.

function stopArchive() {
  $.post(SAMPLE_SERVER_BASE_URL + '/stop/' + archiveID);
  $('#stop').hide();
  $('#start').show();
  $('#view').prop('disabled', false);
}

To download the archive that has just been recorded, the user clicks View Archive button which invokes the viewArchive() method. This method is similar to the startArchive() and stopArchive() methods in that it sends an Ajax request to the server. The server code has the logic to check if the archive is available for download or not. If it is available, the application is redirected to the archive page. If not, a new page is loaded which continuously checks whether the archive is available for download or not and loads it when it is available.

Notes:

For more information, see the OpenTok archiving developer guide.