Tutoriel : Création d'une application de WebSocket chat avec une WebSocket API, Lambda et DynamoDB

Dans ce didacticiel, vous allez créer une application de chat sans serveur avec une WebSocket API. Avec une WebSocket API, vous pouvez prendre en charge la communication bidirectionnelle entre les clients. Les clients peuvent recevoir des messages sans avoir à rechercher les mises à jour.

Ce didacticiel vous prendra environ 30 minutes. Tout d'abord, vous allez utiliser un AWS CloudFormation modèle pour créer des fonctions Lambda qui géreront les demandes d'API, ainsi qu'une table DynamoDB qui stocke les identifiants de vos clients. Vous allez ensuite utiliser la console API Gateway pour créer une WebSocket API qui s'intègre à vos fonctions Lambda. Enfin, vous allez tester votre API pour vérifier que les messages sont envoyés et reçus.

Pour suivre ce didacticiel, vous avez besoin d'un AWS compte et d'un AWS Identity and Access Management utilisateur ayant accès à la console. Pour plus d’informations, consultez Prérequis pour démarrer avec API Gateway.

Vous avez également besoin de wscat pour vous connecter à votre API. Pour plus d’informations, consultez wscatÀ utiliser pour se connecter à une WebSocket API et y envoyer des messages.

Étape 1 : Création de fonctions Lambda et d'une table DynamoDB

Téléchargez et décompressez le modèle de création d'application pour AWS CloudFormation. Vous allez utiliser ce modèle pour créer une table Amazon DynamoDB afin de stocker les ID client de votre application. Chaque client connecté possède un identifiant unique que nous utiliserons comme clé de partition de la table. Ce modèle crée également des fonctions Lambda qui mettent à jour vos connexions client dans DynamoDB et gèrent l'envoi de messages aux clients connectés.

Pour créer une AWS CloudFormation pile

1. Ouvrez la AWS CloudFormation console à l'adresse https://console.aws.amazon.com/cloudformation.

2. Choisissez Créer une pile, puis choisissez Avec de nouvelles ressources (standard).

3. Dans Spécifier le modèle, choisissez Charger un modèle de fichier.

4. Sélectionnez le modèle que vous avez téléchargé.

5. Choisissez Suivant.

6. Pour Nom de la pile, saisissez websocket-api-chat-app-tutorial, puis choisissez Suivant.

7. Pour Configurer les options de pile, choisissez Suivant.

8. Pour les fonctionnalités, reconnaissez que AWS CloudFormation vous pouvez créer des ressources IAM dans votre compte.

9. Sélectionnez Envoyer.

AWS CloudFormation fournit les ressources spécifiées dans le modèle. La fin du provisionnement de vos ressources peut prendre quelques minutes. Lorsque le statut de votre AWS CloudFormation pile est CREATE_COMPLETE, vous êtes prêt à passer à l'étape suivante.

Étape 2 : Création d'une WebSocket API

Vous allez créer une WebSocket API pour gérer les connexions client et acheminer les demandes vers les fonctions Lambda que vous avez créées à l'étape 1.

Pour créer une WebSocket API

1. Connectez-vous à la console API Gateway à l'adresse : https://console.aws.amazon.com/apigateway.

2. Sélectionnez Create API (Créer une API). Ensuite, pour WebSocket API, choisissez Build.

