はじめに
先月2019年11月に発表されたAmazon Connectのchat機能について、githubにサンプルが載っていましたので、そちらを試してみました。
サンプルには、お客様に提供するchatUI・Amazon Connectのchatのサンプルコンタクトフローなどが記載されていました。
今回はこちらのサンプルの利用方法をまとめました。
構成
こちらを参考にしてください。
エンドユーザに対して提供するWebページを、CloudFrontにて提供しています。
そのため試す際には、CloudFrontへのアクセスができるようにしてください。
設定方法
Amazon Connectの環境設定
・データストレージの設定
AWSのコンソール＞Amazon Connect＞インスタンスクリック＞データストレージより、チャット記録の有効化をしてください。
・問合せフロー作成
まず、githubから「Basic Chat Disconnect Flow.json」、「Basic Chat.json」をダウンロードしてください。これから作成するコンタクトフローのデータが入っています。
次にAmazon Connectの設定画面に入り、問合せフローの新規作成をします。作成の際には、右上のフローのインポート（ベータ）をクリックし、そちらに先ほどダウンロードした「Basic Chat Disconnect Flow.json」ファイルを入れ、公開してください。(Basic Chatを先に選択すると、公開できません。)
BasicChat.jsonも同様にコンタクトフローを作成・公開し、「Basic Chat Disconnect Flow」と「Basic Chat」の2つのフローが作成されていることを確認してください。
・ルーティングプロファイルの設定
chatを受け付けるAgentの持つルーティングプロファイルのchat部分にチェックを入れてください。
また、ページ下部のルーティングプロファイルのキューにてBasicQueueのChannelsのChatにチェックがつけてください。
・セキュリティプロファイルの設定
[Agent]のセキュリティプロファイルに対して、追加の設定を行います。
[数字とフロー] > [Chat test mode] > [すべて]にチェックを入れてください。
Amazon Connect外の設定(CloudFormationの実行)
Amazon Connect以外の部分の設定のために、CloudFormationのテンプレートが用意されています。
こちらを実行することで設定が完了します。
事前パラメータの確認
下記のパラメータが必要となるので、事前に確認しておきます。
・Amazon ConnectS3BucketName：connect-XXXXXXXXXXXX
→AWSコンソール＞Amazon Connect＞データストレージから、確認してください。'connect-xxx'という形式です。
・WebsiteS3BucketName：xxx-chat-demo
→ 任意の文字列
・cloudFrontPriceClass：PriceClass_100
→ デフォルトのまま
・contactFlowId：[問い合わせフローID]
→ [Basic Chat] 問い合わせフローARN のcontact-flowの後ろの値]
・instanceId：[Amazon ConnectのインスタンスID]
→ [Basic Chat] 問い合わせフローARN のinstanceの後ろの値]
・transcriptPath：connect/[Amazon Connectインスタンス名]/ChatTranscripts
→ Amazon Connect > データストレージ > チャット記録で設定した値
asyncCustomerChatUXのデプロイ
まず、Cloudformationをスムーズに行うため、AWSのコンソールへログインしてください。
次に、https://github.com/amazon-connect/amazon-connect-chat-ui-examples
のREADMEにある以下のURLを選択し、ap-notheast-1(Tokyo) の [Launch Stack] ボタンを押下して下さい。
CloudFormation のスタックの作成が開始します。
[ステップ1] では内容は変更せずそのまま[次へ]
[ステップ2] では先ほど確認した内容を入れて[次へ]
[ステップ3] では内容は変更せずそのまま[次へ]
[ステップ4] では[AWS CloudFormation によって IAM リソースが作成される場合があることを承認します。] にチェックをして[スタックの作成]を押してください。
ステータスが[CREATE_COMPLETE]になれば作成完了です。
実際に動かしてみる
・エージェント側：
Amazon ConnectのCCP(ccp-v2)を起動し、chat対応のAgentにてログインしてください。
https://[Amazon Connectインスタンス].awsapps.com/connect/ccp-v2/
・クライアント側：
CloudFrontにて作成されたサイトのURLにアクセスしてください。
[CloudFormation] > [スタック] > asyncCustomerChatUX の[出力] から cloudFrontDistribution の値見ることでURLを知ることができます。
First Name：顧客の名前
Username：Amazon ConnectのAgentログイン名
を入力して[Start Chat]を押してください。これにてchatを開始することができます。
終わりに
以上にてAmazon Connectのチャット機能のデモを実施することができます。
現在のデモでは、エージェント名を入力しないといけない仕様となっていて使いづらいですので、今後紐解いていこうと思っています。