Mulaicepat: Tambahkan panggilan suara ke aplikasi Anda

Mulai Azure Communication Services menggunakan SDK Panggilan Layanan Komunikasi untuk menambahkan panggilan suara dan video ke aplikasi Anda.

Penting

Tingkatkan ke Panggilan SDK Azure Communication Services 1.1.0 (atau yang lebih baru) untuk JavaScript sebelum 31 Juli 2021.

API Rencana Protokol Deskripsi Sesi B (SDP) tidak digunakan lagi. Perbarui SDK Panggilan Communication Services Anda ke v1.1.0 (atau yang lebih baru) paling lambat 31 Juli 2021 untuk mencegah penghentian ini berdampak pada pengguna Anda. Lihat catatan rilis pustaka panggilan untuk informasi selengkapnya.

Penting

Azure Communication Services tidak mendukung panggilan darurat

Layanan panggilan suara keluar Azure Communication Services tidak dapat digunakan untuk menghubungi layanan darurat. Anda harus mempertahankan layanan telepon tradisional untuk melakukan panggilan darurat.

Dalam mulai cepat ini, Anda akan mempelajari cara memulai panggilan menggunakan Azure Communication Services Calling SDK for Windows.

Kode Sampel

Anda dapat mengunduh aplikasi sampel dari GitHub.

Prasyarat

Untuk menyelesaikan tutorial ini, Anda memerlukan prasyarat berikut:

Persiapan

Membuat proyek

Di Visual Studio, buat proyek baru dengan templat Blank App (Universal Windows) untuk menyiapkan aplikasi Universal Windows Platform (UWP) satu halaman.

Cuplikan layar menampilkan jendela Proyek Baru di dalam Visual Studio.

Menginstal paket

Klik kanan proyek Anda dan buka Manage Nuget Packages untuk memasang Azure.Communication.Calling.

Meminta akses

Buka Package.appxmanifest dan klik Capabilities. Periksa Internet (Client & Server) untuk mendapatkan akses masuk dan keluar ke Internet. Periksa Microphone untuk mengakses umpan audio mikrofon.

Cuplikan layar menampilkan permintaan akses ke Internet dan Mikrofon di Visual Studio.

Siapkan kerangka kerja aplikasi

Kita perlu mengonfigurasi tata letak dasar untuk melampirkan logika. Untuk melakukan panggilan keluar, kita memerlukan TextBox untuk menyediakan ID pengguna penerima panggilan. Kita juga butuh tombol Start Call dan tombol Hang Up. Buka MainPage.xaml proyek Anda dan tambahkan node StackPanel ke Page:

<Page
    x:Class="CallingQuickstart.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:CallingQuickstart"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
    <StackPanel>
        <TextBox Text="Who would you like to call?" TextWrapping="Wrap" x:Name="CalleeTextBox" Margin="10,10,10,10"></TextBox>
        <Button Content="Start Call" Click="CallButton_ClickAsync" x:Name="CallButton" Margin="10,10,10,10"></Button>
        <Button Content="Hang Up" Click="HangupButton_Click" x:Name="HangupButton" Margin="10,10,10,10"></Button>
    </StackPanel>
</Page>

Buka MainPage.xaml.cs dan ganti konten dengan implementasi berikut:

using System;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;

using Azure.Communication;
using Azure.Communication.Calling;

namespace CallingQuickstart
{
    /// <summary>
    /// An empty page that can be used on its own or navigated to within a Frame.
    /// </summary>
    public sealed partial class MainPage : Page
    {
        public MainPage()
        {
            this.InitializeComponent();
            this.InitCallAgent();
        }
        
        private async void InitCallAgent()
        {
            // Create Call Client and initialize Call Agent
        }
        
        private async void CallButton_ClickAsync(object sender, RoutedEventArgs e)
        {
            // Start call
        }

        private async void HangupButton_Click(object sender, RoutedEventArgs e)
        {
            // End the current call
        }

        CallClient call_client_;
        CallAgent call_agent_;
        Call call_;
    }
}

Model objek

Kelas dan antarmuka berikut menangani beberapa fitur utama Azure Communication Services Calling SDK:

