Démarrage rapide : Appel sortant vers un numéro de téléphone

  • Article

Commencez à utiliser Azure Communication Services en utilisant le SDK Communication Services Calling pour ajouter des appels RTC à votre application.

Important

Azure Communication Services prend en charge les appels d’urgence vers les numéros d’urgence aux États-Unis, à Porto Rico, au Canada, au Danemark, au Royaume-Uni et en Australie uniquement.

Les appels vocaux d’Azure Communication Services (RTC) peuvent être utilisés pour composer le numéro d’urgence 911 aux États-Unis, à Porto Rico et au Canada, de composer le numéro d’urgence 112 au Danemark, de composer le 000 en Australie et de composer les numéros d’urgence 999 et 112 au Royaume-Uni. Azure Communication Services ne prend pas actuellement en charge la numérotation de ces numéros d’urgence en dehors de ces pays ou régions, ni la numérotation des services d’urgence dans d’autres pays ou régions.

Exemple de code

Vous trouverez le code finalisé pour ce guide de démarrage rapide sur GitHub.

Notes

Les appels sortants vers un numéro de téléphone sont accessibles à partir de la bibliothèque d’interface utilisateur d’Azure Communication Services. La bibliothèque d’interface utilisateur permet aux développeurs d’ajouter un client d’appel activé pour l’appel vocal (RTC) dans leur application avec seulement quelques lignes de code.

Prérequis

Configuration

Création d’une application Node.js

Ouvrez votre fenêtre de terminal ou de commande, créez un répertoire pour votre application, puis accédez-y.

mkdir calling-quickstart
cd calling-quickstart

Exécutez npm init -y pour créer un fichier package.json avec les paramètres par défaut.

npm init -y

Installer le package

Utilisez la commande npm install pour installer le kit de développement logiciel (SDK) Azure Communication Services Calling pour JavaScript.

npm install @azure/communication-common --save
npm install @azure/communication-calling --save

L’option --save liste la bibliothèque comme dépendance dans votre fichier package.json.

Configurer le framework d’application

Ce guide de démarrage rapide utilise un paquet pour regrouper les ressources de l’application. Exécutez la commande suivante pour l’installer et la répertorier en tant que dépendance de développement dans votre Package. JSON :

npm install parcel --save-dev

Créez un fichier index.html dans le répertoire racine de votre projet. Nous utiliserons ce fichier pour configurer une disposition de base qui permettra à l’utilisateur d’effectuer un appel.

Voici le code :

<!DOCTYPE html>
<html>
  <head>
    <title>Communication Client - Calling Sample</title>
  </head>
  <body>
    <h4>Azure Communication Services</h4>
    <h1>Calling Quickstart</h1>
    <input 
      id="callee-phone-input"
      type="text"
      placeholder="Who would you like to call?"
      style="margin-bottom:1em; width: 230px;"
    />
    <div>
      <button id="call-phone-button" type="button">
        Start Call
      </button>
      &nbsp;
      <button id="hang-up-phone-button" type="button" disabled="true">
        Hang Up
      </button>
    </div>
    <script src="./app.js" type="module"></script>
  </body>
</html>

Créez un fichier dans le répertoire racine de votre projet sous le nom app.js qui contiendra la logique d’application pour ce guide de démarrage rapide. Ajoutez le code suivant pour importer le client appelant et obtenir des références aux éléments DOM afin que nous puissions attacher notre logique métier.

import { CallClient, CallAgent } from "@azure/communication-calling";
import { AzureCommunicationTokenCredential } from '@azure/communication-common';

let call;
let callAgent;

const calleePhoneInput = document.getElementById("callee-phone-input");
const callPhoneButton = document.getElementById("call-phone-button");
const hangUpPhoneButton = document.getElementById("hang-up-phone-button");

async function init() {
    const callClient = new CallClient();
    const tokenCredential = new AzureCommunicationTokenCredential('<USER ACCESS TOKEN with VoIP scope>');
    callAgent = await callClient.createCallAgent(tokenCredential);
    //callPhoneButton.disabled = false;
}

