Salesforce チャットの統合

このチャット統合では、Salesforce Lightning Web Component（LWC）を使用して、チャット会話用の Agent Assist UI モジュールと統合します。

チャット統合の概要は次のとおりです。

Salesforce との Agent Assist チャット統合のアーキテクチャ

始める前に

Agent Assist UI モジュールを Salesforce と統合するには、まず必要なリソースを設定する必要があります。

ステップ 1: Salesforce 開発プロジェクトを設定する

Agent Assist UI モジュールの統合を開始する手順は次のとおりです。

  1. 次のコードを実行して、Agent Assist 統合リポジトリのクローンを作成し、プロジェクトを開きます。

    git clone https://github.com/GoogleCloudPlatform/agent-assist-integrations
cd salesforce/aa-lwc

  2. 次のコマンドを実行して、 UI モジュールの JavaScript ファイルをダウンロードします。これらのファイルは、後で 静的リソース としてデプロイします。Salesforce では、サードパーティの JavaScript を読み込むために静的リソースが必要です。また、静的リソース ファイルのサイズは 5 MB に制限されているため、JavaScript ファイルは zip ファイルとしてアップロードされます。

    npm run generate-static-resources
npm install

ステップ 2: Salesforce 環境を設定する

Agent Assist UI モジュールは、本番環境や開発環境などの特定の環境に統合できます。Salesforce では、これらの環境を 組織（org）と呼びます。

Salesforce コンソールで組織を構成する

Salesforce コンソールで、次の手順に沿って Agent Assist 統合用に組織を構成します。

  1. [設定] > [設定] をクリックします。 In the[Quick Find] box, enter Omni-Channel Settings, then click [Omni-Channel Settings].
    1. [オムニチャネルを有効にする] を選択します。
    2. [新しいウィンドウまたはタブでエージェントをオムニチャネルに自動的にログインする] を選択します。
    3. [保存] をクリックします。
  2. [設定] > [設定] をクリックします。 [クイック検索] ボックスに「コミュニティ」と入力し、[デジタル エクスペリエンス] > [設定] をクリックします。
    1. [エクスペリエンス ワークスペースを有効にする] を選択します。
    2. [保存] をクリックします。

Salesforce CLI で組織を構成する

Salesforce CLI を使用して Agent Assist 統合用に組織を構成する手順は次のとおりです。

  1. 次のコードを実行し、通常使用する Salesforce ログイン情報を使用して CLI を認証します。

    npm run login

  2. 次のコードを実行して、LWC を組織にデプロイします。

    npm run deploy

ステップ 3: 外部クライアント アプリを作成する

Salesforce LWC は、クライアント認証情報 OAuth 2.0 フローを使用して認証を行います。外部クライアント アプリを使用すると、クライアント認証情報フローを有効にできます。アプリのコンシューマ キーとコンシューマ シークレットを使用して Salesforce LWC を構成し、Salesforce でユーザーを認証します。

  1. [設定] > [設定] をクリックします。[クイック検索] ボックスに「外部クライアント アプリ マネージャー 」と入力します。
    1. [外部クライアント アプリ マネージャー] > [新しい外部クライアント アプリ] > [作成] をクリックし、次の情報を入力します。
      • 外部クライアント アプリ名: lwc auth
      • API 名: lwc_auth
      • 連絡先メールアドレス: your_email@example.com
      • API（OAuth 設定の有効化） > OAuth の有効化: 選択済み
      • API（OAuth 設定の有効化） > コールバック URL: https://login.salesforce.com/services/oauth2/callback
      • API（OAuth 設定の有効化）> 選択した OAuth スコープ: ID URL サービスにアクセスする
      • API（OAuth 設定の有効化）> クライアント認証情報フローを有効にする: 選択済み
    2. [作成] をクリックします。
  2. [設定] > [設定] をクリックします。[クイック検索] ボックスに「外部クライアント アプリ マネージャー 」と入力します。
    1. 外部クライアント アプリの名前 > [編集] をクリックします。
    2. [OAuth ポリシー] > [OAuth フローと外部クライアント アプリの機能強化] に移動します。
    3. [クライアント認証情報フローを有効にする] が選択されていることを確認します。
    4. [実行ユーザー] にログイン ユーザー名を入力します。
    5. [保存] をクリックします。
  3. [設定] > [設定] をクリックします。[クイック検索] ボックスに「外部クライアント アプリ マネージャー 」と入力します。
    1. 外部クライアント アプリの名前 > [編集] をクリックします。
    2. [OAuth 設定] > [アプリの設定] > [コンシューマ キーとシークレット] に移動します。
    3. メールで送信された確認コードを入力します。
    4. コンシューマ キーとコンシューマ シークレットを安全な場所にコピーします。これらは後のステップで必要になります。