Nama Deskripsi
CallClient CallClient adalah titik masuk utama ke Calling SDK.
CallAgent CallAgent digunakan untuk memulai dan mengelola panggilan.
CommunicationTokenCredential CommunicationTokenCredential digunakan sebagai kredensial token untuk menginstansiasi CallAgent.
CommunicationUserIdentifier CommunicationUserIdentifier digunakan untuk mewakili identitas pengguna yang dapat berupa salah satu dari berikut ini: CommunicationUserIdentifier/PhoneNumberIdentifier/CallingApplication.

Autentikasi klien

Inisialisasi instans CallAgent dengan Token Akses Pengguna yang akan memungkinkan kita untuk melakukan dan menerima panggilan.

Pada kode berikut, ganti <USER_ACCESS_TOKEN> dengan Token Akses Pengguna. Lihat dokumentasi token akses pengguna jika Anda belum memiliki token yang tersedia.

Tambahkan kode berikut ke fungsi InitCallAgent.

CommunicationTokenCredential token_credential = new CommunicationTokenCredential("<USER_ACCESS_TOKEN>");
call_client_ = new CallClient();

CallAgentOptions callAgentOptions = new CallAgentOptions()
{
    DisplayName = "<YOUR_DISPLAY_NAME>"
};
call_agent_ = await call_client_.CreateCallAgent(token_credential, callAgentOptions);

Memulai panggilan

Tambahkan implementasi ke CallButton_ClickAsync untuk memulai panggilan dengan call_agent yang kita buat.

StartCallOptions startCallOptions = new StartCallOptions();
ICommunicationIdentifier[] callees = new ICommunicationIdentifier[1]
{
    new CommunicationUserIdentifier(CalleeTextBox.Text)
};
call_ = await call_agent_.StartCallAsync(callees, startCallOptions);

Mengakhiri panggilan

Akhiri panggilan saat ini ketika tombol Hang Up diklik.

await call_.HangUpAsync(new HangUpOptions());

Jalankan kode

Anda dapat membangun dan menjalankan kode di Visual Studio. Perlu diperhatikan bahwa untuk platform solusi kami mendukung ARM64, x64 dan x86.

Anda dapat melakukan panggilan keluar dengan memberikan ID pengguna di bidang teks dan mengklik tombol Start Call. Memanggil 8:echo123 menyambungkan Anda dengan bot echo, ini bagus untuk memulai dan memverifikasi apakah perangkat audio Anda berfungsi.

Cuplikan layar menampilkan menjalankan aplikasi mulai cepat

Dalam mulai cepat ini, Anda akan mempelajari cara memulai panggilan menggunakan Azure Communication Services Calling SDK for JavaScript

Kode sampel

Anda dapat mengunduh aplikasi sampel dari GitHub

Prasyarat

Persiapan

Buat aplikasi Node.js baru

Buka terminal atau jendela perintah buat direktori baru untuk aplikasi Anda, dan navigasikan ke sana.

mkdir calling-quickstart && cd calling-quickstart

Jalankan npm init -y untuk membuat file package.json dengan pengaturan default.

npm init -y

Menginstal paket

Gunakan perintah npm install untuk menginstal SDK Panggilan Azure Communication Services untuk JavaScript.

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

Versi webpack berikut disarankan untuk mulai cepat ini:

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

Opsi --save mencantumkan pustaka sebagai dependensi di file package.json Anda.

Siapkan kerangka kerja aplikasi

Mulai cepat ini menggunakan webpack untuk memaketkan aset aplikasi. Jalankan perintah berikut untuk menginstal paket npm webpack, webpack-cli, dan webpack-dev-server, dan mencantumkan sebagai dependensi pengembangan dalam package.json Anda:

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

Buat file index.html di direktori akar proyek Anda. Kami akan menggunakan file ini untuk mengonfigurasi tata letak dasar yang akan memungkinkan pengguna melakukan panggilan.

Berikut kodenya:

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

Buat file di direktori akar proyek Anda yang disebut client.js agar berisi logika aplikasi untuk mulai cepat ini. Tambahkan kode berikut untuk mengimpor klien panggilan dan dapatkan referensi ke elemen DOM sehingga kami dapat melampirkan logika bisnis kami.

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

let call;
let callAgent;
let tokenCredential = "";
const userToken = document.getElementById("token-input");
const calleeInput = document.getElementById("callee-id-input");
const submitToken = document.getElementById("token-submit");
const callButton = document.getElementById("call-button");
const hangUpButton = document.getElementById("hang-up-button");

