Web アプリケーションへのエンゲージメントメッセンジャー の埋め込み

  • リリースバージョン: Xanadu
  • 更新日 2024年08月01日
  • 所要時間：5分

    • Web サイトで構成した Messenger モジュールのソースコードを埋め込み、顧客が Web サイトで エンゲージメントメッセンジャー の使用を開始できるようにします。

    始める前に

    このタスクについて

    有効化した Messenger モジュールのソースコードをコピーし、Messenger を展開する Web サイトの HTML ファイルに貼り付けます。

    次に、構成された Messenger モジュールに対して選択した認証タイプに応じて、ID トークンを取得する機能のコードを記述し、Messenger でログインしているユーザーのセッションを開始および停止する必要がある場合があります。

    手順

    1. 移動先 すべて > Engagement Messenger > モジュール.
    2. Web サイトにインストールする Messenger モジュールの [モジュールの編集] 列で [編集] をクリックします。
      ガイド付き構成ビューが表示されます。
    3. [実装] タブをクリックします。
    4. [セキュリティ設定] セクションに変更を行った場合は、[保存] をクリックします。
      エンゲージメントメッセンジャー モジュールのコードが更新されます。
    5. [埋め込みコード] セクションまで下にスクロールし、[コードをコピー] をクリックします。
    6. Web サイトの HTML ファイルを開き、コピーされたコードを本文終了タグの前に貼り付けます。
    7. OIDC ベースまたは SAMl ベースの認証を使用する Messenger モジュールの場合は、次の構成を完了してください。
      認証タイプアクション
      OIDC ベース
      1. GetTokenCallBack() 関数のコードを記述します。
      2. ユーザーが Web サイトにログインするたびに、SN_CSM_EC onLogin() 関数を呼び出します。

        この関数により、認証されたユーザーは、Web サイトにログインするときに エンゲージメントメッセンジャー にシームレスにログインできます。

      3. ユーザーが Web サイトからログアウトするたびに、SN_CSM_EC.onLogout() 関数を呼び出します。

        この関数により、認証されたユーザーは、エンゲージメントメッセンジャー および Web サイトからシームレスにログアウトできます。
      SAML ベース
      1. ユーザーが Web サイトにログインするたびに、SN_CSM_EC onLogin() 関数を呼び出します。

        この関数により、認証されたユーザーは、Web サイトにログインするときに エンゲージメントメッセンジャー にシームレスにログインできます。

      2. ユーザーが Web サイトからログアウトするたびに、SN_CSM_EC.onLogout() 関数を呼び出します。

        この関数により、認証されたユーザーは、エンゲージメントメッセンジャー および Web サイトからシームレスにログアウトできます。
      注:
      OIDC および SAML ベースの認証のセットアップの詳細については、Now Support ナレッジベースの「Engagement Messenger の自動ログインとログアウトの設定 [KB1560205] (Setting up auto login and logout for Engagement Messenger [KB1560205])」記事を参照してください。
    8. 非認証ユーザーのウォークアップ機能を有効にした場合は、//guestWalkupBaseUrl コード行のコメントを解除し、カスタマーサポートポータルのベース URL を入力して構成を完了します。

      たとえば、カスタマーサポートポータルが https://www.example.com/support の場合、コードを更新して guestWalkupBaseUrl = https://www.example.com/support にします。

      図 : 1. Engagement Messenger コードのコピー
      ハイライト表示されたステップを使用して、Engagement Messenger モジュールを構成します。実装では、埋め込みコードを使用して非認証ユーザーの問題を修正します。
    9. オプション: 埋め込みコードを変更して エンゲージメントメッセンジャー が表示される優先言語を設定するには、次のいずれかを実行します。
      オプション説明
      lang: {ISO ロケールコード} 固定言語で エンゲージメントメッセンジャー をロードできるようにします。
      setLang : getEMLanguage エンゲージメントメッセンジャー が表示される言語を動的に切り替えることができます。getEMLanguage 値は、メッセンジャーの言語に使用できる任意の ISO ロケールコードを返すことができます。
      setLang : getEMLanguage 関数は、両方のパラメーターが利用可能な場合に優先されます。ただし、ユーザーが [sys_user_preference] テーブルで優先言語を設定している場合、エンゲージメントメッセンジャー はその言語で表示されます。
      注:
      Xanadu リリース以降、アップグレードした顧客は、埋め込みコードを変更して言語の切り替えを有効にすることもできます。
    10. オプション: エンゲージメントメッセンジャー コードを追加した Web サイトを開き、ランチャーアイコンが利用可能であることを確認し、アイコンをクリックして、エンゲージメントメッセンジャー が起動されることを確認します。
    11. オプション: 積極的推奨を Web ページに統合するには、エンゲージメントメッセンジャー の埋め込みコードを変更します。
      エンゲージメントメッセンジャー を使用した Web ページへの積極的推奨の統合の詳細については、「エンゲージメントメッセンジャー の埋め込みコードを使用した、Web ページでの積極的推奨の統合」を参照してください。

    次のタスク

    エンゲージメントメッセンジャー コードを追加した Web サイトを開き、Messenger のランチャーアイコンが利用可能であることを確認します。アイコンをクリックして、エンゲージメントメッセンジャー を起動します。

    Now Mobile SDK を使用して、ネイティブの iOS および Android アプリケーションに エンゲージメントメッセンジャー を組み込むこともできます。