Amazon Connectのコンタクトフロー上で、問い合わせ属性の設定ブロックで設定した値を画面上に表示する方法

#Amazon Connect

#AWS

酒匂祐也

2018.06.04

この記事は公開されてから1年以上経過しています。情報が古い可能性がありますので、ご注意ください。

事業開発部の酒匂です。
Amazon Connectのコールセンターインスタンスを立ち上げると、標準で色々なコンタクトフローのサンプルが用意されております。この中にある下記のフローを試してみたことをキッカケに記事を書いてみたいと思います。

Sample note for screenpopというサンプルフローについて

このフローの説明には、 "Screenpop is a Contact control pannel feature that allows loading a web page optionally with parameters based on attributes. Refer to the screenpop documentation for more information." と記載があります。

つまり、CCP（Contact Control Pannel）上に問い合わせ属性値をポップアップ表示させることができるということです。

フローを見てみると、問い合わせ属性の設定ブロックで下記の通り値が設定されておりました。

しかし、試してみたところ、残念ながら問い合わせ属性の設定ブロックで設定した値は、CCP上に表示されませんでした。フォーラムを検索したところ、やはりCCPでは対応していないようでした。 https://forums.aws.amazon.com/thread.jspa?messageID=781169

問い合わせ属性の設定ブロックで設定した値を表示する方法

方法1：Amazon Connect Streamsを使ってCCPをカスタマイズする

Amazon Connect Streamsは、AWSより提供されているJava Scriptライブラリです。

これを使って着信した際に値を取得することができますので、任意の方法で表示することが可能です。このライブラリの使用方法については、下記を参考にして頂ければと思います。

Amazon Connect Streamsの初期セットアップ手順

Amazon Connect Streamsで各種EventをSubscribeする

補足：着信時のイベントを取得する方法について

上記のブログ記事にも記載しているのですが、着信時に発生するイベントの取得はContact APIのcontact.onIncoming()で可能と考えていたのですが、試してみるとこのイベントは発生しませんでした。

contact.onIncoming()イベントはコールバック着信を受けた際に発生することがわかりました。この場合、contactState = {"type":"incoming"}となります。

今回改めて調べてみたところ、下記の方法で判別することができました。どちらもやっていることは同じですが、方法2の方がスマートな気がします。

判別方法1

呼の情報がリフレッシュされたイベントで、インバウンド呼かつ、呼の状態がContactStatusType.CONNECTINGかどうかチェックする

connect.contact(function(contact) {
  contact.onRefresh(function(contact) {
    if (contact.isInbound()) {
      if (contact.getStatus().type === connect.ContactStatusType.CONNECTING){
        //着信時に行う処理
      }
    }  
  }
}

判別方法2

状態がContactStatusType.CONNECTINGな呼が発生したイベントで、インバウンド呼であるかどうかチェックする

connect.contact(function(contact) {
  contact.onConnecting(function() {
    if (contact.isInbound()) {
      //着信時に行う処理
    }
  }
}

問い合わせ属性の設定ブロックで設定した値を取得する方法

上記の"着信時に行う処理"と記載している部分に、下記のように記載すれば取得できます。

var attributeMap = contact.getAttributes();

attributeMapは以下のようにJSON Object型になっておりますので、必要な値を取得します。

attributeMap = {
  "ani":{
    "name":"ani",
    "value":"+8150xxxxxxxx"
  },
  "dnis":{
    "name":"dnis",
    "value":"+8150xxxxxxxx"
  }		
}

方法2：Amazon Connectと連携するCRMシステムなどの仕様に則る（SFDCを例にした場合）

SFDC（salesforce.com）との連携に使用するCTI Adapterは、Amazon Connect Streamsを使っているものですので、問い合わせ属性の設定ブロックで設定した値を取得した後にどのようにSFDCに値を渡すか？ということになります。

SFDCとAmazon Connectの連携手順については下記が参考になります。

Amazon ConnectをSalesforce Service Cloud上で使用してみる

Amazon Connect CTI Adapter for SalesforceでScreen Popupを試してみる

SFDC上で問い合わせ属性の設定ブロックで設定した値を取得する方法

余談ですが、現在のOpen CTI Adapterの前バージョンであるCTI Adapterの時は、着信時の遷移先の画面をVisualforceにすると、デフォルトとANI（発信者番号）とDNIS（着信番号）は連携されておりました。ただ、Open CTI Adapterになってからは、デフォルトでは何も渡されなくなりました。

そこで、任意の値を取得する方法について考えてみましたが、今回は値を取得することにフォーカスしております。

Visualforceページの作成

今回は値を受け取るだけですので、下記のものを用意しました。

<apex:page >
  <h1>CTI Param Test</h1>
  CTI Param Test 
  <br />
  ani:{!$CurrentPage.parameters.ani}
  <br />
  dnis:{!$CurrentPage.parameters.dnis} 
  <br />
</apex:page>

ソフトフォンレイアウトの設定

「Visualforceページにポップ」を選択し、用意したVisualforceページを設定します（全てのパターンで設定しても良いのですが、今回は試すだけですので、「レコード一致なし」、「1件のレコードの一致」のみにしております）。

CTI AdapterのVisualforceページのカスタマイズ

SFDCはLightningを使用していることを前提とします。VisualforceページからACSFCCP_Lightningを選択して、ソースコードを全てコピーします。

コピーしたものを別名で保存し、編集します。

38行目にあるpage idを任意のものに変更します。

変更前

<apex:page id="ACSFCCP_Lightning" showHeader="false">

変更後

<apex:page id="test_ACSFCCP_Lightning" showHeader="false">

167行目は下記のようになっておりますので、その次の行あたりに処理を追加します。今回はANI（発信者番号）とDNIS（着信番号）を連携するようにしてみます。

connect.getLog().info("ConnectSFCCP:cbInConsole:onConnecting:ScreenPop");

追加する処理

var attributeMap = contact.getAttributes();
var queryParams = "&ani=" + attributeMap.ani.value + "&dnis=" + attributeMap.dnis.value;

下記のqueryParamsに設定する値を変更します。

変更前

sforce.opencti.searchAndScreenPop({
   searchParams: phoneParsed.phone,
    queryParams: "",
    callType: sforce.opencti.CALL_TYPE.INBOUND,
    deferred: false
});

変更後

sforce.opencti.searchAndScreenPop({
   searchParams: phoneParsed.phone,
    queryParams: queryParams,
    callType: sforce.opencti.CALL_TYPE.INBOUND,
    deferred: false
});

コンタクトフロー上で下記のように値を設定していることを前提とします。