Model objek

Kelas dan antarmuka berikut menangani beberapa fitur utama Azure Communication Services Calling SDK:

Nama Deskripsi
CallClient CallClient adalah titik masuk utama ke Calling SDK.
CallAgent CallAgent digunakan untuk memulai dan mengelola panggilan.
AzureCommunicationTokenCredential Kelas AzureCommunicationTokenCredential menerapkan antarmuka CommunicationTokenCredential yang digunakan untuk membuat instans CallAgent.

Autentikasi klien

Anda perlu memasukkan token akses pengguna yang valid untuk sumber daya Anda ke bidang teks dan klik 'Kirim'. Lihat dokumentasi token akses pengguna jika Anda belum memiliki token yang tersedia. Dengan menggunakan CallClient, buat inisialisasi instans CallAgent dengan CommunicationTokenCredential yang akan memungkinkan kita untuk melakukan dan menerima panggilan.

Tambahkan kode berikut ke client.js:

submitToken.addEventListener("click", async () => {
  const callClient = new CallClient(); 
  const userTokenCredential = userToken.value;
    try {
      tokenCredential = new AzureCommunicationTokenCredential(userTokenCredential);
      callAgent = await callClient.createCallAgent(tokenCredential);
      callButton.disabled = false;
      submitToken.disabled = true;
    } catch(error) {
      window.alert("Please submit a valid token!");
    }
})

Memulai panggilan

Tambahkan penanganan kejadian untuk memulai panggilan saat callButton diklik:

callButton.addEventListener("click", () => {
    // start a call
    const userToCall = calleeInput.value;
    // To call an ACS communication user, use {communicationUserId: 'ACS_USER_ID'}.
    // To call echobot, use {id: '8:echo123'}.
    call = callAgent.startCall(
        [{ communicationUserId: userToCall }],
        {}
    );
    // toggle button states
    hangUpButton.disabled = false;
    callButton.disabled = true;
});

Mengakhiri panggilan

Tambahkan pendengar acara untuk mengakhiri panggilan saat ini ketika mengklik hangUpButton:

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

  // toggle button states
  hangUpButton.disabled = true;
  callButton.disabled = false;
  submitToken.disabled = false;
});

Properti forEveryone mengakhiri panggilan untuk semua peserta panggilan.

Jalankan kode

Gunakan webpack-dev-server untuk membuat dan menjalankan aplikasi Anda. Jalankan perintah berikut untuk memaketkan host aplikasi di server web lokal:

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

Buka browser Anda dan navigasi ke http://localhost:8080/. Anda akan melihat berikut ini:

Cuplikan layar Aplikasi JavaScript yang telah selesai.

Anda dapat melakukan panggilan VOIP keluar dengan memberikan token akses pengguna dan ID pengguna yang sesuai di bidang teks terkait dan mengklik tombol Mulai Panggilan.

Menelepon 8:echo123 akan menghubungkan Anda dengan bot echo, ini bagus untuk memulai dan memverifikasi apakah perangkat audio Anda berfungsi. Teruskan {id: '8:echo123'} ke CallAgent.startCall() API untuk memanggil echobot. Untuk memanggil pengguna komunikasi ACS, teruskan {communicationUserId: 'ACS_USER_ID'} ke CallAgent.startCall() API.

Dalam mulai cepat ini, Anda akan mempelajari cara memulai panggilan menggunakan SDK Panggilan Azure Communication Services untuk Android.

Kode Sampel

Anda dapat mengunduh aplikasi sampel dari GitHub.

Prasyarat

Persiapan

Membuat aplikasi Android dengan aktivitas kosong

Dari Android Studio, pilih Mulai proyek Android Studio baru.

Cuplikan layar yang menunjukkan tombol 'Mulai Proyek Android Studio baru' yang dipilih di Android Studio.

Pilih templat proyek "Aktivitas Kosong" di bagian "Ponsel dan Tablet".

Cuplikan layar yang menunjukkan opsi 'Aktivitas Kosong' yang dipilih di Layar Templat Proyek.

Pilih SDK Minimum "API 26: Android 8.0 (Oreo)" atau yang lebih tinggi.

Cuplikan layar yang menunjukkan opsi 'Aktivitas Kosong' yang dipilih di Layar Templat Proyek 2.

Menginstal paket

Temukan build.gradle tingkat proyek Anda dan pastikan untuk menambahkan mavenCentral() ke daftar repositori di bawah buildscript dan allprojects

buildscript {
    repositories {
    ...
        mavenCentral()
    ...
    }
}
allprojects {
    repositories {
    ...
        mavenCentral()
    ...
    }
}

Kemudian, di build.gradle tingkat modul Anda, tambahkan baris berikut ke dependensi dan bagian android

android {
    ...
    packagingOptions {
        pickFirst  'META-INF/*'
    }
    compileOptions {
        sourceCompatibility JavaVersion.VERSION_1_8
        targetCompatibility JavaVersion.VERSION_1_8
    }
}

dependencies {
    ...
    implementation 'com.azure.android:azure-communication-calling:1.0.0-beta.8'
    ...
}

Menambahkan izin ke manifes aplikasi

Guna meminta izin yang diperlukan untuk melakukan panggilan, izin tersebut harus terlebih dahulu dinyatakan dalam Manifes Aplikasi (app/src/main/AndroidManifest.xml). Ganti isi file dengan kode berikut:

    <?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.contoso.acsquickstart">

    <uses-permission android:name="android.permission.INTERNET" />
    <uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
    <uses-permission android:name="android.permission.ACCESS_WIFI_STATE" />
    <uses-permission android:name="android.permission.RECORD_AUDIO" />
    <uses-permission android:name="android.permission.CAMERA" />
    <uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
    <uses-permission android:name="android.permission.READ_PHONE_STATE" />

    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        android:theme="@style/AppTheme">
        <!--Our Calling SDK depends on the Apache HTTP SDK.
When targeting Android SDK 28+, this library needs to be explicitly referenced.
See https://developer.android.com/about/versions/pie/android-9.0-changes-28#apache-p-->
        <uses-library android:name="org.apache.http.legacy" android:required="false"/>
        <activity android:name=".MainActivity">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
    </application>

</manifest>
    

Menyiapkan tata letak untuk aplikasi

Dua input diperlukan: input teks untuk ID penerima panggilan, dan tombol untuk melakukan panggilan. Kedua input ini dapat ditambahkan melalui perancang atau dengan mengedit xml tata letak. Buat tombol dengan ID call_button dan input teks callee_id. Buka (app/src/main/res/layout/activity_main.xml) dan ganti konten file dengan konten berikut:

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <Button
        android:id="@+id/call_button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="16dp"
        android:text="Call"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent" />

    <EditText
        android:id="@+id/callee_id"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:ems="10"
        android:hint="Callee Id"
        android:inputType="textPersonName"
        app:layout_constraintBottom_toTopOf="@+id/call_button"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>

Membuat perancah dan pengikatan aktivitas utama

Dengan tata letak yang sudah dibuat, pengikatan beserta perancah dasar aktivitas dapat ditambahkan. Aktivitas akan menangani permintaan izin runtime, membuat agen panggilan, dan melakukan panggilan saat tombol ditekan. Semua ini akan dibahas di bagiannya masing-masing. Metode onCreate akan diganti untuk menggunakan getAllPermissions dan createAgent serta menambahkan pengikatan untuk tombol panggilan. Ini hanya akan terjadi sekali saat aktivitas dibuat. Untuk mengetahui informasi selengkapnya tentang onCreate, lihat panduan Memahami Siklus Hidup Aktivitas.

Buka MainActivity.java dan ganti isi file dengan kode berikut:

package com.contoso.acsquickstart;

import androidx.appcompat.app.AppCompatActivity;
import androidx.core.app.ActivityCompat;
import android.media.AudioManager;
import android.Manifest;
import android.content.pm.PackageManager;

import android.os.Bundle;
import android.widget.Button;
import android.widget.EditText;
import android.widget.Toast;

import com.azure.android.communication.common.CommunicationUserIdentifier;
import com.azure.android.communication.common.CommunicationTokenCredential;
import com.azure.android.communication.calling.CallAgent;
import com.azure.android.communication.calling.CallClient;
import com.azure.android.communication.calling.StartCallOptions;


import java.util.ArrayList;

public class MainActivity extends AppCompatActivity {
    
