この記事は公開されてから1年以上経過しています。情報が古い可能性がありますので、ご注意ください。
1 はじめに
AIソリューション部の平内（SIN）です。
Amazon Connect(以下、Connect)では、CCPを利用して発信が可能です。
今回は、キャンペーンの案内を顧客情報（一覧）から順に電話する作業をイメージして、エージェント（オペレータ）の作業が、少しでも楽に、そして間違いのないようにするため、クリックだけで発信する仕組みを作ってみました。
最初に利用しているようすです。
2 顧客データ
顧客データは、テキストで準備してS3に置いています。
customer_data.txt（サンプルのため伏せ字になっています）
石X XX,いしぐろ XXX,大阪府,080-XXX-49X5
上X XX,うえだ XXX,京都府,080-XXXX-66X2
柳X XX,XXX あやめ,徳島県,090-XXXX-30X2
XX 栄X,XXX えいいち,岩手県,080-XXXX-06X6
五X XX,いがらし XXX,秋田県,090-XXXX-97X1
高X XX,たかくら XXX,香川県,080-XXXX-64X6
水X XX,みずの XXX,福岡県,090-XXXX-99X1
上X XX,XXX るりあ,山口県,090-XXXX-30X0
X本 XX,XXX ひろみ,東京都,090-XXXX-34X6
X川 XX,おいかわ XXX,茨城県,090-XXXX-90X3
X口 XX,たぐち XXX,神奈川県,090-XXXX-77X1
XX まひる,XXX まひる,静岡県,090-XXXX-27X4
XX X子,XXX けいこ,広島県,061-XXX-99X9
・・・略・・・S3に置きます。
3 CCP
CCPを表示するには、Connectのホワイトリストに追加する必要がありますが、httpsであることが必須であるため、今回は、S3に置いて公開しています。
4 JavaScript(html)
作成した、JavaScript(html)は、以下のとおりです。CCPを初期化して、agentオブジェクトで発信しています。
S3から取得した顧客情報は、必要な部分だけを表示しています。
<br /><br /><br /><center></center>
<table>
<tbody>
<tr>
<td>
<div id="containerDiv"></div></td>
<td>
<div id="scroll-list"></div></td>
</tr>
</tbody>
</table>
<script>
/* 顧客一覧の表示 */
AWS.config.region = 'ap-northeast-1';
AWS.config.credentials = new AWS.CognitoIdentityCredentials({
IdentityPoolId: 'ap-northeast-1:xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx',
});
const s3 = new AWS.S3();
async function getCustomer(){
var params = {
Bucket: 'bucket_name',
Key: 'customer_data.txt'
};
const data = await s3.getObject(params).promise();
let text = decodeURIComponent(escape(String.fromCharCode.apply(null, data.Body)));
var lines = text.split('\n');
for ( var i = 0; i < lines.length; i++ ) {
const tmp = lines[i].split(',');
// 電話番号は、非表示とする
$('</p>
<li>'+tmp[1]+ ' ('+ tmp[2] + ')'+'<br />
<div class="phone-number">' + tmp[3] + '</div>
</li>
<p>').appendTo('ol').on('click', phone_click);
}
}
getCustomer();
/* CCP初期化 */
var login_agent = undefined;
var ccpUrl = "https://xxxxxxxx.awsapps.com/connect/ccp#";
connect.core.initCCP(containerDiv, {
ccpUrl: ccpUrl,
loginPopup: true,
softphone: {
allowFramedSoftphone: true
}
});
connect.agent( agent => {
login_agent = agent; //エージェントオブジェクトを取得
});
/* 発信 */
function dialContact(phone_number) {
var endpoint = connect.Endpoint.byPhoneNumber(phone_number);
login_agent.connect(endpoint,{
success: function () {
console.log("Connect Success");
},
failure: function () {
console.log("Connect Failed");
}
});
}
/* 顧客一覧の選択（クリック） */
function phone_click() {
if(0 <= $(this).css('background').indexOf('rgb(255')){
// コールが完了したリスト
$(this).css('background','#3F6D8c');
} else {
// まだコールしていないリスト
$(this).css('background','red');
// 非表示となっている子要素(電話番号)を取得する
const phoneNumber = $(this).children().text();
dialContact(phoneNumber);
}
}
</script>5 最後に
エージェント（オペレータ）が、電話番号を入力する作業は、もしかすると結構大変なのではないでしょうか。間違いなどを防ぐためにも、このような仕組みは有効かも知れません。
なお、今回は、簡単なサンプルということで、電話番号が見えないよう非表示にしただけですが、API(StartOutboundVoiceContact)を使用して、キュー経由でエージェントに繋ぐことで、完全に電話番号を秘匿することも可能です。
弊社では、「Amazon Connect」の導入を検討している方を対象とした無料相談会を毎週開催中です。
また、音声を利用した各種ソリューションの導入支援を行っております。お気軽にお問い合わせください。
5
