【Amazon Connect】通話・ビデオ通話ウィジェットで顧客情報を連携

はじめに

Aamzon Connectでウェブページ上へ音声通話、および、ビデオ通話機能を埋め込む機能（以下Web通話機能と表記します）について以前紹介しました。

blog.serverworks.co.jp

上記の内容でワンクリックでWeb通話する機能を実装できました。
ただし、あまりにも簡単に匿名発信できてしまうため、公開Webページ上へ配置してしまうと、「うっかりクリックして発信してしまう」ことが発生しそうです。
また、不特定多数が匿名利用できるため、「悪意を持っていたずら発信する」ケースも考えられます。

目的外の着信が増えてしまってはコールセンター側の運用が難しくなりそうです。
そこで、Web通話ウィジェットのセキュリティ機能を有効化します。
これによって、許可されたユーザーのみ発信実行するように制御できます。
また、この機を利用することで、任意のコンタクト属性を指定可能になります。
ユーザー認証時に顧客情報を取得し、それをコンタクト属性にセットすることで、オペレーター側は着信時点で情報を確認可能となり、スムーズな対応が可能になります。

設定手順

以前の手順がベースにある前提で設定手順を紹介します。

ウィジェット設定

Amazon Connectの管理画面で操作します。

ウィジェットセキュリティーを有効化

コミュニケーションウィジェットページ→ドメインとセキュリティ部分の編集をクリックし、「コミュニケーションウィジェットリクエストのためにセキュリティを追加」します。

ウィジェットIDとセキュリティキーをコピー

後続の手順で使用するウィジェットIDとセキュリティキーをコピーして控えておきます。

ユーザー認証処理を作成

HTTPリクエストに対して署名付きJWTをレスポンスする処理を作成します。
API Gateway+Lambda(python)+Powertoolsで構成しました。

今回作成した処理のポイント

アクセスパスは /token とする
ウィジェットIDとセキュリティキーはそれぞれ環境変数 WIDGET_ID SECURITY_KEY で設定
返却トークンの有効期限は5分(300秒)
コンタクト属性として下記3つを指定（※システム化する場合は顧客データベースなどから動的に取得します）
- _CCP_CustomerId = 1234567890
- _CCP_Name = サーバー太郎
- _CCP_Email = tarou@serverworks.co.jp
レスポンスは JSONで token キーへ署名付JWT文字列を指定

デプロイ後、API GatewayのEndpointURLを控えておきます。

import os
from datetime import datetime, timedelta

import jwt
from aws_lambda_powertools import Logger
from aws_lambda_powertools.event_handler import APIGatewayRestResolver, CORSConfig
from aws_lambda_powertools.logging import correlation_paths
from aws_lambda_powertools.utilities.typing import LambdaContext

app = APIGatewayRestResolver(cors=CORSConfig())
logger = Logger()


@logger.inject_lambda_context(correlation_id_path=correlation_paths.API_GATEWAY_REST)
def lambda_handler(event: dict, context: LambdaContext) -> dict:
    return app.resolve(event, context)


@app.get("/token")
def token() -> dict:
    # https://docs.aws.amazon.com/connect/latest/adminguide/optional-widget-steps.html

    widget_id = os.environ.get("WIDGET_ID", "")
    security_key = os.environ.get("SECURITY_KEY", "")

    payload = {
        "sub": widget_id,
        "iat": datetime.utcnow(),
        "exp": datetime.utcnow() + timedelta(seconds=300),
        "attributes": {
            "_CCP_CustomerId": "1234567890",
            "_CCP_Name": "サーバー太郎",
            "_CCP_Email": "tarou@serverworks.co.jp",
        },
    }
    token = jwt.encode(
        payload=payload,
        key=security_key,
        algorithm="HS256",
    )
    return {"token": token}

Web通話ウィジェットスクリプトを修正

Amazon Connectの管理画面で自動作成されたウィジェットスクリプトに下記を追記、デプロイします。
URLは先の手順でデプロイしたAPI GatewayのEndpointに置き換えます。
（※AWSドキュメントよりコードが多いのはCORS対応のためです）

amazon_connect('authenticate', function (callback) {
  const options = {
    method: 'GET',
    headers: {
      'Content-Type': 'application/json'
    }
  };
  window.fetch('https://xxxxx.execute-api.ap-northeast-1.amazonaws.com/v1/token', options).then(response => {
    console.log(response);
    response.json().then(data => {
      callback(data.token);
    });
  });
});