    private CallAgent callAgent;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        getAllPermissions();
        createAgent();
        
        // Bind call button to call `startCall`
        Button callButton = findViewById(R.id.call_button);
        callButton.setOnClickListener(l -> startCall());
        
        setVolumeControlStream(AudioManager.STREAM_VOICE_CALL);
    }

    /**
     * Request each required permission if the app doesn't already have it.
     */
    private void getAllPermissions() {
        // See section on requesting permissions
    }

    /**
      * Create the call agent for placing calls
      */
    private void createAgent() {
        // See section on creating the call agent
    }

    /**
     * Place a call to the callee id provided in `callee_id` text input.
     */
    private void startCall() {
        // See section on starting the call
    }
}

Meminta izin saat runtime

Untuk Android 6.0 dan yang lebih tinggi (API level 23) dan targetSdkVersion 23 atau yang lebih tinggi, izin diberikan saat runtime, bukan saat aplikasi diinstal. Untuk mendukungnya, getAllPermissions dapat diterapkan untuk memanggil ActivityCompat.checkSelfPermission dan ActivityCompat.requestPermissions bagi setiap izin yang diperlukan.

/**
 * Request each required permission if the app doesn't already have it.
 */
private void getAllPermissions() {
    String[] requiredPermissions = new String[]{Manifest.permission.RECORD_AUDIO, Manifest.permission.CAMERA, Manifest.permission.WRITE_EXTERNAL_STORAGE, Manifest.permission.READ_PHONE_STATE};
    ArrayList<String> permissionsToAskFor = new ArrayList<>();
    for (String permission : requiredPermissions) {
        if (ActivityCompat.checkSelfPermission(this, permission) != PackageManager.PERMISSION_GRANTED) {
            permissionsToAskFor.add(permission);
        }
    }
    if (!permissionsToAskFor.isEmpty()) {
        ActivityCompat.requestPermissions(this, permissionsToAskFor.toArray(new String[0]), 1);
    }
}

Catatan

Saat mendesain aplikasi Anda, pertimbangkan kapan izin ini harus diminta. Izin harus diminta saat dibutuhkan, bukan sebelumnya. Untuk mengetahui informasi selengkapnya, lihat Panduan Izin Android.

Model objek

Kelas dan antarmuka berikut menangani beberapa fitur utama Azure Communication Services Calling SDK:

Nama Deskripsi
CallClient CallClient adalah titik masuk utama ke Calling SDK.
CallAgent CallAgent digunakan untuk memulai dan mengelola panggilan.
CommunicationTokenCredential CommunicationTokenCredential digunakan sebagai info masuk token untuk memberi instans CallAgent.
CommunicationIdentifier CommunicationIdentifier digunakan sebagai jenis peserta yang berbeda yang bisa menjadi bagian dari panggilan.

Membuat agen dari token akses pengguna

Dengan token pengguna, agen panggilan terautentikasi dapat dibuat. Umumnya, token ini akan dibuat dari layanan dengan autentikasi khusus untuk aplikasi. Untuk mengetahui informasi selengkapnya tentang token akses pengguna, periksa panduan Token Akses Pengguna.

Untuk mulai cepat, ganti <User_Access_Token> dengan token akses pengguna yang dihasilkan untuk sumber daya Azure Communication Service Anda.


/**
 * Create the call agent for placing calls
 */
private void createAgent() {
    String userToken = "<User_Access_Token>";

    try {
        CommunicationTokenCredential credential = new CommunicationTokenCredential(userToken);
        callAgent = new CallClient().createCallAgent(getApplicationContext(), credential).get();
    } catch (Exception ex) {
        Toast.makeText(getApplicationContext(), "Failed to create call agent.", Toast.LENGTH_SHORT).show();
    }
}

Memulai panggilan menggunakan agen panggilan

Panggilan dapat dilakukan melalui agen panggilan dan Anda hanya perlu memberikan daftar ID penerima panggilan dan opsi panggilan. Untuk mulai cepat, opsi panggilan default tanpa video dan satu ID penerima panggilan dari input teks akan digunakan.

/**
 * Place a call to the callee id provided in `callee_id` text input.
 */
