本記事はオリジナルのヘルプ記事を翻訳したものになります。

Flexにて着信コールを受けた際、ブラウザで着信音を鳴らす最も良い方法は、reservationCreated eventを検知(Listen)し、オーディオを再生させる方法です。プラグインコードは以下のようになります。

let alertSound = new Audio("https://mysite.com/sounds/alert.mp3");
alertSound.loop = true;

const resStatus = ["accepted","canceled","rejected","rescinded","timeout"];

manager.workerClient.on("reservationCreated", function(reservation) {
  if (
     reservation.task.taskChannelUniqueName === "voice" &&
     reservation.task.attributes.direction === "inbound"
  ) {
    alertSound.play();
  }
  resStatus.forEach((e) => {
    reservation.on(e, () => {
      alertSound.pause()
    });
  });
});

上記コードは、着信コールがFlex上でWokerに受電許可され応答されるまで、オーディオファイル※をリピートで再生します。(※: 本例ではalert.mp3)

このコードを実行するには、まず1行目用のオーディオファイルを用意し、またファイルのURLを書き換え後、コードをinit()関数に追加して下さい。ホストされたFlex Instanceへのコード追加については、こちらをご覧ください: Creating Plugins for Twilio Flex.

注意: オーディオファイルはTwilioのプロキシサーバからアクセス可能な必要があります。デスクトップ上のローカルファイルではこれらのメソッドは挙動しません。Twilio Assetsへオーディオファイルをアップロードしご利用頂くことも可能です。

ブラウザがどのオーディオデバイスを使っているか調べる方法

MediaDevices インターフェースのenumerateDevices()を利用することで、利用可能なオーディオ出力デバイス一覧をリクエストする事が可能です。

navigator.mediaDevices.enumerateDevices();

希望のデバイスIDを特定したら、HTMLMediaElement.setSinkId()により値を渡してください。

注意: これらのメソッドはChrome 49+ および Edge17+に対応しています。現時点では、その他のブラウザでの動作を保証するものではありません。