Amazon Connect のエージェントワークスペース サードパーティ アプリケーションを試す

# はじめに
ARI コンタクトセンター最適化支援チームのbayashiです。

Amazon Connect の標準機能でエージェントワークスペースがあります。
2023年10月の機能アップデートで、サードパーティアプリケーション(プレビュー)が追加されました。

- [Third-party applications (3p apps) in the agent workspace (Preview)](https://docs.aws.amazon.com/connect/latest/adminguide/3p-apps.html)

※プレビューリリースのため、今後変更される場合があります。2023年10月時点での検証記事であることをご理解ください。

## この機能で実現できること。
>サードパーティアプリケーションのサポートにより、自社またはパートナーが構築したコンタクト センター ソフトウェアを 1 か所に統合​​できます。たとえば、独自の予約システムやベンダー提供のメトリクス ダッシュボードを Amazon Connect エージェントのワークスペースに統合できます。


以下画像はAWSドキュメントからの引用ですが、オリジナルのアプリケーションをエージェントワークスペース内のタブに表示させることができます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2605350/237093d8-7275-9572-c7a7-05e40759bfea.png)
https://docs.aws.amazon.com/connect/latest/adminguide/agent-workspace.html

オリジナルのアプリケーションを作るのはハードルが高いので、今回は外部のウェブページを表示できるか試しました。

## 対応リージョン
執筆時点での対応リージョンは以下の4リージョンです。今回はシドニーリージョンで試しました。
- US East (N. Virginia)
- US West (Oregon)
- Asia Pacific (Sydney)
- Europe (London)

# 設定方法

## サードパーティアプリケーションの設定

1.Amazon Connect コンソールにログイン
2.「サードパーティーのアプリケーション」から「アプリケーションを追加」を選択

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2605350/7bfb3678-2228-b320-8ffd-5f962196310b.png)

3.表示名、名前空間、説明 (オプション)、アクセスURL、承認されたオリジン (オプション)を入力、インスタンスの関連付けで必要なインスタンスをチェック
※ アプリケーションの追加後は、名前空間は変更不可になります。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2605350/c24005a0-1891-a77f-e3fd-7958c419949d.png)

4.「アプリケーションを追加」を選択し追加完了
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2605350/7d4ac611-fb33-3107-cd7c-ceb64d2d7882.png)



## サードパーティ アプリケーションのセキュリティプロファイルアクセス許可設定
1.サードパーティアプリケーション設定で関連付けしたインスタンスへログイン
2.セキュリティプロファイルから「エージェントアプリケーション」を確認
3.追加したサードパーティーアプリケーション名の「アクセス」を有効化し、保存
(今回はAdmin権限で設定)
 
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2605350/a3a5ac14-3a14-af68-2e9c-a0648ae1c962.png)

必要な設定は以上です。

# エージェントワークスペース画面
1.セキュリティプロファイルの権限でサードパーティーアプリケーションにアクセスが可能なエージェントで、エージェントワークスペースを立ち上げる
2.エージェントワークスペースの右上隅にアプリランチャーメニューが表示される
3.対象のアプリケーションを選択する
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2605350/721afd90-c47e-6354-3b61-1190f94b8ea2.png)

- 弊社ARIのホームページが、別タブで開きました。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2605350/9f73cc14-b430-0bc2-9430-96daabb657ec.png)
#####
- もう一つ、Google Mapを設定し開いた画面です。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2605350/2156605e-3ff7-4dd4-f422-2a1a594fa7f7.png)
#####
- 新しく着信を受け入れると、開いていたタブは自動で閉じました。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2605350/ca188f0f-4df9-708d-54ed-c1b91b13c878.png)
#####
- 表示に対応していないサイトを設定した場合、以下の画面が出ました。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2605350/ee995632-8c49-096f-932a-d675a137db6b.png)


# 機能情報
https://docs.aws.amazon.com/connect/latest/adminguide/3p-apps-agent-workspace.html
> エージェントは、アイドル状態 (連絡先がないとき) または連絡先 (通話、チャット、またはタスク) のときにアプリケーションを起動できます。特定の連絡先に対してアプリが開かれると、その連絡先が閉じられるまでアプリは開いたままになります。


https://docs.aws.amazon.com/agentworkspace/latest/devguide/integrating-with-agent-workspace-how-apps-load.html
> エージェント ワークスペースを使用すると、ユーザーは複数の連絡先を同時に処理できます。ただし、一度に選択できる連絡先は 1 つだけであり、ワークスペースは連絡先のチャネル (通話、チャット、またはタスク) とその連絡先に対して開かれているアプリケーションに基づいてエクスペリエンスを更新します。ユーザーが別の連絡先に切り替えると、アプリケーションタブのセットは、ユーザーが前の連絡先を使用していたときに最後に行っていた内容に更新されます。

> ユーザーがメインワークスペースの右上隅にあるアプリランチャーアイコンを選択し、リストからアプリケーションを選択すると、アプリケーションを開くことができます。これにより、ユーザーがその時点でアクティブにしている連絡先の新しいアプリケーションタブにアプリが読み込まれます。ユーザーにアクティブな連絡先がない場合はアイドル状態になります。アプリケーションを開いた連絡先ごとに新しい iframe が作成されます。その iframe は、アプリケーション タブが閉じられるまで、たとえばユーザーがタブの [x] をクリックするか、連絡先が閉じるまで存在します。この時点で、アプリはライフサイクル破棄プロセスを実行し、iframe が DOM からアンマウントされる前にリソースをクリーンアップする機会をアプリに与えます。ユーザーが同じ連絡先の別のタブを選択するか、別の連絡先に切り替えると、iframe が非表示になります。これは、いつでも、異なる連絡先に対して同じアプリケーションの複数のインスタンス (iframe など) が実行される可能性があることを意味します。

# 注意点
追加したサードパーティアプリケーションは、コンソール画面上で削除できる表記が無いようです。Slackをタブ表示できるか試したのですが、表示に失敗したため削除しようとした結果、削除できない状態になりました。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/2605350/462506b6-b577-f4ce-8f08-b036959331fd.png)


# 最後に
業務で必要な外部サイトや、オリジナルのアプリケーションをデプロイしエージェントワークスペースへ統合することで、より便利にAmazon Connect を利用できそうな機能でした。
正式リリースを待ちたいと思います。