init();

Démarrer un appel téléphonique

Spécifiez le numéro de téléphone que vous avez acquis dans la ressource Communication Services et qui est utilisé pour démarrer l’appel :

Avertissement

Les numéros de téléphone doivent être fournis au format standard international E.164. (par exemple +12223334444)

Ajoutez un gestionnaire d’événements pour lancer un appel au numéro de téléphone que vous avez fourni quand l’utilisateur clique sur callPhoneButton :

callPhoneButton.addEventListener("click", () => {
  // start a call to phone
  const phoneToCall = calleePhoneInput.value;
  call = callAgent.startCall(
    [{phoneNumber: phoneToCall}], { alternateCallerId: {phoneNumber: 'YOUR AZURE REGISTERED PHONE NUMBER HERE: +12223334444'}
  });
  // toggle button states
  hangUpPhoneButton.disabled = false;
  callPhoneButton.disabled = true;
});

Mettre fin à un appel téléphonique

Ajoutez un détecteur d’événements pour terminer l’appel en cours en cas de clic sur hangUpPhoneButton :

hangUpPhoneButton.addEventListener("click", () => {
  // end the current call
  call.hangUp({
    forEveryone: true
  });

  // toggle button states
  hangUpPhoneButton.disabled = true;
  callPhoneButton.disabled = false;
});

La propriété forEveryone met fin à l’appel pour tous les participants.

Exécuter le code

Utilisez la commande npx parcel index.html pour créer et exécuter votre application.

Ouvrez votre navigateur et accédez à http://localhost:1234/. Vous devez normalement voir l’application Web suivante :

Capture d’écran de l’application JavaScript terminée.

Vous pouvez passer un appel à un numéro de téléphone réel en fournissant un numéro de téléphone dans le champ texte ajouté et en cliquant sur le bouton Démarrer l’appel téléphonique.

Important

Azure Communication Services prend en charge les appels d’urgence vers les numéros d’urgence aux États-Unis, à Porto Rico, au Canada, au Danemark, au Royaume-Uni et en Australie uniquement.

Les appels vocaux d’Azure Communication Services (RTC) peuvent être utilisés pour composer le numéro d’urgence 911 aux États-Unis, à Porto Rico et au Canada, de composer le numéro d’urgence 112 au Danemark, de composer le 000 en Australie et de composer les numéros d’urgence 999 et 112 au Royaume-Uni. Azure Communication Services ne prend pas actuellement en charge la numérotation de ces numéros d’urgence en dehors de ces pays ou régions, ni la numérotation des services d’urgence dans d’autres pays ou régions.

Exemple de code

Vous trouverez le code finalisé pour ce guide de démarrage rapide sur GitHub.

Prérequis

Vérification du prérequis

  • Pour voir les numéros de téléphone associés à votre ressource Communication Services, connectez-vous au portail Azure, localisez votre ressource Communication Services, puis ouvrez l’onglet Phone Numbers (Numéros de téléphone) dans le volet de navigation gauche.

Configuration

Ajouter la fonctionnalité RTCP à votre application

Ajoutez le type PhoneNumber à votre application en modifiant MainActivity.Java :

import com.azure.android.communication.common.PhoneNumberIdentifier;

Démarrer un appel téléphonique

Spécifiez le numéro de téléphone que vous avez acquis depuis votre ressource Communication Services. Ce numéro est utilisé comme ID d’appelant pour démarrer l’appel :

Avertissement

Notez que les numéros de téléphone doivent être fournis au format standard international E.164. (par exemple +12223334444)

Modifiez le gestionnaire d’événements startCall()dans MainActivity.Java, afin qu’il gère les appels téléphoniques :

    private void startCall() {
        EditText calleePhoneView = findViewById(R.id.callee_id);
        String calleePhone = calleePhoneView.getText().toString();
        PhoneNumberIdentifier callerPhone = new PhoneNumberIdentifier("+12223334444");
        StartCallOptions options = new StartCallOptions();
        options.setAlternateCallerId(callerPhone);
        options.setVideoOptions(new VideoOptions(null));
        call = agent.startCall(
                getApplicationContext(),
                new PhoneNumberIdentifier[] {new PhoneNumberIdentifier(calleePhone)},
                options);
    }

