Vonage Video React Native SDK unterstützt neue Architektur

Die Version 2.31.0-beta.2 des Vonage Video React Native SDK unterstützt die React Native neue Architektur.

Die Beta-Version 2.31 unterstützt dieselbe API wie frühere Versionen des Vonage Video Native SDK. Siehe die Liste der bekannte Probleme.

Diese Betaversion ist nicht für die Verwendung in endgültigen Produktionsanwendungen vorgesehen.

Die Version 2.31 wird nur in der neuen Architektur von React Native unterstützt. Sie wird nicht in Apps unterstützt, die die alte Architektur verwenden.

Systemanforderungen

Die Version 2.31 des Vonage Video React Native SDK wird nur in der React Native neue Architektur. Wenn Ihre App in einer Version von React Native ausgeführt werden muss, die nicht die neue Architektur verwendet, müssen Sie eine frühere Version des Vonage Video Native SDK (z. B. Version 2.30) verwenden.

Einrichtung

Sie können diese Beta-Version von npmjs installieren:

npm install @vonage/client-sdk-video-react-native@2.31.0-beta.2

... oder ...

yarn add @vonage/client-sdk-video-react-native@2.31.0-beta.2

Die Installationsschritte für Android und iOS sind im Grunde die gleichen wie bei den vorherigen Versionen. Für diese Version müssen Sie jedoch die Vonage Video-Pakete in Ihrer Anwendung registrieren.

Für Android, registrieren Sie die OpentokReactNativePackage, OTPublisherViewNativePackageund OTSubscriberViewNativePackage Pakete in der MainActivity-Datei für Ihre App. Siehe Schritt 6 des Abschnitts "Android-Installation" unten.

Für iOS, registrieren Sie die OpentokReactNativePackage, OTPublisherViewNativePackageund OTSubscriberViewNativePackage Pakete in der MainActivity-Datei für Ihre App. Siehe Schritt 4 des Abschnitts "iOS-Installation" unten.

iOS-Installation

  1. Installieren Sie die iOS-Pods:

    npx pod-install
    
  2. Für React Native-Versionen vor 0.60:

    • Fügen Sie dies zu Ihrem Podfile hinzu:

      target '<YourProjectName>' do
          # Pods for <YourProject>
          pod 'OTXCFramework', '2.30.1'
      end
      
    • ausführen. react-native link @vonage/client-sdk-video-react-native.

    Diese Schritte sind in React Native Version 0.60 und höher nicht notwendig.

  3. Stellen Sie sicher, dass Sie sowohl die Kamera- als auch die Mikrofonverwendung aktiviert haben, indem Sie die folgenden Einträge in die Info.plist Datei:

    <key>NSCameraUsageDescription</key>
    <string>Your message to user when the camera is accessed for the first time</string>
    <key>NSMicrophoneUsageDescription</key>
    <string>Your message to user when the microphone is accessed for the first time</string>
    

Wenn Sie ein Archiv Ihrer Anwendung erstellen, wird die Einstellungen für das Datenschutzmanifest, die von Apples App Store verlangt werden werden mit dieser Version des Vonage Video React Native SDK automatisch hinzugefügt.

  1. Registrieren Sie die Klassen OTPublisherViewNative und OTSubscriberViewNative. Ändern Sie dazu die AppDelegate-Implementierung.

    • Wenn Ihre Anwendung über eine Objective-C++ AppDelegate-Datei (AppDelegate.mm) verfügt, fügen Sie diese Klassen der Liste der Pakete im NSMutableDictionary hinzu, das von der Funktion thirdPartyFabricComponents() Funktion:
         #import "OTPublisherViewNativeComponentView.h"
         #import "OTSubscriberViewNativeComponentView.h"
    
     @implementation AppDelegate
         // ...
         - (NSDictionary<NSString *,Class<RCTComponentViewProtocol>> *)thirdPartyFabricComponents
     {
     NSMutableDictionary * dictionary = [super thirdPartyFabricComponents].mutableCopy;
     dictionary[@"OTPublisherViewNative"] = [OTPublisherViewNativeComponentView class];
     dictionary[@"OTSubscriberViewNative"] = [OTSubscriberViewNativeComponentView class];
     return dictionary;
     }
     
     @end
    
    • Wenn Ihre Anwendung eine Swift-AppDelegate-Datei (AppDelegate.swift) verwendet, müssen Sie deren Implementierung der RCTAppDelegate.application(_, didFinishLaunchingWithOptions) Methode einen Bridging-Header verwenden, um eine Methode in einer Objective-C++-Datei aufzurufen, die die [RCTComponentViewFactory registerComponentViewClass:] Methode und übergibt dabei die OTPublisherViewNativeComponentView und OTSubscriberViewNativeComponentView Klassen.
  2. Wenn Ihre Anwendung die OTPublisher.setVideoTransformers() oder OTPublisher.setAudioTransformers() Methode zu verwenden, müssen Sie Folgendes in Ihr Podfile aufnehmen:

    pod 'VonageClientSDKVideoTransformers'
    

Wenn Sie versuchen, die Anwendung zu archivieren und dies fehlschlägt, gehen Sie bitte wie folgt vor:

  1. Gehe zu Ziel.

  2. Klicken Sie auf Bauphasen.

  3. Im Rahmen der Binär mit Bibliotheken verknüpfen Abschnitt, entfernen libOpenTokReactNative.a und fügen Sie es wieder hinzu.

Android-Installation

  1. Wechseln Sie in Ihrem Terminal in Ihr Projektverzeichnis.

  2. Für React Native-Versionen vor 0.60:

    • ausführen. react-native link @vonage/client-sdk-video-react-native

    Dieser Schritt ist in React Native Version 0.60 und höher nicht notwendig.

  3. ausführen. bundle install.

  4. Stellen Sie sicher, dass in der gradle-Datei Ihrer Anwendung compileSdkVersion, buildToolsVersion, minSdkVersionund targetSdkVersion größer oder gleich den in der Vonage Video React Native-Bibliothek angegebenen Versionen sind.

  5. Das SDK fügt automatisch die erforderlichen Android-Berechtigungen hinzu. Sie müssen diese nicht zu Ihrem App-Manifest hinzufügen. Bei bestimmten Berechtigungen müssen Sie den Benutzer jedoch dazu auffordern. Siehe die vollständige Liste der erforderlichen Genehmigungen in der Vonage Video API Android SDK Dokumentation.

  6. Registrieren Sie in der Datei MainActivity.kt für Ihre Anwendung die Pakete OpentokReactNativePackage, OTPublisherViewNativePackage und OTSubscriberViewNativePackage. Ändern Sie dazu die Datei MainApplication, indem Sie diese Pakete zur Liste der Pakete hinzufügen, die von der Funktion getPackages() Funktion

    override fun getPackages(): List<ReactPackage> =
        PackageList(this).packages.apply {
            add(OTPublisherViewNativePackage())
            add(OTSubscriberViewNativePackage())
            add(OpentokReactNativePackage())
        }
        // ...
    
  7. Wenn Ihre Anwendung die OTPublisher.setVideoTransformers() oder OTPublisher.setAudioTransformers() Methode zu verwenden, müssen Sie Folgendes in Ihre app/build.gradle-Datei aufnehmen:

    implementation "com.vonage:client-sdk-video-transformers:2.30.1"
    

Bekannte Probleme

Die folgenden Probleme sind in dieser Betaversion bekannt:

  • Bei der Verwendung von VP9 oder H264 frieren die Videos der Teilnehmer häufig ein.
  • otrnError Ereignisse fehlen.