ルーティングプロファイルに紐づいたキューで発信通知番号を切り替える
📅 2020-04-15
コールセンターにおいて、発信通知番号を切り替えて発信を行うことは一般的です。業務や発信先のお客さんごとに分けると思います。さらには、エージェントごとに選択できる番号の組み合わせは柔軟に変えられるべきです。
Amazon Connect標準のCCP（ブラウザフォン）では、発信通知番号を切り替えることができませんが、CCPをカスタマイズし、アウトバウンドキューARNを指定することで実現できます。また、エージェントごとのルーティングプロファイルに紐付いたキューを参照することによって、動的に発信通知番号リストも変えることができます。
やりたいこと
今回実現したいのは以下のことです。
- CCP（ブラウザフォン）から発信番号を自由に選択して発信できるようにする
- 発信通知番号は、ルーティングプロファイルに紐づいたキューから動的にリスト化する
Connect設定
以下は関連するConnectの設定です。
電話番号
発信通知番号を切り替えたいため、電話番号は2つ取得します。2つ以上でももちろん大丈夫です。
キュー
各番号をアウトバウンド発信者ID番号に指定したキューを作成します。番号選択として表示されるのはキューの名前になるので、どのキュー、番号なのかわかりやすい名前をつけました。
ルーティングプロファイル
ルーティングプロファイルは作成したキューが入っていれば優先度や遅延の設定は自由に設定して大丈夫です。
エージェント
最後に、発信通知番号を切り替えたいエージェントのルーティングプロファイルに、作成したものを設定します。
CCPカスタマイズ
サンプルコード
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title>List Queue Numbers</title>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
</head>
<body>
<div class="container">
<div class="row">
<div class="col-sm-12">
<div id="containerDiv" style="width: 320px; min-width: 200px; height: 465px; min-height: 400px;"></div>
<div class="row">
<input class="form-control" id="inputField" type="text" placeholder="03XXXXYYYY"></input>
<select id='dialNumber' class="form-control" name="numbers">
</select>
<button class="button btn btn-outline-primary" onclick="dialBySelectedNumber()" style="width: 100%;">
発信
</button>
</div>
</div>
</div>
</div>
</body>
</html>
<script src="amazon-connect-1.4.4-19-gd2eb716.js"></script>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js" integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js" integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM" crossorigin="anonymous"></script>
<script src="aws-sdk.min.js"></script>
<script type="text/javascript">
const ccpUrl = "https://geekfeeduchi.awsapps.com/connect/ccp#/";
const region = "ap-northeast-1"
// CCP初期化
connect.core.initCCP(containerDiv, {
ccpUrl: ccpUrl,
loginPopup: true,
loginPopupAutoClose: true,
region: region,
softphone: {
disableRingtone: true,
ringtoneUrl: null,
allowFramedSoftphone: true
}
});
// Agentのイベントサブスクライブ
let loginAgent;
let phoneNumbers = [];
connect.agent(function(agent) {
// init時処理
console.log("agent initializing...");
loginAgent = agent;
const agentConf = agent.getConfiguration();
console.log(JSON.stringify(agentConf));
for (var queue of agentConf.routingProfile.queues) {
phoneNumbers.push({
'displayName': queue.name,
'queueArn': queue.queueARN
});
}
for (var i = 1; i < phoneNumbers.length; i++) {
$("#dialNumber").append('<option value='+ i +'>' + phoneNumbers[i].displayName + '</option>');
}
});
// 選択した番号から発信
function dialBySelectedNumber() {
const selectedIndex = $("#dialNumber").val();
let dialedNumber = $("#inputField").val().replace(/[━.*‐.*―.*－.*\-.*ー.*\-]/gi,'');
if (!dialedNumber.match(/^(0[5-9]0[0-9]{8}|0[1-9][1-9][0-9]{7})$/)) {
alert("正しい電話番号を入力してください");
return false;
}
dialedNumber = "+81" + dialedNumber.substr(1);
const endpoint = connect.Endpoint.byPhoneNumber(dialedNumber);
loginAgent.connect(endpoint, {
queueARN: phoneNumbers[selectedIndex].queueArn,
success: function () {
console.log("Connect Success");
},
failure: function () {
console.log("Connect Failed");
console.log(connect.getLog());
}
});
}
</script>CCP初期化時の処理
connect.agent(function(agent) { ... });
Subscribe a method to be called when the agent is initialized. If the agent has
already been initalized, the call is synchronous and the callback is invoked
immediately. Otherwise, the callback is invoked once the first agent data is
received from upstream. This callback is provided with an `Agent` API object,
which can also be created at any time after initialization is complete via `new
connect.Agent()`.connect.agent()内でCCPが初期化時の処理を実装することができます。この中で、agent.getConfiguration()からエージェントの情報を取得しています。
取得できるキュー一覧について
var config = agent.getConfiguration();
Gets the full `AgentConfiguration` object for the agent. This object contains the following fields:
* `name`: The agent's user friendly display name.
* `softphoneEnabled`: Indicates whether the agent's phone calls should route to the agent's
browser-based softphone or the telephone number configured as the agent's extension.
* `extension`: Indicates the phone number that should be dialed to connect the agent to their
inbound or outbound calls when softphone is not enabled.
* `routingProfile`: Describes the agent's current routing profile and list of
queues therein. See `agent.getRoutingProfile()` for more info.
* `username`: The username for the agent as entered in their Amazon Connect user account.agent.getConfiguration()のレスポンスの中には、routingProfileとそれに紐づくキューの情報が入っています。実際にレスポンスを見てみましょう。（routingProfile以下は省略しています）
{
"name": "ippei",
"username": "nishiyama",
"softphoneEnabled": true,
"softphoneAutoAccept": false,
"extension": "",
"routingProfile": {
"name": "Basic Routing Profile",
"routingProfileARN": "arn:aws:connect:ap-northeast-1:834541155044:instance/3b709f05-792c-4f51-9a32-86084a272245/routing-profile/1012edc8-827f-4bc5-8cce-e68edfab93a5",
"defaultOutboundQueue": {
"queueARN": "arn:aws:connect:ap-northeast-1:834541155044:instance/3b709f05-792c-4f51-9a32-86084a272245/queue/c8752af6-c337-4783-a664-5e8b4e38691b",
"name": "キュー1 03-4233-1149",
"queueId": "arn:aws:connect:ap-northeast-1:834541155044:instance/3b709f05-792c-4f51-9a32-86084a272245/queue/c8752af6-c337-4783-a664-5e8b4e38691b"
},
"queues": [
{
"queueARN": "arn:aws:connect:ap-northeast-1:834541155044:instance/3b709f05-792c-4f51-9a32-86084a272245/queue/agent/7d890b94-284c-4266-9e04-f0c56cb6244c",
"name": null,
"queueId": "arn:aws:connect:ap-northeast-1:834541155044:instance/3b709f05-792c-4f51-9a32-86084a272245/queue/agent/7d890b94-284c-4266-9e04-f0c56cb6244c"
},
{
"queueARN": "arn:aws:connect:ap-northeast-1:834541155044:instance/3b709f05-792c-4f51-9a32-86084a272245/queue/eea83be4-13db-4e14-ae66-dd4c9ac9cc17",
"name": "キュー2 050-3000-6176",
"queueId": "arn:aws:connect:ap-northeast-1:834541155044:instance/3b709f05-792c-4f51-9a32-86084a272245/queue/eea83be4-13db-4e14-ae66-dd4c9ac9cc17"
},
{
"queueARN": "arn:aws:connect:ap-northeast-1:834541155044:instance/3b709f05-792c-4f51-9a32-86084a272245/queue/c8752af6-c337-4783-a664-5e8b4e38691b",
"name": "キュー1 03-4233-1149",
"queueId": "arn:aws:connect:ap-northeast-1:834541155044:instance/3b709f05-792c-4f51-9a32-86084a272245/queue/c8752af6-c337-4783-a664-5e8b4e38691b"
}
],
"routingProfileId": "arn:aws:connect:ap-northeast-1:834541155044:instance/3b709f05-792c-4f51-9a32-86084a272245/routing-profile/1012edc8-827f-4bc5-8cce-e68edfab93a5"
}
}注目してほしい部分は、queuesの数とインデックス0のキューです。これはエージェントキューで、各エージェントが持つ自分専用のキューです。エージェントキューには、キューの名前やアウトバウンド発信者ID番号を指定することができないため、今回はリストに表示しないことにします。
動作
画面表示
こんな感じでプルダウンメニューから発信する番号をキュー名で選択できます。
発信してみる
実際に発信を行うと、それぞれ03番号と050番号で発信通知されます。
後ほど動画を追加するかもしれません！
携帯で着信を受けつつ撮影を行うカメラがないんです。。
まとめ
エージェントに設定したルーティングプロファイルに紐づくキューを取得し、動的に発信通知番号リストを表示、発信を行うことができるようになりました。シンプルな運用を行っている場合は今回作成したもので問題ないのではないでしょうか。
より拡張を行うためには
APIや外部DBを使うことで、以下のような拡張機能を実現できます。
- インスタンスに登録しているキューをすべて発信通知番号リストに表示したい場合は、Amazon ConnectのAPIを使用する。
- ルーティングプロファイル以外のルールで発信者番号リストを表示したい場合、外部DBと連携をして動的に表示をさせる。
- 番号リストから選択する方式ではなく、発信先番号（お客さんの番号）で動的に通知番号を切り替えたい場合は、問い合わせフローと外部DB連携を行う。
その他にもいろいろな方式で違った発信通知方法を実現できると思います。その他の良いアイデアや、こういったことできるの？という疑問があったら教えてください！