Configurer un client Android de base

Ce tutoriel vous guidera pas à pas dans la configuration d'un client Android basique utilisant la Video API de Vonage.

Vue d'ensemble

Toutes les Applications qui utilisent l'API Video de Vonage nécessitent à la fois un client et un serveur composant. Le code côté client est celui qui se charge sur l'appareil de l'utilisateur final (téléphone, ordinateur) et gère la plupart des fonctionnalités d'OpenTok, notamment connexion à la session, l'édition audio-vidéo cours d'eau à la session, et souscrire aux flux d'autres clients. Pour plus d'informations sur les clients, les serveurs et les sessions, voir Les bases de Video API.

Dans ce tutoriel, vous utiliserez la fonction SDK OpenTok pour Android, la bibliothèque côté client d'OpenTok pour les appareils Android, afin de développer rapidement et facilement une application vidéo interactive en temps réel.

Voici les points qui seront abordés dans ce tutoriel :

Temps de réalisation estimé : 25 minutes

Vous voulez sauter ce tutoriel ? Vous pouvez accéder au code du client Android dans la section Basic-Video-Chat-Java de notre Exemples d'applications Android sur GitHub. Le dépôt comprend un README avec de la documentation pour l'exécution et l'exploration du code. Par ailleurs, ce tutoriel traite de la version Java de l'exemple d'application Android. Pour une version Kotlin avec de la documentation, voir le fichier Exemples d'applications Android.

Exigences

Pour réaliser ce tutoriel, vous aurez besoin de :

Étape 1 : Création d'un nouveau projet

  1. Ouvrez Android Studio et sélectionnez Nouveau projet de la Fichier menu.

  2. Définissez la version minimale du SDK de l'application sur API 16 (Android 4.1, Jelly Bean).

  3. Cliquez sur l'assistant en vous assurant que Activité vide est sélectionné. Laisser le Nom de l'activité fixé à MainActivityet quitter le Nom du modèle fixé à activity_main.

Étape 2 : Ajout du SDK OpenTok pour Android

