Sous-titres en direct — React Native

Utilisez l'API de sous-titrage en direct d'OpenTok pour activer le sous-titrage audio en temps réel des diffuseurs et des abonnés connectés à une session OpenTok.

Le sous-titrage en direct doit être activé au niveau de la session via l'option API REST.

Le sous-titrage en direct n'est possible que dans les cas suivants session acheminée.

Cette rubrique comprend les sections suivantes :

Publication de sous-titres en direct

Pour activer le sous-titrage en direct, initialisez le OTPublisher composant avec la valeur booléenne facultative publishCaptions de la propriété properties prop défini sur true:

<OTPublisher
  style={{width: 400, height: 300}}
  properties={{
    publishCaptions: true,
    // ... other properties
  }}
/>

Ce réglage est false par défaut.

Vous pouvez modifier cette propriété de manière dynamique (en fonction d'un changement d'état dans React) pour activer ou désactiver les sous-titres du flux publié.

S'abonner aux sous-titres en direct

Pour commencer à recevoir les sous-titres, configurez le subscribeToCaptions de la propriété properties prop de la OTSubscriber de la composante :

<OTSubscriber
  style={{width: 200, height: 200}}
  properties={{
    subscribeToCaptions: true,
    // ... other properties
  }}
  eventHandlers={{
    captionReceived: event => {
      console.log('Caption received:', event.text);
      console.log('Caption final:', event.isFinal);
    },
  }}
/>

Vous pouvez régler la subscribeToCaptions à la propriété true que le client qui publie le flux soit ou non en train de publier des sous-titres en direct. L'abonné commencera à recevoir les données de sous-titrage dès que l'éditeur commencera à publier des sous-titres.

Les abonnés reçoivent les sous-titres par l'intermédiaire de l'application captionReceived (voir ci-dessus).

Les captionReceived L'objet « event » possède deux propriétés :

  • text - Le texte de la légende (une chaîne)
  • isFinal - Si le texte de la légende est final pour une phrase (true) ou partielle (false).

Le SDK OpenTok pour React Native n'affiche pas le texte des événements de sous-titrage. Vous pouvez créer votre propre élément d'interface utilisateur pour afficher le texte des sous-titres en fonction de ces événements.

Recevoir ses propres sous-titres en direct

Le Vonage Client SDK ne permet pas à un éditeur de recevoir des événements concernant ses propres sous-titres. Pour afficher les sous-titres d'un flux publié par le client local, créez un abonné masqué (au flux de l'éditeur local) afin d'écouter les événements de sous-titrage. Définissez le subscribeToSelf de la propriété OTSubscriber à true. Vous ne devez pas rendre la vidéo de cet abonné (en réglant son width et height à 0) et vous ne devez pas vous abonner à l'audio (pour éviter l'écho, en mettant subscribeToAudio à false). Vous pouvez ajouter les sous-titres à l'interface utilisateur, comme vous le feriez pour les sous-titres d'autres flux. Voir Rendu personnalisé des abonnés.