Intégrer le chat Amazon Connect dans une application mobile - Amazon Connect
Flux de travail d'intégrationPrérequisInstaller des bibliothèquesConfiguration des informations d'identification AWSCommencer une discussionCréation d'une connexion pour les participantsUtiliser des WebSocket connexionsEnvoyer des messagesGérez les événementsMettre fin à une discussionCode source

Les traductions sont fournies par des outils de traduction automatique. En cas de conflit entre le contenu d'une traduction et celui de la version originale en anglais, la version anglaise prévaudra.

Intégrer le chat Amazon Connect dans une application mobile

Les rubriques de cette section expliquent comment créer une interface utilisateur de chat Amazon Connect personnalisée dans votre application mobile. Cela nécessite d'utiliser votre propre backend de chat. Vous devez également utiliser l'StartChatContactAPI Amazon Connect pour établir le contact, et les API du service participant pour gérer la participation au chat.

Note

L'StartChatContactAPI nécessite la AWS signature de la version 4 de Signature. Par conséquent, les demandes initiales doivent être acheminées via votre backend de chat personnel. Les appels d'API suivants à Amazon Connect Participant Service (ACPS) peuvent être traités directement depuis l'application mobile.

Flux de travail d'intégration

Le schéma suivant montre le flux de programmation entre un client utilisant une application mobile et un agent. Le texte numéroté dans le diagramme correspond au texte numéroté situé sous l'image.

Schéma illustrant le flux du programme de chat Amazon Connect.

Dans le schéma :

  1. Lorsqu'un client lance un chat dans l'application mobile, celle-ci envoie une demande à Amazon Connect à l'aide de l'StartChatContactAPI. Cela nécessite des paramètres spécifiques, tels que le point de terminaison de l'API et les identifiants de l'instance et du flux de contacts pour authentifier et lancer le chat.

  2. L'StartChatContactAPI interagit avec votre système principal pour obtenir un jeton de participant et un identifiant de contact qui servent d'identifiants uniques pour la session de chat.

  3. Le back-end de l'application utilise le jeton de participant et l'identifiant de contact pour communiquer avec Amazon Connect et configurer la session de chat du client.

  4. Le SDK Amazon Connect Participant est activé à l'aide du jeton de participant, préparant ainsi l'application pour le chat.

  5. Le SDK du participant utilise les détails de la session pour établir une ligne de communication sécurisée avec Amazon Connect.

  6. Amazon Connect répond en fournissant une WebSocket URL via le SDK du participant. L'application utilise cette URL pour créer une WebSocket connexion pour la messagerie en temps réel.

  7. Amazon Connect affecte un agent d'assistance au chat en fonction du flux de contacts et du profil de routage.

  8. Les messages de l'agent passent par la WebSocket connexion. L'application mobile écoute pour recevoir et WebSocket afficher les messages de l'agent, et pour renvoyer les messages aux clients.

Prérequis

Vous devez remplir les conditions préalables suivantes pour intégrer le chat Amazon Connect à une application mobile :

Installer des bibliothèques

Vous démarrez le processus d'intégration en installant les bibliothèques pour iOS et Android. Vous devez installer les deux ensembles de bibliothèques.

  • iOS : accédez au aws-sdk-iosréférentiel GitHub et installez ce qui suit :

    pod 'AWSCore'
pod 'AWSConnectParticipant'
pod 'Starscream', '~> 4.0'

  • Android : accédez au aws-sdk-androidréférentiel GitHub et installez ce qui suit :

    implementation("com.amazonaws:aws-android-sdk-core:2.73.0")
implementation("com.amazonaws:aws-android-sdk-connectparticipant:2.73.0")

Configuration des informations d'identification AWS

Après avoir installé les deux ensembles de bibliothèques, vous vous inscrivez auprès du service Amazon Connect et du service participant Amazon Connect. Pour ce faire, dans les fichiers de configuration de chaque système d'exploitation, utilisez vos AWS informations d'identification et remplacez les secretKey valeurs accessKey et par des chaînes vides (“”) comme indiqué dans les exemples suivants.

Important

