Cómo hacer videollamadas con Vonage Video y Flutter

Flutter está ganando cada vez más popularidad, así que decidimos construir una aplicación sencilla que permite hacer videollamadas entre dos dispositivos. Las dos tecnologías utilizadas para crear la aplicación son Flutter y Vonage Video SDKs. Vamos a recapitular rápidamente estas tecnologías:

• Flutter - kit de desarrollo de software de interfaz de usuario de código abierto utilizado para desarrollar aplicaciones multiplataforma para Android, iOS, Linux y Mac. El lenguaje de programación principal es Dart.

• Vonage Video - utilizado para crear videollamadas entre varios dispositivos. Los lenguajes de programación utilizados son Kotlin para la plataforma Android y Swift para la plataforma iOS.

Esta aplicación es un equivalente en Flutter de la aplicación Basic-Video-Chat (Basic-Video-Chat Android / Basic-Video-Chat iOS). Estas son las principales características de la aplicación:

• Conéctate a una sesión de Vonage Video

• Publicar un flujo de audio y vídeo en la sesión

• Suscribirse al flujo de audio y vídeo de otro cliente

NOTA: El código fuente de la aplicación está disponible en GitHub.

Flutter es la tecnología principal aquí. Es una base utilizada para construir una aplicación móvil que se ejecuta en Android e iOS. Se encargará de gestionar y mostrar la interfaz de usuario, y contendrá la lógica de la aplicación. De esta forma, la lógica de la aplicación se escribe una sola vez para ambas plataformas.

Bajo el capó, esta aplicación Flutter utilizará Android Vonage Video SDK y SDK de Video de Vonage para iOS (a través de proyectos nativos Android/iOS):

El código nativo de la plataforma (Android, iOS) se comunica con Flutter utilizando Flutter MethodChannelque utiliza llamadas a métodos. MethodChannel sirve como puente para enviar mensajes entre Flutter y el código nativo (añadido al proyecto nativo de Android y al proyecto nativo de iOS). Esto nos permite iniciar la sesión del usuario y configurar la sesión de Video para realizar una videollamada:

Flutter puede enviar mensajes a la parte nativa (Android / iOS) de la aplicación y la parte nativa de la aplicación puede enviar un mensaje de vuelta a Flutter. Flutter llama al método initSession y le pasa el método apiKey, sessionIdy token al código nativo para iniciar una sesión de Vonage Video. El código nativo informará a la parte Flutter de la app sobre un inicio de sesión correcto (o un error) y el código del lado Flutter actualizará la IU.

NOTA: Una aplicación Flutter puede empaquetarse como aplicación Android o iOS, pero nunca como ambas a la vez. Cuando la plataforma de destino es Android, MethodChannel se comunica con el código nativo de la aplicación Android. Si la plataforma de destino es iOS, MethodChannel se comunica con el código nativo de la aplicación iOS.

Para ejecutar la aplicación tendrás que instalar Flutter. Esto varía de una plataforma a otra, como puedes ver en las instrucciones detalladas.

NOTA: Asegúrese de ejecutar flutter doctor para verificar la configuración local de Flutter.

Para iniciar sesión en la sesión de Vonage Video, necesitarás una cuenta de Vonage Video y generar initSession, apiKeyy sessionId. Puedes obtener estos valores en el Panel de Video de Vonage. Ahora abre el archivo main.dart y utiliza esos valores en las variables correspondientes:

static String API_KEY = "";
static String SESSION_ID = "";
static String TOKEN = "";

Abre la aplicación móvil para iniciar la videollamada.

NOTA: Puede utilizar Zona de juegos para desarrolladores para conectarse a la misma sesión que el dispositivo móvil que ejecuta la aplicación Flutter.

Resumen

Todavía hay algunos inconvenientespero la integración general de Flutter y Vonage Video es bastante fluida. Incluso sin un paquete Flutter nativo, es posible crear rápidamente una aplicación Flutter completa que utilice los SDK móviles de Vonage Video y se ejecute en dispositivos Android e iOS.