CORS とコンテンツ セキュリティ ポリシーを確立する

  1. [設定] > [設定] をクリックします。
  2. [**クイック検索**] ボックスに「**CORS** 」と入力し、[**編集**] をクリックします。
    1. [OAuth エンドポイントの CORS を有効にする] を選択します。
    2. [保存] をクリックします。
  3. [設定] > [設定] をクリックします。
  4. [Quick Find] ボックスに「Trusted URLs」と入力し、[New Trusted URL] をクリックします。
  5. 次の情報を入力します。
    • API 名: ui_connector
    • URL: Agent Assist 統合バックエンドでデプロイした UI コネクタ Cloud Run サービス エンドポイントの URL を入力します。この URL は Cloud Run コンソールで確認できます。例: https://UI_CONNECTOR_SUBDOMAIN.GCP_REGION.run.app。
    • CSP ディレクティブ: すべてのチェックボックスをオンにします。
    • [保存して新規] をクリックします。
  6. 次の情報を入力します。
    • API 名: ui_connector_wss
    • URL: UI コネクタ サービス エンドポイントの Secure WebSockets URL（wss://UI_CONNECTOR_SUBDOMAIN.GCP_REGION.run.app）を入力します。
    • CSP ディレクティブ: すべてのチェックボックスをオンにします。
    • [保存して新規] をクリックします。
  7. 次の情報を入力します。
    • API 名: salesforce_domain
    • URL: 次の 形式で Salesforce ドメインの URL を入力します。https://YOUR_SUBDOMAIN.my.salesforce.com
    • CSP ディレクティブ: すべてのチェックボックスをオンにします。
    • [保存] をクリックします。

ステップ 4: チャット クライアントを構成する

Salesforce で Agent Assist UI モジュールを使用するには、エージェント デスクトップにチャット クライアントが必要です。

拡張チャットを構成する

メッセンジャーを構成する手順は次のとおりです。

  1. [設定] > [設定] をクリックします。 [クイック検索] に「キュー」と入力し、[新規] をクリックします。
    1. 次の情報を入力します。
      • ラベル: Messaging Queue
      • キュー名: Messaging_Queue
      • ルーティング構成: Messaging_Routing_Configuration
    2. [サポートされているオブジェクト] をクリックし、[メッセージング ユーザー] と [メッセージング セッション] を追加します。
    3. [キューメンバー] をクリックし、[ユーザー: ログイン ユーザー] を追加します。
    4. [保存] をクリックします。
  2. [設定] > [設定] をクリックします。[クイック検索] ボックスに「権限セット 」と入力します。
    1. [メッセージング エージェント権限セット] をクリックします。
    2. [サービス プレゼンス ステータスへのアクセス] > [編集] をクリックします。
    3. ステータス [ビジー] と [オンライン - メッセージング] を選択します。
    4. [追加] > [保存] をクリックします。
  3. [設定] > [設定] をクリックします。 [クイック検索] ボックスに「ユーザー」と入力し、[ユーザー] をクリックします。
    1. ユーザー名をクリックし、[Service Cloud ユーザー] が有効になっていることを確認します。
    2. ページで [権限セット ライセンスの割り当て] を探します。
    3. [割り当てを編集] をクリックし、Enhanced Chat User を選択します。
    4. [保存] をクリックします。
    5. ページで [権限セットの割り当て] を探します。
    6. [**割り当てを編集**] をクリックし、[**メッセージング エージェント権限セット**] を選択します。
    7. [追加] > [保存] をクリックします。
  4. [設定] > [設定] をクリックします。 [クイック検索] ボックスに「メッセージングの設定」と入力し、[新規 チャネル] をクリックします。
    1. [拡張チャット] を選択します。
    2. 名前に「Messaging Channel」と入力します。
    3. [保存] をクリックします。
    4. ルーティング タイプ を [オムニキュー] に、キュー を [メッセージング キュー] に設定します。
    5. [保存] をクリックし、[メッセージングの設定] に移動します。
    6. メッセージング チャネルの名前をクリックし、[有効化] をクリックします。
    7. 利用規約 を読んで同意します。
  5. [設定] > [設定] をクリックします。 [クイック検索] ボックスに「埋め込みサービス デプロイ」と入力し、[新規 デプロイ] をクリックします。
    1. [拡張チャット] > [次へ] > [ウェブ] > [次へ] をクリックします。
    2. 次の詳細を入力します。
      • 名前: Messaging Embedded Service Deployment
      • デベロッパー名: Messaging_Embedded_Service_Deployment
      • ドメイン: example.com
      • チャンネル: メッセージング チャネル
    3. [保存] をクリックします。デプロイが完了するまで待ちます。
    4. [埋め込みサービス デプロイ] の設定で、[公開] をクリックします。
    5. [更新]、[メッセージングをテスト] の順にクリックします。