Vous devez spécifier la région dans laquelle vous effectuez le test.

  • iOS : à utiliser AWSStaticCredentialsProvider pour l'enregistrement du service Amazon Connect et du service participant.

    private let config = Config()
 let credentials = AWSStaticCredentialsProvider(accessKey: "", secretKey: "")
 let participantService = AWSServiceConfiguration(region: config.region, credentialsProvider: credentials)!
 AWSConnectParticipant.register(with: participantService, forKey: "")
 connectParticipantClient = AWSConnectParticipant.init(forKey: "")

  • Android : initialisez AmazonConnectParticipantAsyncClient et définissez la région.

    private var connectParticipantClient: AmazonConnectParticipantAsyncClient = AmazonConnectParticipantAsyncClient()
private val chatConfiguration = Config
init {
      connectParticipantClient.setRegion(Region.getRegion(chatConfiguration.region))
     }
Note

Vous pouvez télécharger les fichiers de configuration depuis GitHub. Vous devez modifier les deux fichiers de configuration.

Commencer une discussion

Ensuite, vous devez intégrer l'StartChatContactAPI fournie par Amazon Connect. L'API lance la conversation en enregistrant l'intention du client de discuter avec un agent.

Note

Pour déployer une fonction StartChatContact Lambda, utilisez le CloudFront modèle sur. GitHub

Pour iOS et Android, l'appel d'StartChatContactAPI nécessite plusieurs informations :

  • InstanceId: identifiant de l'instance Amazon Connect.

  • ContactFlowId: identifiant du flux de contacts pour gérer le chat.

  • ParticipantDetails: informations sur le participant, telles que le nom d'affichage du client.

  • Attributes: informations supplémentaires sur le contact qui peuvent être utiles pour acheminer ou gérer le chat dans Amazon Connect.

Important

Vous devez utiliser AWS Signature Version 4 (SigV4) pour signer l'appel d'API. Le processus SigV4 ajoute des informations d'authentification aux demandes AWS d'API envoyées via HTTP. Pour les clients mobiles, nous recommandons d'exécuter le processus de signature côté serveur. Votre application mobile envoie une demande à votre serveur, qui la signe et la transmet à Amazon Connect. Cela permet de sécuriser vos AWS informations d'identification.

Pour iOS :

func startChatSession(displayName: String, completion: 
    @escaping (Result<StartChatResponse, Error>) -> Void) {
    // Your back end server will handle SigV4 signing and make the API call to Amazon Connect 
    // Use the completion handler to process the response or error 
}

Pour Android :

// Make a network call to your back end server 
suspend fun startChatSession(displayName: String): StartChatResponse {
    // Your back end server will handle SigV4 signing if needed and make the 
    // API call to Amazon Connect 
    // Handle the response or error accordingly 
}

Création d'une connexion pour les participants

Vous utilisez les informations reçues lors d'un appel d'StartChatContactAPI pour créer une connexion de participant. Vous appelez ensuite le SDK du participant AWS Connect, qui renvoie l' WebSocket URL nécessaire pour établir la connexion.

L'exemple suivant montre comment établir une connexion pour iOS :

// Swift code snippet for iOS participant connection setup
/// Creates the participant's connection. https://docs.aws.amazon.com/connect-participant/latest/APIReference/API_CreateParticipantConnection.html
/// - Parameter: participantToken: The ParticipantToken as obtained from StartChatContact API response.
func createParticipantConnection() {
    let createParticipantConnectionRequest = AWSConnectParticipantCreateParticipantConnectionRequest()
    createParticipantConnectionRequest?.participantToken = self.participantToken
    createParticipantConnectionRequest?.types = ["WEBSOCKET", "CONNECTION_CREDENTIALS"]
    connectParticipantClient?
        .createParticipantConnection (createParticipantConnectionRequest!)
        .continueWith(block: {
            (task) -> Any? in
            self.connectionToken = task.result!.connectionCredentials!.connectionToken
            self.websocketUrl = task.result!.websocket!.url
            return nil
        }
        ).waitUntilFinished()
    }

L'exemple suivant montre comment établir une connexion pour Android :

// Kotlin code snippet for Android participant connection setup
/// Creates the participant's connection. https://docs.aws.amazon.com/connect-participant/latest/APIReference/API_CreateParticipantConnection.html
/// - Parameter: participantToken: The ParticipantToken as obtained from StartChatContact API response.
fun createParticipantConnection(
    _participantToken: String,
      handler: AsyncHandler<CreateParticipantConnectionRequest, CreateParticipantConnectionResult>
    ) {
          val createParticipantConnectionRequest = CreateParticipantConnectionRequest().apply {
              setType(listOf("WEBSOCKET", "CONNECTION_CREDENTIALS"))
              participantToken = _participantToken
       }
          connectParticipantClient.createParticipantConnectionAsync(
              createParticipantConnectionRequest,
              handler
        )
    }