Lancer l’application et appeler le bot d’écho

L’application peut maintenant être lancée à l’aide du bouton « Run App » de la barre d’outils (Maj+F10). Pour passer un appel, entrez un numéro de téléphone dans le champ de texte ajouté, puis sélectionnez le bouton APPEL.

Avertissement

Notez que les numéros de téléphone doivent être fournis au format standard international E.164. (par exemple +12223334444)

Capture d’écran montrant l’application terminée.

Important

Azure Communication Services prend en charge les appels d’urgence vers les numéros d’urgence aux États-Unis, à Porto Rico, au Canada, au Danemark, au Royaume-Uni et en Australie uniquement.

Les appels vocaux d’Azure Communication Services (RTC) peuvent être utilisés pour composer le numéro d’urgence 911 aux États-Unis, à Porto Rico et au Canada, de composer le numéro d’urgence 112 au Danemark, de composer le 000 en Australie et de composer les numéros d’urgence 999 et 112 au Royaume-Uni. Azure Communication Services ne prend pas actuellement en charge la numérotation de ces numéros d’urgence en dehors de ces pays ou régions, ni la numérotation des services d’urgence dans d’autres pays ou régions.

Prérequis

Vérification du prérequis

  • Pour voir les numéros de téléphone associés à votre ressource Communication Services, connectez-vous au portail Azure, localisez votre ressource Communication Services, puis ouvrez l’onglet Phone Numbers (Numéros de téléphone) dans le volet de navigation gauche.
  • Vous pouvez créer et exécuter votre application avec le kit de développement logiciel (SDK) Azure Communication Services Calling pour iOS :

Configuration

Démarrer un appel téléphonique

Spécifiez le numéro de téléphone que vous avez acquis dans la ressource Communication Services et qui est utilisé pour démarrer l’appel :

Avertissement

Notez que les numéros de téléphone doivent être fournis au format standard international E.164. (par exemple +12223334444)

Modifiez le gestionnaire d’événements startCall qui est exécuté quand l’utilisateur clique sur le bouton Démarrer l’appel :

func startCall() {
        // Ask permissions
        AVAudioSession.sharedInstance().requestRecordPermission { (granted) in
            if granted {
                let startCallOptions = StartCallOptions()
                startCallOptions.alternateCallerId = PhoneNumberIdentifier(phoneNumber: "<YOUR AZURE REGISTERED PHONE NUMBER>")
                self.callAgent!.startCall(participants: [PhoneNumberIdentifier(phoneNumber: self.callee)], options: startCallOptions) { (call, error) in
                    if (error == nil) {
                        self.call = call
                    } else {
                        print("Failed to get call object")
                    }
                }
            }
        }
    }

Exécuter le code

Vous pouvez générer et exécuter votre application sur un simulateur iOS en sélectionnant Product>Run ou en utilisant le raccourci clavier (⌘-R).

Apparence finale de l’application du guide de démarrage rapide

Vous pouvez passer un appel téléphonique en fournissant un numéro de téléphone dans le champ texte ajouté et en cliquant sur le bouton Démarrer l’appel.

Avertissement

Notez que les numéros de téléphone doivent être fournis au format standard international E.164. (par exemple +12223334444)

Notes

La première fois que vous effectuez un appel, le système vous invite à accorder l’accès au microphone. Dans une application de production, vous devez utiliser l’API AVAudioSessionvérifier l’état de l’autorisation et mettre à jour le comportement de votre application de manière appropriée lorsque l’autorisation n’est pas accordée.

Nettoyer les ressources

Si vous voulez nettoyer et supprimer un abonnement Communication Services, vous pouvez supprimer la ressource ou le groupe de ressources. La suppression du groupe de ressources efface également les autres ressources qui y sont associées. Apprenez-en davantage sur le nettoyage des ressources.

Étapes suivantes

Pour plus d’informations, consultez les articles suivants :