拡張チャットをテストする

メッセンジャーをテストする手順は次のとおりです。

  1. [メッセージングをテスト] をクリックします。
  2. 新しいタブが読み込まれたら、吹き出しをクリックして新しいテスト会話を開始します。
  3. 「テスト 」などのメッセージを送信します。
  4. Salesforce ブラウザタブに移動します。
  5. [アプリ ランチャー] メニューをクリックし、[サービス コンソール] を選択します。
  6. [オムニチャネル] をクリックします。
  7. ステータスを [オンライン - メッセージング] に設定します。
  8. 着信したメッセージを承諾します。会話の新しいタブが [サービス コンソール] に開きます。チャットのトランスクリプトは表示されません。
  9. [設定] をクリックし、[ページの編集] を選択します。
  10. [コンポーネント] メニューから、[拡張会話] コンポーネントを [会話] セクションにドラッグします。
  11. [保存] > [有効化] > [組織のデフォルトとして割り当てる] > [デスクトップ] > [戻る] をクリックします。
  12. ページを更新します。
  13. [オムニチャネル] をクリックします。
  14. ステータスを [オンライン - メッセージング] に設定します。
  15. [テスト] メッセージに返信して、メッセージングが機能していることを確認します。

問題が発生して詳細情報が必要な場合は、包括的な Salesforce 拡張チャットの設定ガイドをご覧ください。

ステップ 5: Salesforce Lightning Web Component をインストールする

Lightning Experience エディタを使用して、メッセージング セッション ページに Salesforce LWC を追加する手順は次のとおりです。 ステップ 4 のテスト会話を続けます。

  1. [設定] をクリックし、[ページの編集] を選択します。

  2. [コンポーネント] リストから、agentAssistContainerModule をページにドラッグします。

  3. 前のステップで配置したコンポーネントをクリックします。

  4. 次の手順に沿ってフォーム フィールドに入力し、構成の詳細を追加します。

    • エンドポイント: Agent Integration Backend UI コネクタの URL（ Cloud Run コンソールからの URL など）。例: https://UI_CONNECTOR_ENDPOINT.GCP_REGION.run.app
    • チャンネル: チャンネルが chat であることを示します。
    • プラットフォーム: プラットフォームが messaging であることを示します。
    • conversationProfile: Agent Assist 会話プロファイル リソース名（例:projects/GCP_PROJECT_ID/locations/GCP_REGION/conversationProfiles/CONVERSATION_PROFILE_ID）
    • consumerKey: ステップ 3 の外部クライアント アプリのコンシューマ キー。
    • consumerSecret: ステップ 3 の外部クライアント アプリのコンシューマ シークレット。
    • containerHeight: Agent Assist コンテナの高さ。