Tutoriel sur l'archivage (Web)

Vue d'ensemble

L'API d'archivage d'OpenTok vous permet d'enregistrer les flux audio et vidéo d'une session au format MP4.

Configuration du serveur

Pour archiver les sessions OpenTok, vous devez disposer d'un serveur Configuration. Il existe de nombreuses façons de mettre en place un système d'archivage à l'aide d'un serveur, mais dans le cadre de ce tutoriel, nous allons installer rapidement un serveur PHP simple.

Pour lancer le serveur, il suffit de cliquer sur le bouton « Heroku » ci-dessous. Vous serez alors redirigé vers le site web de Heroku et invité à saisir votre clé API OpenTok et votre secret API — vous pouvez retrouver ces informations sur la page de votre projet dans votre Video API Account. Si vous n'avez pas d'account Heroku, vous devrez vous inscrire (c'est gratuit).

Envie de découvrir le code ? Le bouton ci-dessus lance le code du serveur à partir du apprentissage-opentok-php Dépôt GitHub. Rendez-vous sur ce dépôt pour consulter le code ainsi que la documentation complémentaire ; vous pouvez même créer une branche dérivée du dépôt et y apporter des modifications avant le déploiement.

Configuration de votre projet

Pour suivre ce tutoriel, clonez le dépôt OpenTok Exemples d'applications Web référentiel sur GitHub :

git clone https://github.com/Vonage-Community/video-api-web-samples.git

Ensuite, ouvrez le Archivage dossier dans votre éditeur de code pour suivre les étapes.

Important : Vous ne pouvez archiver que les sessions qui utilisent le Routeur multimédia OpenTok (sessions dont le mode « médias » est défini sur « routé »). La valeur par défaut apprentissage-opentok-php Le code utilisé par cette application didactique repose sur des sessions routées.

Découverte du code

Vous utilisez du code côté serveur pour démarrer et arrêter les enregistrements d'archive. Dans le fichier config.js, vous définissez le SAMPLE_SERVER_BASE_URL variable à l'URL de base du service web que l'application appelle pour lancer l'enregistrement de l'archive, arrêter l'enregistrement et lire la vidéo enregistrée. Assurez-vous qu'il n'y a pas de caractère de fin de ligne / à la fin du domaine.

L'application d'archivage utilise le même code que celui disponible dans le dossier « Basic Video Chat » pour initialiser une session OpenTok, se connecter à cette session, publier un flux et s'abonner à un flux au sein de la session. Si vous ne vous êtes pas encore familiarisé avec le code de cette branche, nous vous invitons à consulter le Tutoriel de base sur le client pour le Web avant de continuer.

Pour lancer l'enregistrement du flux vidéo, l'utilisateur clique sur le bouton « Démarrer l'enregistrement », ce qui déclenche la méthode startArchive() dans le fichier app.js. Cette méthode envoie à son tour une requête XHR (ou Ajax) au serveur. L'identifiant de la session à enregistrer est transmis au serveur au format JSON. Dès que la méthode startArchive() est appelée, le bouton « Démarrer l'enregistrement » est masqué et le bouton « Arrêter l'enregistrement » s'affiche.


function startArchive() {
  $.ajax({
    url: SAMPLE_SERVER_BASE_URL + '/archive/start',
    type: "POST",
    contentType: "application/json", // send as JSON
    data: JSON.stringify({"sessionId": sessionId}),

    complete: function() {
      //called when complete
      console.log('startArchive() complete');
    },

    success: function() {
      //called when successful
      console.log('successfully called startArchive()');
    },

    error: function() {
      //called when there is an error
      console.log('error calling startArchive()');
    },
  });

  $('#start').hide();
  $('#stop').show();
}

Pour arrêter l'enregistrement, l'utilisateur clique sur le bouton « Arrêter l'enregistrement », ce qui déclenche la méthode stopArchive(). Cette méthode est similaire à la méthode startArchive() dans la mesure où elle envoie une requête Ajax au serveur pour arrêter l'archivage. La seule différence réside dans le fait que cette méthode transmet l'ID de l'archivage à arrêter sous forme de paramètre d'URL, au lieu du sessionId. Le bouton « Arrêter l'enregistrement » est masqué et le bouton « Afficher l'archivage » est activé.

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

Pour télécharger l'archive qui vient d'être enregistrée, l'utilisateur clique sur le bouton « Afficher l'archive », ce qui appelle la méthode viewArchive(). Cette méthode est similaire aux méthodes startArchive() et stopArchive() dans la mesure où elle envoie une requête Ajax au serveur. Le code serveur contient la logique permettant de vérifier si l'archive est disponible au téléchargement ou non. Si elle l'est, l'application est redirigée vers la page de l'archive. Dans le cas contraire, une nouvelle page est chargée ; celle-ci vérifie en permanence si l'archive est disponible au téléchargement et la charge dès qu'elle l'est.

Notes :

Dans la plupart des applications, l'accès à l'enregistrement d'archive ne serait pas accordé à chaque utilisateur final.
Vous pouvez avoir des sessions automatiquement archivées, qui sont enregistrées chaque fois qu'un client commence à publier un flux.
Vous devrez configurer une cible Amazon S3 ou Microsoft Azure pour le stockage de vos enregistrements d'archives.

Pour plus d'informations sur l'archivage, voir la page Guide du développeur sur l'archivage OpenTok.

Félicitations ! Vous venez de terminer le tutoriel sur l'archivage pour le Web.
Vous pouvez continuer à tester et à modifier le code que vous avez développé ici, ou consulter le Prochaines étapes ci-dessous.

Prochaines étapes

Une fois que vous aurez terminé cette étape, poursuivez le développement et l'amélioration de votre application OpenTok à l'aide des ressources utiles suivantes :