Utiliser des WebSocket connexions

Utilisez le SDK du participant pour obtenir une WebSocket URL pour la connexion au chat.

  • Pour mettre en œuvre WebSocket la gestion, utilisez les solutions existantes ou implémentez les vôtres.

  • Pour gérer les messages et les événements Websocket, implémentez votre propre solution ou utilisez nos solutions pour iOS et Android.

  • Assurez-vous de couvrir tous les types de messages et d'événements :

    • cas typing = "application/vnd.amazonaws.connect.event.typing"

    • cas messageDelivered = "application/vnd.amazonaws.connect.event.message.delivered"

    • cas messageRead = "application/vnd.amazonaws.connect.event.message.read"

    • cas metaData = "application/vnd.amazonaws.connect.event.message.metadata"

    • cas joined = "application/vnd.amazonaws.connect.event.participant.joined"

    • cas left = "application/vnd.amazonaws.connect.event.participant.left"

    • cas ended = "application/vnd.amazonaws.connect.event.chat.ended"

    • cas plainText = "text/plain"

    • cas richText = "text/markdown"

    • cas interactiveText = "application/vnd.amazonaws.connect.message.interactive"

L'image suivante montre une instance par défaut de Connect chat. Les chiffres de l'image correspondent au texte numéroté ci-dessous.

Image illustrant les composants d'une fenêtre de discussion Amazon Connect.

Sur l'image, en commençant par le haut :

  1. L'indicateur de saisie indique qui est en train de taper un message.

  2. Cet exemple utilise des messages en texte brut. Vous pouvez activer l'utilisation du markdown si vous le souhaitez.

  3. Le contrôle de liste interactif fournit aux utilisateurs des listes de choix, tels que le service client ou la facturation.

  4. Les réponses rapides interactives fournissent des réponses préprogrammées à des questions ou à des phrases courantes.

Envoyer des messages

Vous utilisez cette SendMessage fonction pour envoyer des messages de chat.

/// To send a message using the Participant SDK.
/// - Parameters:
///   - messageContent: The content of the message.
///   - connectionToken: The authentication token associated with the connection - Received from Participant Connection
///   - contentType: text/plain, text/markdown, application/json, and application/vnd.amazonaws.connect.message.interactive.response
func sendChatMessage(messageContent: String) {
    let sendMessageRequest = AWSConnectParticipantSendMessageRequest()
    sendMessageRequest?.connectionToken = self.connectionToken
    sendMessageRequest?.content = messageContent
    sendMessageRequest?.contentType = "text/plain"
    connectParticipantClient?
        .sendMessage(sendMessageRequest!)
        .continueWith(block: { (task) -> Any? in
            return nil
        })
}

Gérez les événements

Utilisez la SendEvent fonction du SDK du participant pour des événements tels que la saisie et la lecture de reçus.

/// Sends an event such as typing, joined, left etc.
/// - Parameters:
///   - contentType: The content type of the request
///   - content: The content of the event to be sent (for example, message text). For content related to message receipts, this is supported in the form of a JSON string.
func sendEvent(contentType: ContentType, content: String = "") {
    let sendEventRequest = AWSConnectParticipantSendEventRequest()
    sendEventRequest?.connectionToken = self.connectionToken
    sendEventRequest?.contentType = contentType.rawValue
    sendEventRequest?.content = content // Set the content here
    connectParticipantClient?
        .sendEvent(sendEventRequest!)
        .continueWith(block: { (task) -> Any? in
            return nil
        })
}

Mettre fin à une discussion

Pour mettre fin à une discussion, utilisez la disconnectParticipant fonction du SDK du participant.

/// Disconnects a participant.
/// - Parameter: connectionToken: The authentication token associated with the connection - Received from Participant Connection
func endChat() {
    let disconnectParticipantRequest = AWSConnectParticipantDisconnectParticipantRequest()
    disconnectParticipantRequest?.connectionToken = self.connectionToken
    connectParticipantClient?.disconnectParticipant(disconnectParticipantRequest!)
        .continueWith(block: { (task) -> Any? in
            return nil
        }).waitUntilFinished()
    self.websocketUrl = nil
}

Code source

Les exemples de projets suivants GitHub montrent comment implémenter le chat Connect.