3. Sous API name (Nom de l'API), saisissez websocket-chat-app-tutorial.

4. Pour Route selction expression (Expression de sélection d'itinéraire), entrez request.body.action. Expression de sélection de route pour déterminer la route à appeler lorsqu'un client envoie un message.

5. Choisissez Suivant.

6. Pour Predefined routes (Routes prédéfinies), choisissez Add $connect (Ajouter $connect), Add $disconnect (Ajouter $disconnect) et Add $default (Ajouter $default). Les routes $connect et $disconnect sont des itinéraires spéciaux qu’API Gateway appelle automatiquement lorsqu'un client se connecte à une API ou se déconnecte de celle-ci. API Gateway appelle la route $default lorsqu'aucune autre route ne correspond à une demande.

7. Pour Custom routes (Routes personnalisées), choisissez Add custom route (Ajouter une route personnalisée). Pour Route key (Clé de route), entrez sendmessage. Cette route personnalisée gère les messages envoyés aux clients connectés.

8. Choisissez Suivant.

9. Sous Attach integrations (Attacher les intégrations), pour chaque route et type d'intégration, choisissez Lambda.

   Pour Lambda, choisissez la fonction Lambda correspondante que vous avez créée à l'étape 1. AWS CloudFormation Le nom de chaque fonction correspond à une route. Par exemple, pour la route $connect, choisissez la fonction nommée websocket-chat-app-tutorial-ConnectHandler.

10. Passez en revue l'étape créée par API Gateway pour vous. Par défaut, API Gateway crée un nom d’étape production et déploie automatiquement votre API à ce stade. Choisissez Suivant.

11. Choisissez Create and deploy (Créer et déployer).

Étape 3 : Tester votre API

Ensuite, vous testez votre API pour vérifier qu'elle fonctionne. Pour vous connecter à l’API, utilisez la commande wscat.

Pour obtenir l'URL d’appel de votre API

1. Connectez-vous à la console API Gateway à l'adresse https://console.aws.amazon.com/apigateway.

2. Choisissez votre API.

3. Choisissez Stages (Étapes), puis production.

4. Notez l'WebSocket URL de votre API. L'URL doit ressembler à wss://abcdef123.execute-api.us-east-2.amazonaws.com/production.

Pour vous connecter à votre API

1. Utilisez la commande suivante pour vous connecter à votre API. Lorsque vous vous connectez à votre API, API Gateway appelle la route $connect. Lorsque cette route est appelée, il appelle une fonction Lambda qui stocke votre ID de connexion dans DynamoDB.

   wscat -c wss://abcdef123.execute-api.us-west-2.amazonaws.com/production

   Connected (press CTRL+C to quit)

2. Ouvrez un nouveau terminal et exécutez à nouveau la commande wscat avec les paramètres suivants.

   wscat -c wss://abcdef123.execute-api.us-west-2.amazonaws.com/production

   Connected (press CTRL+C to quit)

   Vous disposez ainsi de deux clients connectés capables d'échanger des messages.

Pour envoyer un message

• API Gateway détermine la route à appeler en fonction de l'expression de sélection de route de votre API. L'expression de sélection de route de votre API est $request.body.action. Par conséquent, API Gateway appelle la route sendmessage lorsque vous envoyez le message suivant :

  {"action": "sendmessage", "message": "hello, everyone!"}

  La fonction Lambda associée à l'itinéraire appelé collecte les ID client de DynamoDB. Ensuite, la fonction appelle API Gateway Management et envoie le message à ces clients. Tous les clients connectés reçoivent le message suivant :

  < hello, everyone!

Pour appeler la route $ par défaut de votre API

• API Gateway appelle la route par défaut de votre API lorsqu'un client envoie un message qui ne correspond pas à vos routes définies. La fonction Lambda associée à la route $default utilise API Gateway Management pour envoyer au client des informations relatives à leur connexion.

  test

  Use the sendmessage route to send a message. Your info: {"ConnectedAt":"2022-01-25T18:50:04.673Z","Identity":{"SourceIp":"192.0.2.1","UserAgent":null},"LastActiveAt":"2022-01-25T18:50:07.642Z","connectionID":"Mg_ugfpqPHcCIVA="}

Pour vous déconnecter de votre API

• Pour vous déconnecter de votre API, appuyez sur CTRL+C. Lorsqu'un client se déconnecte de votre API, API Gateway appelle la route $disconnect. L'intégration Lambda pour la route $disconnect de votre API supprime l'ID de connexion de DynamoDB.

Étape 4 : Nettoyer

Pour éviter des coûts inutiles, supprimez les ressources que vous avez créées dans le cadre de ce tutoriel. Les étapes suivantes suppriment votre AWS CloudFormation stack et votre WebSocket API.

Pour supprimer une WebSocket API

1. Connectez-vous à la console API Gateway à l'adresse : https://console.aws.amazon.com/apigateway.

2. Sur la page APIs (API), sélectionnez votre API websocket-chat-app-tutorial. Choisissez Actions, choisissez Supprimer, puis confirmez votre choix.

Pour supprimer une AWS CloudFormation pile

1. Ouvrez la AWS CloudFormation console à l'adresse https://console.aws.amazon.com/cloudformation.

2. Sélectionnez votre AWS CloudFormation pile.

3. Choisissez Supprimer, puis confirmez votre choix.

Prochaines étapes : Automatisez avec AWS CloudFormation

Vous pouvez automatiser la création et le nettoyage de toutes les AWS ressources impliquées dans ce didacticiel. Pour un AWS CloudFormation modèle qui crée cette API et toutes les ressources associées, consultez chat-app.yaml.