private void startCall() {
    EditText calleeIdView = findViewById(R.id.callee_id);
    String calleeId = calleeIdView.getText().toString();
    
    StartCallOptions options = new StartCallOptions();

    callAgent.startCall(
        getApplicationContext(),
        new CommunicationUserIdentifier[] {new CommunicationUserIdentifier(calleeId)},
        options);
}

Meluncurkan aplikasi dan memanggil bot echo

Aplikasi kini dapat diluncurkan menggunakan tombol "Jalankan Aplikasi" pada toolbar (Shift+F10). Pastikan Anda dapat melakukan panggilan dengan memanggil 8:echo123. Pesan yang direkam sebelumnya akan diputar lalu mengulangi pesan kembali kepada Anda.

Cuplikan layar yang menunjukkan aplikasi yang sudah selesai.

Dalam mulai cepat ini, Anda akan mempelajari cara memulai panggilan menggunakan SDK Panggilan Azure Communication Services untuk iOS.

Kode Sampel

Anda dapat mengunduh aplikasi sampel dari GitHub.

Prasyarat

Untuk menyelesaikan tutorial ini, Anda memerlukan prasyarat berikut:

Persiapan

Membuat proyek Xcode

Di Xcode, buat proyek iOS baru dan pilih templat Aplikasi Tampilan Tunggal. Tutorial ini menggunakan kerangka kerja SwiftUI, jadi Anda harus mengatur Bahasa ke Swift dan Antarmuka Pengguna ke SwiftUI. Anda tidak akan membuat pengujian selama mulai cepat ini. Jangan ragu untuk menghapus centang Sertakan Pengujian.

Cuplikan layar yang menunjukkan jendela Proyek Baru dalam Xcode.

Memasang paket dan dependensi dengan CocoaPods

  1. Guna membuat Podfile untuk aplikasi Anda, buka terminal dan buka folder proyek, lalu jalankan:

    pod init

  2. Ganti podfile Anda dengan kode berikut ke Podfile dan simpan (pastikan "target" cocok dengan nama proyek Anda):

    platform :ios, '13.0'
    use_frameworks!
    
    target 'AzureCommunicationCallingSample' do
      pod 'AzureCommunicationCalling', '~> 1.0.0'
    end
    
  3. Jalankan pod install.

  4. Buka .xcworkspace dengan Xcode.

Meminta akses ke mikrofon

Untuk mengakses mikrofon perangkat, Anda perlu memperbarui Daftar Properti Informasi aplikasi Anda dengan NSMicrophoneUsageDescription. Anda mengatur nilai yang terkait ke string yang akan disertakan dalam dialog yang digunakan sistem untuk meminta akses dari pengguna.

Klik kanan entri Info.plist pohon proyek dan pilih Buka Sebagai > Kode Sumber. Tambahkan baris berikut ke bagian <dict> tingkat atas, lalu simpan file.

<key>NSMicrophoneUsageDescription</key>
<string>Need microphone access for VOIP calling.</string>

Siapkan kerangka kerja aplikasi

Buka file ContentView.swift proyek Anda dan tambahkan deklarasi import ke bagian atas file untuk mengimpor AzureCommunicationCalling library. Selain itu, impor AVFoundation, kita akan membutuhkannya untuk permintaan izin audio dalam kode.

import AzureCommunicationCalling
import AVFoundation

Ganti implementasi struct ContentView dengan beberapa kontrol antarmuka pengguna sederhana yang memungkinkan pengguna memulai dan mengakhiri panggilan. Kami akan melampirkan logika bisnis ke kontrol ini dalam mulai cepat ini.

struct ContentView: View {
    @State var callee: String = ""
    @State var callClient: CallClient?
    @State var callAgent: CallAgent?
    @State var call: Call?

    var body: some View {
        NavigationView {
            Form {
                Section {
                    TextField("Who would you like to call?", text: $callee)
                    Button(action: startCall) {
                        Text("Start Call")
                    }.disabled(callAgent == nil)
                    Button(action: endCall) {
                        Text("End Call")
                    }.disabled(call == nil)
                }
            }
            .navigationBarTitle("Calling Quickstart")
        }.onAppear {
            // Initialize call agent
        }
    }

    func startCall() {
        // Ask permissions
        AVAudioSession.sharedInstance().requestRecordPermission { (granted) in
            if granted {
                // Add start call logic
            }
        }
    }

    func endCall() {
        // Add end call logic
    }
}