L'application utilise Maven pour charger le SDK Android d'OpenTok :

  1. Modifiez le fichier build.gradle de votre projet (à la racine de votre projet) et ajoutez l'extrait de code suivant au fichier allprojects/repositories section :

    mavenCentral()

    A ce stade, le fichier build.gradle devrait ressembler à ceci :

    buildscript { repositories { google() jcenter() } dependencies { classpath 'com.android.tools.build:gradle:4.1.2' // NOTE: Do not place your application dependencies here; they belong // in the individual module build.gradle files } } allprojects { repositories { google() jcenter() mavenCentral() } } task clean(type: Delete) { delete rootProject.buildDir }

  2. Modifiez le fichier build.gradle de votre module (le fichier app/build.gradle) et ajoutez l'extrait de code suivant à la section des dépendances :

    implementation 'com.opentok.android:opentok-android-sdk:2.22.0'

    Si vous utilisez OpenTok pour Android version 2.16.0 ou supérieure, vous devrez ajouter ce qui suit au fichier android du fichier build.gradle de l'application :

    compileOptions { sourceCompatibility JavaVersion.VERSION_1_8 targetCompatibility JavaVersion.VERSION_1_8 }

    A ce stade, le fichier build.gradle de votre module devrait ressembler à ceci :

    apply plugin: 'com.android.application' android { compileSdkVersion 32 defaultConfig { applicationId "com.example.myapplication" minSdkVersion 16 targetSdkVersion 32 versionCode 1 versionName "1.0" testInstrumentationRunner "androidx.test.runner.AndroidJUnitRunner" } buildTypes { release { minifyEnabled false proguardFiles getDefaultProguardFile('proguard-android-optimize.txt'), 'proguard-rules.pro' } } } dependencies { implementation fileTree(dir: 'libs', include: ['*.jar']) implementation 'androidx.appcompat:appcompat:1.0.2' implementation 'androidx.constraintlayout:constraintlayout:1.1.3' implementation 'androidx.annotation:annotation:1.1.0' implementation 'com.opentok.android:opentok-android-sdk:2.22.2' testImplementation 'junit:junit:4.12' androidTestImplementation 'androidx.test:runner:1.2.0' androidTestImplementation 'androidx.test.espresso:espresso-core:3.2.0' }

  3. Synchronisez votre projet.

Étape 3 : Configuration de l'authentification

Pour se connecter à une session OpenTok, le client devra disposer de certaines informations d'authentification — un Clé API, ID de la sessionet jeton. Dans une application de production, ces informations d'identification doivent être générées par une application serveur, mais pour aller plus vite, nous allons simplement définir les valeurs de manière statique pour l'instant :

  1. Créer le OpenTokConfig classe (Fichier | Nouveau | Classe Java), ajoutez quelques variables statiques pour stocker la clé API, l'identifiant de session et le jeton. Nous ajouterons également quelques constantes pour l'identifiant de nos messages de journalisation et les autorisations :

    public class OpenTokConfig { public static final String API_KEY = ""; public static final String SESSION_ID = ""; public static final String TOKEN = ""; }

  2. Ajuster le code en codant en dur les valeurs des API_KEY, SESSION_ID et TOKEN.

    Pour ce faire, connectez-vous à votre Video API Account, créez un nouveau projet API OpenTok ou utilisez un projet API OpenTok existant, puis rendez-vous sur la page de votre projet et faites défiler vers le bas jusqu'à la section Outils de projet section. À partir de là, vous pouvez générer manuellement un identifiant de session et un jeton. Utilisez la clé API du projet avec l'identifiant de session et le jeton que vous avez générés.

Important : Vous pouvez continuer à récupérer l'identifiant de session et le jeton depuis votre Account pendant les phases de test et de développement, mais avant de passer en production, vous devez configurer un serveur. Nous aborderons ce sujet dans Prochaines étapes à la fin de ce tutoriel.

Pour plus d'informations sur les sessions, les jetons et les serveurs, consultez le site suivant Les bases de Video API.

Étape 4 : Demande d'autorisations

Comme notre application utilise l'audio et la vidéo de l'appareil de l'utilisateur, nous devrons ajouter un peu de code pour demander les autorisations audio et vidéo. Nous utiliserons la méthode EasyPermissions pour ce faire.

  1. Commencez par ajouter la bibliothèque EasyPermissions à votre projet - ouvrez le fichier build.gradle pour votre module (le fichier app/build.gradle) et ajoutez l'extrait de code suivant à la section des dépendances :

    implementation 'pub.devrel:easypermissions:3.0.0'

  2. Dans votre AndroidManifest.xml ajoutez cet extrait de code à l'intérieur du fichier manifest étiquettes :

    <uses-permission android:name="android.permission.CAMERA" /> <uses-permission android:name="android.permission.INTERNET" /> <uses-permission android:name="android.permission.RECORD_AUDIO" /> <uses-permission android:name="android.permission.WAKE_LOCK" /> <uses-permission android:name="android.permission.MODIFY_AUDIO_SETTINGS" /> <uses-permission android:name="android.permission.READ_PHONE_STATE" /> <uses-permission android:name="android.permission.BLUETOOTH_CONNECT" /> <uses-feature android:name="android.hardware.camera" /> <uses-feature android:name="android.hardware.camera.autofocus" />

  3. Dans votre MainActivity.java ajoutez une nouvelle méthode appelée onRequestPermissionsResult:

    @Override public void onRequestPermissionsResult(int requestCode, @NonNull String[] permissions, @NonNull int[] grantResults) { super.onRequestPermissionsResult(requestCode, permissions, grantResults); EasyPermissions.onRequestPermissionsResult(requestCode, permissions, grantResults, this); }

    Il s'agit d'un code de base permettant d'utiliser la bibliothèque EasyPermissions.

    Important : Vous devrez ajouter les importations manuellement, en cliquant sur EasyPermissions (texte en rouge) et en appuyant sur la combinaison de touches Option + Entrée sous macOS ou Alt + Entrée sous Windows. Cette étape peut s'avérer nécessaire lors du collage du code. Vous pouvez également activer l'option « Ajouter des importations sans ambiguïté à la volée » (Préférences | Éditeur | Importation automatique) pour ajouter automatiquement les importations.

  4. Ajouter le PERMISSIONS_REQUEST_CODE en haut de la page MainActivity.java fichier :

    private static final int PERMISSIONS_REQUEST_CODE = 124;

  5. Ensuite, nous ajouterons un requestPermissions() méthode :

    @AfterPermissionGranted(PERMISSIONS_REQUEST_CODE) private void requestPermissions() { String[] perms = { Manifest.permission.INTERNET, Manifest.permission.CAMERA, Manifest.permission.RECORD_AUDIO }; if (EasyPermissions.hasPermissions(this, perms)) { // initialize and connect to the session } else { EasyPermissions.requestPermissions(this, "This app needs access to your camera and mic to make video calls", PERMISSIONS_REQUEST_CODE, perms); } }

    Cela permet de vérifier si les autorisations ont déjà été accordées. Si ce n'est pas le cas, nous demandons à l'utilisateur les autorisations pour la caméra et le micro avec la commande EasyPermissions.requestPermissions méthode.

    Une fois les autorisations accordées, cette méthode se déclenchera à nouveau en raison de la fonction @AfterPermissionGranted(PERMISSIONS_REQUEST_CODE) . Nous ajouterons du code pour initialiser les objets session et vue dans les étapes suivantes.

  6. Ajouter maintenant requestPermission(); pour appeler la méthode à l'intérieur du onCreate() méthode :

    @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); requestPermissions(); }

Étape 5 : Connexion à la session

Nous allons maintenant nous connecter à la session OpenTok. Vous devez effectuer cette opération avant de pouvoir diffuser votre flux audio-vidéo vers la session ou visionner les flux des autres participants.

  1. Ajouter un session à la classe MainActivity (juste après les dernières lignes que vous avez ajoutées dans la section Étape 3) :

    private Session session;

    La classe `Session` est définie dans le SDK Android d'OpenTok. Elle représente une session OpenTok et comprend des méthodes permettant d'interagir avec cette session.

  2. Pour faciliter la journalisation, ajoutez un TAG en haut de la page MainActivity classe :

    private static final String TAG = MainActivity.class.getSimpleName();

  3. Dans le cadre de la requestPermissions() que vous avez créée à l'étape précédente, ajoutez les lignes de code suivantes sous la méthode // initialize and connect to the session pour instancier l'objet Session et appeler son connect(token) méthode :

    initializeSession(OpenTokConfig.API_KEY, OpenTokConfig.SESSION_ID, OpenTokConfig.TOKEN);

  4. Juste en dessous du requestPermissions() ajoutez les lignes de code suivantes :

    private void initializeSession(String apiKey, String sessionId, String token) { Log.i(TAG, "apiKey: " + apiKey); Log.i(TAG, "sessionId: " + sessionId); Log.i(TAG, "token: " + token); session = new Session.Builder(this, apiKey, sessionId).build(); session.setSessionListener(sessionListener); session.connect(token); }

    Ce code utilise le Session.Builder() pour instancier un objet Session. Le constructeur prend trois paramètres :

    • Le contexte de l'application Android associé à ce processus
    • La clé API OpenTok
    • L'identifiant de la session

    Les Session.Builder.build() renvoie une nouvelle instance de session.

    Les Session.setSessionListener() définit l'objet qui implémentera l'interface SessionListener. Cette interface comprend des méthodes de rappel qui sont appelées en réponse à des événements liés à la session. (Nous les mettrons en œuvre dans les étapes suivantes).

    Les Session.connect() de la méthode session Cet objet connecte l'application cliente à la session OpenTok. Vous devez vous connecter avant d'envoyer ou de recevoir des flux audio-vidéo dans la session (ou avant d'interagir de quelque manière que ce soit avec la session). Le connect() Cette méthode prend un paramètre : le jeton d'authentification permettant à ce client de se connecter à la session OpenTok.

  5. Nous allons ensuite créer le fichier sessionListener propriété. Ajoutez le code suivant en haut de la page MainActivity classe :

    private Session.SessionListener sessionListener = new Session.SessionListener() { @Override public void onConnected(Session session) { Log.d(TAG, "onConnected: Connected to session: " + session.getSessionId()); } @Override public void onDisconnected(Session session) { Log.d(TAG, "onDisconnected: Disconnected from session: " + session.getSessionId()); } @Override public void onStreamReceived(Session session, Stream stream) { Log.d(TAG, "onStreamReceived: New Stream Received " + stream.getStreamId() + " in session: " + session.getSessionId()); } @Override public void onStreamDropped(Session session, Stream stream) { Log.d(TAG, "onStreamDropped: Stream Dropped: " + stream.getStreamId() + " in session: " + session.getSessionId()); } @Override public void onError(Session session, OpentokError opentokError) { Log.e(TAG, "Session error: " + opentokError.getMessage()); } };

    • Lorsque le client se connecte à la session OpenTok, l'implémentation de la SessionListener.onConnected(session) est appelée.

    • Lorsque le client se déconnecte de la session OpenTok, la mise en œuvre de la SessionListener.onDisconnected(session) est appelée.

    • Si le client ne parvient pas à se connecter à la session OpenTok, la mise en œuvre de la SessionListener.onError(session, error) est appelée.

    • Lorsqu'un autre client publie un flux vers la session OpenTok, l'implémentation de la SessionListener.onStreamReceived(session, stream) est appelée.

    • Lorsqu'un autre client cesse de diffuser un flux vers la session OpenTok, l'implémentation de la SessionListener.onStreamDropped(session, stream) est appelée.

    Pour l'instant, l'application affiche la console du débogueur lorsque l'un de ces événements se produit.

Déboguez votre application. Si l'application parvient à se connecter à la session OpenTok, le SessionListener.onConnected(session) enregistre les données dans la console de débogage.

  1. Ajoutez les méthodes ci-dessous à l'élément MainActivity pour notifier à la session les événements du cycle de vie de l'activité :

    @Override protected void onPause() { super.onPause(); if (session != null) { session.onPause(); } } @Override protected void onResume() { super.onResume(); if (session != null) { session.onResume(); } }

Étape 6 : Personnalisation de l'interface utilisateur de l'application d'exemple

Le SDK Android d'OpenTok expose les vidéos que vous publiez et auxquelles vous vous abonnez sous forme d'objets View. Vous pouvez les ajouter en tant qu'enfants de ViewGroup dans votre application. Cet exemple d'application utilisera FrameLayout (qui étendent les objets ViewGroup) comme conteneurs pour les vues de l'éditeur et de l'abonné :

  1. Dans Android Studio, ouvrez le fichier app/res/layout/activity_main.xml. Cliquez sur l'onglet « Texte » situé en bas de l'éditeur pour afficher le code XML du fichier.

  2. Remplacez le contenu du fichier par le code suivant :

    <?xml version="1.0" encoding="utf-8"?> <androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" tools:context=".MainActivity"> <FrameLayout android:layout_width="fill_parent" android:layout_height="fill_parent" app:layout_constraintBottom_toBottomOf="parent" app:layout_constraintEnd_toEndOf="parent" app:layout_constraintStart_toStartOf="parent" app:layout_constraintTop_toTopOf="parent"> <FrameLayout android:id="@+id/subscriber_container" android:layout_width="fill_parent" android:layout_height="fill_parent" /> <FrameLayout android:id="@+id/publisher_container" android:layout_width="90dp" android:layout_height="120dp" android:layout_gravity="bottom|end" android:layout_marginEnd="16dp" android:layout_marginRight="16dp" android:layout_marginBottom="16dp" android:background="#CCCCCC" android:padding="2dp" /> </FrameLayout> </androidx.constraintlayout.widget.ConstraintLayout>

    Veillez à remplacer l'intégralité du contenu du fichier <TextView> (par l'intermédiaire de l'élément /> ).

  3. Déclarer maintenant publisherViewContainer et subscriberViewContainer en tant que propriétés de la classe MainActivity (juste après la déclaration de l'élément session ) :

    private FrameLayout publisherViewContainer; private FrameLayout subscriberViewContainer;

  4. Enfin, dans les onCreate() initialiser ces objets de vue de mise en page en ajoutant les lignes de code suivantes sous la méthode setContentView() appel à la méthode :

    publisherViewContainer = findViewById(R.id.publisher_container); subscriberViewContainer = findViewById(R.id.subscriber_container);

    À ce stade, votre onCreate() devrait ressembler à ceci :

    @Override
protected void onCreate(Bundle savedInstanceState) {

    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    publisherViewContainer = findViewById(R.id.publisher_container);
    subscriberViewContainer = findViewById(R.id.subscriber_container);

    requestPermissions();
}

Les étapes ci-dessus ne font que mettre en place un modèle de présentation pour cette application. Votre propre application peut ajouter des vues d'éditeur et d'abonné en tant qu'enfants d'autres vues d'éditeur et d'abonné. ViewGroup objets

Étape 7 : Publication d'un flux vers la session

Lorsque l'application se connecte à la session OpenTok, nous souhaitons qu'elle diffuse un flux audio-vidéo vers la session, en utilisant la caméra et le microphone :

  1. Ajouter un publisher à la classe MainActivity (après la déclaration de la propriété session ) :

    private Publisher publisher;

    La classe `Publisher` est définie dans le SDK Android d'OpenTok.

  2. Modifier la mise en œuvre de la SessionListener.onConnected() pour inclure le code permettant de publier un flux dans la session :

    @Override public void onConnected(Session session) { Log.d(TAG, "onConnected: Connected to session: " + session.getSessionId()); publisher = new Publisher.Builder(MainActivity.this).build(); publisher.setPublisherListener(publisherListener); publisher.getRenderer().setStyle(BaseVideoRenderer.STYLE_VIDEO_SCALE, BaseVideoRenderer.STYLE_VIDEO_FILL); publisherViewContainer.addView(publisher.getView()); if (publisher.getView() instanceof GLSurfaceView) { ((GLSurfaceView) publisher.getView()).setZOrderOnTop(true); } session.publish(publisher); }

    Le code ci-dessus utilise Publisher.Builder() pour instancier un objet Publisher. Le constructeur prend un paramètre : le contexte associé à ce processus (bien qu'il puisse être différent dans une application de production).

    Les Publisher.setPublisherListener() définit l'objet qui implémentera l'interface PublisherListener. Cette interface comprend des méthodes de rappel qui sont appelées en réponse à des événements liés à la publication.

    Important : Le contexte utilisé dépend du cas d'utilisation spécifique. Toutefois, il est généralement souhaitable que la session se déroule en dehors de l'activité (par exemple, entre deux activités). Pour les applications de production, il est plus pratique d'utiliser le contexte de l'application plutôt que celui de l'activité.

    Le code transmet ensuite l'objet Publisher en tant que paramètre de la fonction Session.publish() méthode. Cette méthode diffuse un flux audio-vidéo vers la session OpenTok, en utilisant la caméra et le microphone de l'appareil Android. (Notez que sur un appareil virtuel Android, le SDK OpenTok pour Android utilise une vidéo de test lors de la diffusion d'un flux).

    L'objet Publisher possède un getView() qui renvoie un objet Android View. Cette vue affiche la vidéo capturée par la caméra de l'appareil. Le code ajoute cette vue en tant que sous-vue de l'objet publisherViewContainer objet.

  3. Pour enregistrer les événements, ajoutez un publisherListener à la propriété sessionListener de la MainActivity:

    private PublisherKit.PublisherListener publisherListener = new PublisherKit.PublisherListener() { @Override public void onStreamCreated(PublisherKit publisherKit, Stream stream) { Log.d(TAG, "onStreamCreated: Publisher Stream Created. Own stream " + stream.getStreamId()); } @Override public void onStreamDestroyed(PublisherKit publisherKit, Stream stream) { Log.d(TAG, "onStreamDestroyed: Publisher Stream Destroyed. Own stream " + stream.getStreamId()); } @Override public void onError(PublisherKit publisherKit, OpentokError opentokError) { Log.e(TAG, "PublisherKit onError: " + opentokError.getMessage()); } };

    Notez que la classe `Publisher` hérite de la classe `PublisherKit` (également définie par le SDK Android d'OpenTok). La classe `PublisherKit` est une classe de base que vous pouvez utiliser pour créer des éditeurs avancés (tels que ceux qui utilisent des capteurs vidéo ou des moteurs de rendu personnalisés).

Il s'agit de la mise en œuvre de la PublisherListener des méthodes :

  • onStreamCreated(publisherKit, stream) — Appelée lorsque l'éditeur commence la diffusion en continu vers la session OpenTok.

  • onStreamDestroyed(publisherKit, stream) — Appelée lorsque l'éditeur cesse la diffusion en continu vers la session OpenTok.

  • onError(error) — Appelé lorsque le client ne parvient pas à publier vers la session OpenTok. Un OpentokError est transmis à la méthode.

Étape 8 : S'abonner à d'autres flux de clients

Nous voulons que les clients puissent souscrire à (ou voir) les flux d'autres clients dans la session :

  1. Ajouter un subscriber à la classe MainActivity (après la déclaration de la propriété publisher ) :

    private Subscriber subscriber;

    La classe `Subscriber` est définie dans le SDK Android d'OpenTok. Elle définit un objet qu'un client utilise pour s'abonner à (visualiser) un flux publié par un autre client.

  2. Modifier la mise en œuvre de la onStreamReceived(session, stream) (l'un des rappels de SessionListener) pour inclure du code permettant de s'abonner aux flux d'autres clients de la session :

    @Override public void onStreamReceived(Session session, Stream stream) { Log.d(TAG, "onStreamReceived: New Stream Received " + stream.getStreamId() + " in session: " + session.getSessionId()); if (subscriber == null) { subscriber = new Subscriber.Builder(MainActivity.this, stream).build(); subscriber.getRenderer().setStyle(BaseVideoRenderer.STYLE_VIDEO_SCALE, BaseVideoRenderer.STYLE_VIDEO_FILL); subscriber.setSubscriberListener(subscriberListener); session.subscribe(subscriber); subscriberViewContainer.addView(subscriber.getView()); } }

  3. Pour enregistrer des événements Ajouter subscriberListener propriété située juste en dessous sessionListener de la MainActivity:

    SubscriberKit.SubscriberListener subscriberListener = new SubscriberKit.SubscriberListener() { @Override public void onConnected(SubscriberKit subscriberKit) { Log.d(TAG, "onConnected: Subscriber connected. Stream: " + subscriberKit.getStream().getStreamId()); } @Override public void onDisconnected(SubscriberKit subscriberKit) { Log.d(TAG, "onDisconnected: Subscriber disconnected. Stream: " + subscriberKit.getStream().getStreamId()); } @Override public void onError(SubscriberKit subscriberKit, OpentokError opentokError) { Log.e(TAG, "SubscriberKit onError: " + opentokError.getMessage()); } };

Lorsqu'un autre client publie un flux vers une session, cette méthode est appelée et un objet `Stream` lui est transmis. La classe `Stream` est définie dans le SDK Android d'OpenTok et représente un flux audio-vidéo au sein de la session OpenTok.

Le code initialise une instance de la classe `Subscriber`, définie dans le SDK Android d'OpenTok. Le Subscriber.Builder() prend deux paramètres :

  • Le contexte de l'application Android associé à ce processus.

  • L'objet Stream (pour le flux que vous souhaitez visualiser)

Les Session.subscribe(subscriber) La méthode s'abonne au flux qui vient d'être reçu.

subscriberViewContainer.addView(subscriber.getView()) place la vue du nouveau flux abonné à l'écran.

  1. Modifier la mise en œuvre de la onStreamDropped(Session session, Stream stream) (un autre des rappels de SessionListener) :

    @Override public void onStreamDropped(Session session, Stream stream) { Log.i(TAG, "Stream Dropped"); if (subscriber != null) { subscriber = null; subscriberViewContainer.removeAllViews(); } }

    subscriberViewContainer.removeAllViews() supprime la vue d'un abonné une fois que le flux a été interrompu.

Étape 9 : Lancer l'application

Maintenant que votre code est complet, vous pouvez exécuter l'application dans l'émulateur Android Studio. L'émulateur n'ayant pas accès à votre webcam, la vidéo de l'éditeur affichera un graphique animé au lieu du flux de votre caméra.

Pour ajouter un deuxième éditeur (qui s'affichera comme un abonné dans votre émulateur), exécutez l'application une deuxième fois sur un appareil Android connecté ou utilisez la commande OpenTok Playground pour se connecter à la session dans un navigateur web compatible en suivant les étapes ci-dessous :

  1. Aller à OpenTok Playground (vous devez être connecté à votre Account)

  2. Sélectionnez l'option Rejoindre une session existante onglet

  3. Copiez l'identifiant de session que vous avez utilisé dans le fichier MainActivity.java et collez-le dans le fichier MainActivity.java. ID de la session champ de saisie

  4. Cliquez sur Rejoindre la session

  5. Dans l'écran suivant, cliquez sur Connecterpuis cliquez sur Publier un flux

  6. Vous pouvez ajuster les options de l'éditeur (non obligatoire), puis cliquez sur Continuer pour se connecter et commencer à publier et à s'abonner

À ce stade, vous devriez voir le flux publié par votre webcam ainsi que le flux publié par l'émulateur. Si vous revenez à l'émulateur, vous devriez également voir le nouvel éditeur s'afficher sur l'écran émulé.

Félicitations ! Vous avez terminé le tutoriel "Configurer un client Android de base".
Vous pouvez continuer à jouer avec le code que vous avez développé ici et l'ajuster pour le côté client de votre application, mais gardez à l'esprit que vous devrez mettre en œuvre la méthode composant du serveur de votre application avant de la mettre en production (voir Configuration de votre serveur ci-dessous).

Vous pouvez consulter une version complète de cet exemple d'application dans la section Basic-Video-Chat-Java du dossier vonage-video-android-sdk-samples sur GitHub. Cette version complète ajoute du code pour charger l'ID de session, le jeton et la clé API à partir d'un service web (au lieu d'utiliser des valeurs codées en dur).

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 :

Configuration de votre serveur

Dans le tutoriel ci-dessus, nous vous avons demandé de enregistrer vos identifiants d'authentification en dur. Toutefois, pour une application en production, le sessionId et token Les valeurs présentes dans votre code doivent être générées par votre serveur d'applications et transmises au client. Voici quelques raisons pour lesquelles il vaut mieux éviter d'utiliser des identifiants codés en dur dans votre application de production :

  • Les jetons expirent au bout d'un certain temps (déterminé lors de leur génération) ; il est donc nécessaire d'en générer régulièrement de nouveaux.
  • Vous ne pourrez pas créer de nouvelles sessions de manière dynamique ; par conséquent, tous les utilisateurs de votre application se retrouveront confinés dans une seule et même « salle ».

Vous pouvez continuer à tester votre application avec des valeurs codées en dur, mais lorsque vous serez prêt à mettre en place un serveur, plusieurs solutions s'offrent à vous :

Option serveur n° 1 — Lancer un serveur REST simple sur Heroku en un seul clic

C'est sans doute le moyen le plus rapide de mettre un serveur en service, mais ses fonctionnalités sont limitées. Il vous 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).

Deploy

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.

Vous préférez Node.js ? Visitez le site apprentissage-opentok-node dépôt contenant la même fonctionnalité sous Node.js (avec notamment un bouton de déploiement sur Heroku).

Une fois le serveur déployé sur Heroku, vous devrez ajouter du code à votre projet pour récupérer les identifiants depuis le serveur. Consultez l'implémentation côté client dans le Basic-Video-Chat-Java / Chat vidéo de base en Kotlin projet.

Option 2 pour le serveur — Développement à partir de zéro à l'aide des SDK du serveur

L'option 1 utilise des points de terminaison REST pour transmettre les identifiants au client, mais ce n'est qu'une des nombreuses façons de mettre en œuvre un serveur avec OpenTok. Si vous souhaitez bénéficier d'un niveau de personnalisation plus poussé, vous pouvez consulter la documentation d'OpenTok Documentation du SDK serveur pour le langage côté serveur de votre choix (disponible pour PHP, Node.js, Java, .NET, Python et Rubis). La documentation décrit le processus de configuration et les différentes méthodes à utiliser pour générer des sessions et des jetons, ainsi que d'autres fonctionnalités côté serveur.