Snabbstart: Anropa för att Telefon

Kom igång med Azure Communication Services med hjälp av Communication Services Calling SDK för att lägga till PSTN-anrop till din app.

Viktigt

Azure Communication Services stöder inte nödsamtal

Azure Communication Services utgående röstsamtalstjänster kan inte användas för att kontakta utryckningstjänsterna. Du bör underhålla traditionell telefontjänst för att ringa nödsamtal.

Exempelkod

Hitta den färdiga koden för den här snabbstarten på GitHub

Förutsättningar

Inrätta

Skapa ett nytt Node.js-program

Öppna terminalen eller kommandofönstret och skapa en ny katalog för appen och navigera till den.

mkdir calling-quickstart && cd calling-quickstart

Kör npm init -y för attpackage.jsen fil med standardinställningar.

npm init -y

Installera paketet

Använd kommandot npm install för att installera Azure Communication Services Anropa SDK för JavaScript.

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

Följande versioner av webpack rekommenderas för den här snabbstarten:

"webpack": "^4.42.0",
"webpack-cli": "^3.3.11",
"webpack-dev-server": "^3.10.3"

Alternativet --save visar biblioteket som ett beroende i dittpackage.js filen.

Konfigurera appramverket

Den här snabbstarten använder webpack för att paketera programtillgångarna. Kör följande kommando för att installera npm-paketen webpack, webpack-cli och webpack-dev-server och visa dem som utvecklingsberoenden i dinpackage.jspå:

npm install webpack@4.42.0 webpack-cli@3.3.11 webpack-dev-server@3.10.3 --save-dev

Skapa en index.html-fil i rotkatalogen för projektet. Vi använder den här filen för att konfigurera en grundläggande layout som gör att användaren kan ringa ett anrop.

Här är koden:

<!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="./bundle.js"></script>
  </body>
</html>

Skapa en fil i rotkatalogen för projektet med namnet client.js ska innehålla programlogiken för den här snabbstarten. Lägg till följande kod för att importera den anropande klienten och hämta referenser till DOM-elementen så att vi kan koppla vår affärslogik.

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 PSTN scope>');
    callAgent = await callClient.createCallAgent(tokenCredential);
  //  callPhoneButton.disabled = false;
}

init();

Starta ett samtal till telefonen

Ange det telefonnummer som du har köpt Communication Services resurs som ska användas för att starta samtalet:

Varning

Observera att telefonnummer ska anges i internationellt standardformat E.164. (t.ex. +12223334444)

Lägg till en händelsehanterare för att initiera ett samtal till det telefonnummer som du angav när callPhoneButton du klickade på :

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;
});

Avsluta ett samtal till telefonen

Lägg till en händelselyssnare för att avsluta det aktuella hangUpPhoneButton anropet när du klickar på :

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

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

Egenskapen forEveryone avslutar anropet för alla samtalsdeltagare.

Kör koden

Använd för webpack-dev-server att skapa och köra din app. Kör följande kommando för att paketa programvärden på en lokal webbserver:

npx webpack-dev-server --entry ./client.js --output bundle.js --debug --devtool inline-source-map

Öppna webbläsaren och gå till http://localhost:8080/ . Du bör se följande:

Skärmbild av det färdiga JavaScript-programmet.

Du kan ringa ett riktigt telefonnummer genom att ange ett telefonnummer i det tillagda textfältet och klicka på knappen Starta telefonsamtal.

Varning

Observera att telefonnummer ska anges i internationellt standardformat E.164. (t.ex. +12223334444)

Viktigt

Azure Communication Services stöder inte nödsamtal

Azure Communication Services utgående röstsamtalstjänster kan inte användas för att kontakta utryckningstjänsterna. Du bör underhålla traditionell telefontjänst för att ringa nödsamtal.

Exempelkod

Hitta den färdiga koden för den här snabbstarten på GitHub

Förutsättningar

Kravkontroll

  • Om du vill visa de telefonnummer som är associerade med din Communication Services-resurs loggar du in på Azure Portal,letar upp din Communication Services-resurs och öppnar fliken telefonnummer i det vänstra navigeringsfönstret.

Inrätta

Lägga till PSTN-funktioner i din app

Lägg till PhoneNumber typen i din app genom att ändra MainActivity.java:

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

Starta ett samtal till telefonen

Ange det telefonnummer som du har köpt inifrån din Communication Services resurs. Detta används för att starta anropet:

Varning

Observera att telefonnummer ska anges i internationellt standardformat E.164. (t.ex. +12223334444)

Ändra startCall() händelsehanteraren i MainActivity.java så att den hanterar telefonsamtal:

    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);
    }

Starta appen och anropa ekoroboten

Appen kan nu startas med knappen "Kör app" i verktygsfältet (Skift + F10). Du kan ringa ett samtal till telefonen genom att ange ett telefonnummer i det tillagda textfältet och klicka på knappen RING UPP.

Varning

Observera att telefonnummer ska anges i internationellt standardformat E.164. (t.ex. +12223334444)

Skärmbild som visar det färdiga programmet.

Viktigt

Azure Communication Services stöder inte nödsamtal

Azure Communication Services utgående röstsamtalstjänster kan inte användas för att kontakta utryckningstjänsterna. Du bör underhålla traditionell telefontjänst för att ringa nödsamtal.

Förutsättningar

Kravkontroll

  • Om du vill visa de telefonnummer som är associerade med din Communication Services-resurs loggar du in på Azure Portal,letar upp din Communication Services-resurs och öppnar fliken telefonnummer i det vänstra navigeringsfönstret.
  • Du kan skapa och köra din app med hjälp Azure Communication Services Anropa SDK för iOS:

Inrätta

Starta ett samtal till telefonen

Ange det telefonnummer som du Communication Services i den resurs som ska användas för att starta samtalet:

Varning

Observera att telefonnummer ska anges i internationellt standardformat E.164. (t.ex. + 12223334444)

Ändra startCall händelsehanteraren som ska utföras när knappen Starta anrop trycks på:

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")
                    }
                }
            }
        }
    }

Kör koden

Du kan skapa och köra appen i iOS-simulatorn genom att välja Produktkörning eller med > kortkommandot (⌘-R).

Slutligt utseende och känsla för snabbstartsappen

Du kan ringa ett samtal till telefonen genom att ange ett telefonnummer i det tillagda textfältet och klicka på knappen Starta samtal.

Varning

Observera att telefonnummer ska anges i internationellt standardformat E.164. (t.ex. + 12223334444)

Anteckning

Första gången du gör ett anrop uppmanas du av systemet att få åtkomst till mikrofonen. I ett produktionsprogram bör du använda API:et för att kontrollera behörighetsstatusen och uppdatera programmets beteende på ett smidigt sätt AVAudioSession när behörigheten inte har beviljats.

Rensa resurser

Om du vill rensa och ta bort en Communication Services prenumeration kan du ta bort resursen eller resursgruppen. Om du tar bort resursgruppen tas även alla andra resurser som är associerade med den bort. Läs mer om att rensa resurser.

Nästa steg

Mer information finns i följande artiklar: