Integración de la pantalla compartida, las videollamadas, las llamadas web y las llamadas dentro de la aplicación de forma nativa en su aplicación - Amazon Connect
Cómo inicia un dispositivo de cliente una llamada desde la aplicación o webIntroducciónPasos de la opción

Las traducciones son generadas a través de traducción automática. En caso de conflicto entre la traducción y la version original de inglés, prevalecerá la version en inglés.

Integración de la pantalla compartida, las videollamadas, las llamadas web y las llamadas dentro de la aplicación de forma nativa en su aplicación

Cómo integrar la pantalla compartida, las videollamadas, las llamadas web y las llamadas dentro de la aplicación de Amazon Connect en su aplicación:

  1. Usa la StartWebRTCContactAPI Amazon Connect para crear el contacto.

  2. A continuación, utilice los detalles devueltos por la llamada a la API para unirse a la llamada mediante la biblioteca de Amazon Chime clientes para iOS, Android o JavaScript.

Para obtener más información sobre cómo crear participantes adicionales, consulte Habilitación de videollamadas, llamadas web y llamadas multiusuario dentro de la aplicación.

Consulta el siguiente repositorio de Github para ver ejemplos de aplicaciones: amazon-connect-in-app-calling-examples.

Cómo inicia un dispositivo de cliente una llamada desde la aplicación o web

El siguiente diagrama muestra la secuencia de eventos para que un dispositivo de cliente (aplicación móvil o navegador) inicie una llamada desde la aplicación o desde la web.

Diagrama conceptual que muestra cómo un dispositivo de cliente inicia una llamada.

  1. El cliente usa la aplicación de cliente (sitio web o aplicación) para iniciar una llamada desde la aplicación o desde la web.

  2. La aplicación cliente (sitio web o aplicación móvil) o el servidor web utilizan la Amazon Connect StartWebRTCContactAPI para iniciar el contacto al que se le transfiere cualquier atributo o contexto. Amazon Connect

  3. La aplicación cliente se une a la llamada utilizando los detalles devueltos StartWebRTCContacten el paso 2.

  4. (Opcional) El cliente usa la CreateParticipantConnectionAPI para recibir una ConnectionToken que se usa para enviar el DTMF a través de la SendMessageAPI.

  5. El contacto llega al flujo, se enruta en función del flujo y se coloca en la cola.

  6. El agente acepta el contacto.

  7. (Opcional) Si el vídeo está activado para el cliente y el agente, estos podrán iniciar su vídeo.

  8. (Opcional, no se muestra en el diagrama) Se pueden añadir participantes adicionales con las CreateParticipantteclas y. CreateParticipantConnection APIs

Introducción

A continuación se muestran los pasos de alto nivel para comenzar:

  1. Usa la StartWebRTCContactAPI para crear el contacto. La API devuelve los detalles necesarios para que el cliente de Amazon Chime SDK se una a la llamada.

  2. Cree una instancia del objeto de MeetingSessionConfiguration cliente del SDK de Amazon Chime con las configuraciones devueltas por. StartWebRTCContact

  3. Cree una instancia del objeto DefaultMeetingSession de cliente de Amazon Chime SDK con MeetingSessionConfiguration, creada en el paso 2, para crear una sesión de reunión con el cliente.

    • iOS

      let logger = ConsoleLogger(name: "logger") 
let meetingSession = DefaultMeetingSession(
    configuration: meetingSessionConfig, 
    logger: logger
)

    • Android

      val logger = ConsoleLogger()
val meetingSession = DefaultMeetingSession(
    configuration = meetingSessionConfig,
    logger = logger,
    context = applicationContext
)

    • JavaScript

      const logger = new ConsoleLogger('MeetingLogs', LogLevel.INFO);
const deviceController = new DefaultDeviceController(logger);
const configuration = new MeetingSessionConfiguration(
    meetingResponse, 
    attendeeResponse
);
const meetingSession = new DefaultMeetingSession(
    configuration, 
    logger, 
    deviceController
);

  4. Utilice el método meetingSession.audioVideo.start() para unir el contacto de WebRTC con el audio.

    • iOS/Android

      meetingSession.audioVideo.start()

    • JavaScript

      await meetingSession.audioVideo.start();

  5. Utilice el método meetingSession.audioVideo.stop() para colgar el contacto de WebRTC.

    • iOS/Android

      meetingSession.audioVideo.stop()

    • JavaScript

      meetingSession.audioVideo.stop();

Pasos de la opción

Para obtener más información sobre las operaciones y la documentación completa sobre las API, consulte las guías de descripción general de las API específicas de la plataforma:

Envío de tonos DTMF

Para enviar DTMF a la llamada, se necesitan dos servicios APIs de participación de Amazon Connect: CreateParticipantConnectiony SendMessagerespectivamente.

nota

contentTypeya que la SendMessage API debe ser. audio/dtmf

  1. Invoca CreateParticipantConnectionpara recuperarConnectionToken. (ParticipantTokenes necesario para llamar a esta API. Puedes encontrarlo en la StartWebRTCContactrespuesta).

  2. Con laConnectionToken, llame SendMessagepara enviar dígitos DTMF.

Selección de dispositivos de audio

Para seleccionar el input/output dispositivo de audio, puede usar los métodos del cliente SDK de Amazon Chime para Android e iOS o las capacidades nativas de iOS para iOS.

iOS/Android

meetingSession.audioVideo.listAudioDevices()
meetingSession.audioVideo.chooseAudioDevice(mediaDevice)

JavaScript

await meetingSession.audioVideo.listAudioInputDevices();
await meetingSession.audioVideo.listAudioOutputDevices();
await meetingSession.audioVideo.startAudioInput(device);
await meetingSession.audioVideo.chooseAudioOutput(deviceId);

Activación y desactivación del audio

Para silenciar y dejar de silenciar, use meetingSession.audioVideo.realtimeLocalMute() y meetingSession.audioVideo.realtimeLocalUnmute().

iOS/Android

meetingSession.audioVideo.realtimeLocalMute()
meetingSession.audioVideo.realtimeLocalUnmute()

JavaScript

meetingSession.audioVideo.realtimeMuteLocalAudio();
meetingSession.audioVideo.realtimeUnmuteLocalAudio();

Inicio de autovideo

Para iniciar el autovideo, utilice meetingSession.audioVideo.startLocalVideo(). Consulte las guías sobre API de la biblioteca de clientes para obtener más información sobre cómo enumerar y elegir dispositivos específicos.

iOS/Android

meetingSession.audioVideo.startLocalVideo()

JavaScript

meetingSession.audioVideo.startLocalVideoTile();

Detención de autovideo

Para detener el autovideo, utilice meetingSession.audioVideo.stopLocalVideo().

iOS/Android

meetingSession.audioVideo.stopLocalVideo()

JavaScript

meetingSession.audioVideo.stopLocalVideoTile();

Activación del vídeo del agente

Para permitir la recepción y carga del vídeo del agente dentro de la aplicación, utilice meetingSession.audioVideo.startRemoteVideo(). También necesitará implementar observadores de mosaicos de vídeo y vincular los mosaicos de vídeo a las vistas de la pantalla.

iOS/Android

meetingSession.audioVideo.startRemoteVideo()
// Implement VideoTileObserver to handle video tiles
meetingSession.audioVideo.addVideoTileObserver(observer)
// In videoTileDidAdd callback:
meetingSession.audioVideo.bindVideoView(videoView, tileId: tileState.tileId)

JavaScript

// Remote video is received automatically when available
// Implement AudioVideoObserver to handle video tiles
meetingSession.audioVideo.addObserver(observer);
// In videoTileDidUpdate callback:
meetingSession.audioVideo.bindVideoElement(tileId, videoElement);

Consulte las guías de SDK específicas de la plataforma para obtener más información sobre la implementación de los mosaicos de vídeo.

Desactivación del vídeo del agente

Para impedir la recepción y carga del vídeo del agente dentro de la aplicación, utilice meetingSession.audioVideo.stopRemoteVideo().

iOS/Android

meetingSession.audioVideo.stopRemoteVideo()
meetingSession.audioVideo.unbindVideoView(tileId)

JavaScript

meetingSession.audioVideo.unbindVideoElement(tileId);

Uso de mensajes de datos

Puede utilizar mensajes de datos si necesita enviar cualquier estado desde el agente al usuario final. Por ejemplo, cuando los clientes están en espera, puedes enviar un mensaje de datos a la aplicación del cliente para que muestre un mensaje en el que se le informe de que están en espera y que se sigue enviando la información compartida, o puedes desactivar la video/screen opción de video/screen compartir.

iOS/Android

meetingSession.audioVideo.realtimeSendDataMessage(topic, data, lifetimeMs)
meetingSession.audioVideo.addRealtimeDataMessageObserver(topic, observer)

JavaScript

meetingSession.audioVideo.realtimeSendDataMessage(topic, data, lifetimeMs);
meetingSession.audioVideo.realtimeSubscribeToReceiveDataMessage(topic, callback);

Cómo escuchar eventos de detención

Puede escuchar los eventos en los que finaliza la participación de un contacto a través del observador audioVideoDidStop. Los códigos de estado específicos pueden variar según la plataforma.

La llamada alcanza su capacidad máxima

Cuando más de seis personas intenten unirse a la llamada, otros participantes recibirán el siguiente error y no podrán unirse hasta que otros se vayan.

  • iOS: MeetingSessionStatusCode.audioCallAtCapacity o MeetingSessionStatusCode.audioAuthenticationRejected

  • Android: MeetingSessionStatusCode.AudioCallAtCapacity o MeetingSessionStatusCode.AudioAuthenticationRejected

  • JavaScript: o MeetingSessionStatusCode.AudioCallAtCapacity MeetingSessionStatusCode.AudioAuthenticationRejected

Se elimina a un participante de la llamada

Cuando el agente retire a un participante de la llamada, pero el contacto continúe, los demás participantes recibirán el siguiente código de estado. Tenga en cuenta que, si la eliminación de un participante provoca la finalización del contacto, recibirán este estado o el estado de cierre del contacto.

  • iOS: MeetingSessionStatusCode.audioServerHungup o MeetingSessionStatusCode.audioAuthenticationRejected

  • Android: MeetingSessionStatusCode.AudioServerHungup o MeetingSessionStatusCode.AudioAuthenticationRejected

  • JavaScript: MeetingSessionStatusCode.AudioAttendeeRemoved o MeetingSessionStatusCode.AudioAuthenticationRejected

El contacto finaliza

Cuando el contacto real finalice por completo, todos los participantes recibirán el siguiente código de estado.

  • iOS: MeetingSessionStatusCode.audioCallEnded

  • Android: MeetingSessionStatusCode.AudioCallEnded

  • JavaScript: MeetingSessionStatusCode.AudioCallEnded