Model objek

Kelas dan antarmuka berikut menangani beberapa fitur utama Azure Communication Services Calling SDK:

Nama Deskripsi
CallClient CallClient adalah titik masuk utama ke Calling SDK.
CallAgent CallAgent digunakan untuk memulai dan mengelola panggilan.
CommunicationTokenCredential CommunicationTokenCredential digunakan sebagai kredensial token untuk menginstansiasi CallAgent.
CommunicationUserIdentifier CommunicationUserIdentifier digunakan untuk mewakili identitas pengguna yang dapat berupa salah satu dari berikut ini: CommunicationUserIdentifier/PhoneNumberIdentifier/CallingApplication.

Autentikasi klien

Inisialisasi instans CallAgent dengan Token Akses Pengguna yang akan memungkinkan kita untuk melakukan dan menerima panggilan.

Dalam kode berikut, Anda perlu mengganti <USER ACCESS TOKEN> dengan token akses pengguna yang valid untuk sumber daya Anda. Lihat dokumentasi token akses pengguna jika Anda belum memiliki token yang tersedia.

Tambahkan kode berikut ke panggilan balik onAppear di ContentView.swift:

var userCredential: CommunicationTokenCredential?
do {
    userCredential = try CommunicationTokenCredential(token: "<USER ACCESS TOKEN>")
} catch {
    print("ERROR: It was not possible to create user credential.")
    return
}

self.callClient = CallClient()

// Creates the call agent
self.callClient?.createCallAgent(userCredential: userCredential!) { (agent, error) in
    if error != nil {
        print("ERROR: It was not possible to create a call agent.")
        return
    }
    else {
        self.callAgent = agent
        print("Call agent successfully created.")
    }
}

Memulai panggilan

Metode startCall ini ditetapkan sebagai tindakan yang akan dilakukan ketika tombol Mulai Panggilan diketuk. Perbarui implementasi untuk memulai panggilan dengan ASACallAgent:

func startCall()
{
    // Ask permissions
    AVAudioSession.sharedInstance().requestRecordPermission { (granted) in
        if granted {
            // start call logic
            let callees:[CommunicationIdentifier] = [CommunicationUserIdentifier(self.callee)]
            self.callAgent?.startCall(participants: callees, options: StartCallOptions()) { (call, error) in
                if (error == nil) {
                    self.call = call
                } else {
                    print("Failed to get call object")
                }
            }
        }
    }
}

Anda juga dapat menggunakan properti StartCallOptions untuk mengatur opsi awal untuk panggilan (yaitu memungkinkan memulai panggilan dengan mikrofon yang dibisukan).

Mengakhiri panggilan

Terapkan metode endCall untuk mengakhiri panggilan saat ini saat tombol Akhiri Panggilan diketuk.

func endCall()
{    
    self.call!.hangUp(options: HangUpOptions()) { (error) in
        if (error != nil) {
            print("ERROR: It was not possible to hangup the call.")
        }
    }
}

Jalankan kode

Anda dapat membangun dan menjalankan aplikasi di simulator iOS dengan memilih Produk > Jalankan atau dengan menggunakan pintasan papan ketik (⌘-R).

Tampilan akhir dan nuansa aplikasi mulai cepat

Anda dapat melakukan panggilan VOIP keluar dengan memberikan ID pengguna di bidang teks dan mengetuk tombol Mulai Panggilan. Memanggil 8:echo123 akan menyambungkan Anda dengan bot echo. Hal ini bagus memulai dan memverifikasi apakah perangkat audio Anda berfungsi.

Catatan

Saat Anda melakukan panggilan untuk pertama kalinya, sistem akan meminta akses ke mikrofon kepada Anda. Dalam aplikasi produksi, Anda harus menggunakan API AVAudioSession untuk memeriksa status izin dan memperbarui perilaku aplikasi dengan baik saat izin tidak diberikan.

Membersihkan sumber daya

Jika Anda ingin membersihkan dan menghapus langganan Communication Services, Anda dapat menghapus sumber daya atau grup sumber daya. Menghapus grup sumber daya juga menghapus sumber daya apa pun yang terkait dengannya. Pelajari lebih lanjut cara membersihkan sumber daya.

Langkah berikutnya

Untuk informasi selengkapnya, lihat artikel berikut ini: