Partager via


Communication : création d’une ressource Azure Communication Services

Une communication efficace est essentielle pour les applications métier personnalisées réussies. À l’aide d’Azure Communication Services (ACS), vous pouvez ajouter des fonctionnalités telles que les appels téléphoniques, les conversations en direct, les appels audio/vidéo et la messagerie électronique et sms à vos applications. Précédemment, vous avez appris comment Azure OpenAI peut générer des achèvements pour les messages électroniques et SMS. À présent, vous allez apprendre à envoyer les messages. Ensemble, ACS et OpenAI peuvent améliorer vos applications en simplifiant la communication, en améliorant les interactions et en améliorant la productivité de l’entreprise.

Dans cet exercice, vous allez :

  • Créez une ressource Azure Communication Services (ACS).
  • Ajoutez un numéro de téléphone gratuit avec des fonctionnalités d’appel et de SMS.
  • Connectez un domaine de messagerie.
  • Mettez à jour le fichier .env du projet avec des valeurs de votre ressource ACS.

Vue d’ensemble du scénario Microsoft Cloud

Créer une ressource Azure Communication Services

  1. Visitez le portail Azure dans votre navigateur et connectez-vous si ce n’est déjà fait.

  2. Tapez les services de communication dans la barre de recherche en haut de la page et sélectionnez Communication Services dans les options qui s’affichent.

    ACS dans le portail Azure

  3. Sélectionnez Créer dans la barre d’outils.

  4. Effectuez les tâches suivantes :

    • Sélectionnez votre abonnement Azure.
    • Sélectionnez le groupe de ressources à utiliser (créez-en un s’il n’existe pas).
    • Entrez un nom de ressource ACS. Ce doit être une valeur unique.
    • Sélectionnez un emplacement de données.
  5. Sélectionnez Vérifier + Créer , puis Créer.

  6. Vous avez créé une nouvelle ressource Azure Communication Services ! Ensuite, vous allez activer les fonctionnalités d’appel téléphonique et de SMS. Vous allez également connecter un domaine de messagerie à la ressource.

Activer les fonctionnalités d’appel téléphonique et sms

  1. Ajoutez un numéro de téléphone et assurez-vous que le numéro de téléphone dispose de fonctionnalités d’appel activées. Vous utiliserez ce numéro de téléphone pour appeler un téléphone à partir de l’application.

    • Sélectionnez Téléphonie et SMS -->Numéros de téléphone dans le menu Ressource.

    • Sélectionnez + Obtenir dans la barre d’outils (ou sélectionnez le bouton Obtenir un numéro ) et entrez les informations suivantes :

      • Pays ou région : United States
      • Type de nombre : Toll-free

      Remarque

      Une carte de crédit est requise sur votre abonnement Azure pour créer le numéro gratuit. Si vous n’avez pas de carte sur le fichier, n’hésitez pas à ignorer l’ajout d’un numéro de téléphone et à passer à la section suivante de l’exercice qui connecte un domaine de messagerie. Vous pouvez toujours utiliser l’application, mais ne pourrez pas appeler un numéro de téléphone.

      • Numéro : sélectionnez Ajouter au panier pour l’un des numéros de téléphone répertoriés.
  2. Sélectionnez Suivant, passez en revue les détails du numéro de téléphone, puis sélectionnez Acheter maintenant.

    Remarque

    La vérification par SMS pour les numéros gratuits est désormais obligatoire dans les États-Unis et le Canada. Pour activer la messagerie SMS, vous devez soumettre la vérification après l’achat du numéro de téléphone. Bien que ce tutoriel ne passe pas par ce processus, vous pouvez sélectionner Les documents> dans le menu ressources et ajouter la documentation de validation requise.

  3. Une fois le numéro de téléphone créé, sélectionnez-le pour accéder au panneau Fonctionnalités . Vérifiez que les valeurs suivantes sont définies (elles doivent être définies par défaut) :

    • Dans la section Appel , sélectionnez Make calls.
    • Dans la section SMS , sélectionnez Send and receive SMS.
    • Cliquez sur Enregistrer.
  4. Copiez la valeur du numéro de téléphone dans un fichier pour une utilisation ultérieure. Le numéro de téléphone doit suivre ce modèle général : +12345678900.

Connecter un domaine de messagerie

  1. Effectuez les tâches suivantes pour créer un domaine de messagerie connecté pour votre ressource ACS afin de pouvoir envoyer un e-mail. Cette opération sera utilisée pour envoyer des e-mails à partir de l’application.

    • Sélectionnez Email -->Domains dans le menu Ressource.
    • Sélectionnez Connecter un domaine dans la barre d’outils.
    • Sélectionnez votre abonnement et votre groupe de ressources.
    • Sous la liste déroulante Service de messagerie , sélectionnez Add an email service.
    • Donnez au service de messagerie un nom tel que acs-demo-email-service.
    • Sélectionnez Vérifier + créer suivi de Créer.
    • Une fois le déploiement terminé, sélectionnez Go to resource, puis sélectionnez 1-click add pour ajouter un sous-domaine Azure gratuit.
    • Une fois que le sous-domaine est ajouté (il faut quelques instants pour être déployé), sélectionnez-le.
    • Une fois que vous êtes sur l’écran AzureManagedDomain , sélectionnez Services de messagerie -->MailFrom adresses dans le menu Ressource.
    • Copiez la valeur MailFrom dans un fichier. Vous l’utiliserez ultérieurement lors de la mise à jour du fichier .env .
    • Revenez à votre ressource Azure Communication Services et sélectionnez Email -->Domains dans le menu de ressources.
    • Sélectionnez Add domain et entrez la MailFrom valeur de l’étape précédente (veillez à sélectionner l’abonnement, le groupe de ressources et le service de messagerie appropriés). Sélectionnez le bouton Connect.

Mettre à jour le .env fichier

  1. Maintenant que votre numéro de téléphone ACS (avec appel et SMS activé) et le domaine de messagerie sont prêts, mettez à jour les clés/valeurs suivantes dans le fichier .env dans votre projet :

    ACS_CONNECTION_STRING=<ACS_CONNECTION_STRING>
    ACS_PHONE_NUMBER=<ACS_PHONE_NUMBER>
    ACS_EMAIL_ADDRESS=<ACS_EMAIL_ADDRESS>
    CUSTOMER_EMAIL_ADDRESS=<EMAIL_ADDRESS_TO_SEND_EMAIL_TO>
    CUSTOMER_PHONE_NUMBER=<UNITED_STATES_BASED_NUMBER_TO_SEND_SMS_TO>
    
    • ACS_CONNECTION_STRING connection string: valeur de la section Clés de votre ressource ACS.

    • ACS_PHONE_NUMBER: Attribuez votre numéro gratuit à la ACS_PHONE_NUMBER valeur.

    • ACS_EMAIL_ADDRESS: Attribuez la valeur de l’adresse « MailTo » de votre e-mail.

    • CUSTOMER_EMAIL_ADDRESS: Attribuez une adresse e-mail à laquelle vous souhaitez envoyer un e-mail à partir de l’application (étant donné que les données client dans la base de données de l’application ne sont que des exemples de données). Vous pouvez utiliser une adresse e-mail personnelle.

    • CUSTOMER_PHONE_NUMBER: vous devez fournir un numéro de téléphone basé aux États-Unis (à partir d’aujourd’hui) en raison d’une vérification supplémentaire requise dans d’autres pays/régions pour l’envoi de sms. Si vous n’avez pas de numéro basé sur les États-Unis, vous pouvez le laisser vide.

Démarrer/redémarrer les serveurs d’applications et d’API

Effectuez l’une des étapes suivantes en fonction des exercices que vous avez effectués jusqu’à ce stade :

  • Si vous avez démarré la base de données, le serveur API et le serveur web dans un exercice précédent, vous devez arrêter le serveur d’API et le serveur web et les redémarrer pour récupérer les modifications apportées au fichier .env . Vous pouvez laisser la base de données en cours d’exécution.

    Recherchez les fenêtres de terminal exécutant le serveur d’API et le serveur web, puis appuyez sur Ctrl + C pour les arrêter. Recommencez-les en tapant npm start dans chaque fenêtre de terminal et en appuyant sur Entrée. Passez à l’exercice suivant.

  • Si vous n’avez pas encore démarré la base de données, le serveur d’API et le serveur web, procédez comme suit :

    1. Dans les étapes suivantes, vous allez créer trois fenêtres de terminal dans Visual Studio Code.

      Trois fenêtres de terminal dans Visual Studio Code

    2. Cliquez avec le bouton droit sur le fichier .env dans la liste des fichiers Visual Studio Code, puis sélectionnez Ouvrir dans le terminal intégré. Assurez-vous que votre terminal est à la racine du projet - openai-acs-msgraph - avant de continuer.

    3. Choisissez l’une des options suivantes pour démarrer la base de données PostgreSQL :

      • Si Docker Desktop est installé et en cours d’exécution, exécutez docker-compose up la fenêtre du terminal, puis appuyez sur Entrée.

      • Si Podman avec podman-compose est installé et en cours d’exécution, exécutez podman-compose up dans la fenêtre de terminal, puis appuyez sur Entrée.

      • Pour exécuter le conteneur PostgreSQL directement à l’aide de Docker Desktop, Podman, nerdctl ou un autre runtime de conteneur que vous avez installé, exécutez la commande suivante dans la fenêtre de terminal :

        • Mac, Linux ou Sous-système Windows pour Linux (WSL) :

          [docker | podman | nerdctl] run --name postgresDb -e POSTGRES_USER=web -e POSTGRES_PASSWORD=web-password -e POSTGRES_DB=CustomersDB -v $(pwd)/data:/var/lib/postgresql/data -p 5432:5432 postgres
          
        • Windows avec PowerShell :

          [docker | podman] run --name postgresDb -e POSTGRES_USER=web -e POSTGRES_PASSWORD=web-password -e POSTGRES_DB=CustomersDB -v ${PWD}/data:/var/lib/postgresql/data -p 5432:5432 postgres
          
    4. Une fois le conteneur de base de données démarré, appuyez sur l’icône + dans la barre d’outils du terminal Visual Studio Code pour créer une deuxième fenêtre de terminal.

      Icône + Visual Studio Code dans la barre d’outils du terminal.

    5. cd dans le dossier serveur/typescript et exécutez les commandes suivantes pour installer les dépendances et démarrer le serveur d’API.

      • npm install
      • npm start
    6. Appuyez de nouveau sur l’icône + dans la barre d’outils du terminal Visual Studio Code pour créer une troisième fenêtre de terminal.

    7. cd dans le dossier client et exécutez les commandes suivantes pour installer les dépendances et démarrer le serveur web.

      • npm install
      • npm start
    8. Un navigateur s’ouvre et vous serez redirigé vers http://localhost:4200.

      Capture d’écran de l’application avec Azure OpenAI activé

Étape suivante