---
sourceDocument: Yokohama 対話型インターフェース
sourceDocumentLink: https://servicenow-prod.fluidtopics.net/r/ja-JP/yokohama/conversational-interfaces

 Release :

    - yokohama

ft:locale :

    - ja-JP

ft:publication_title :

    - Yokohama 対話型インターフェース

ft:clusterId :

    - convint

bundleId :

    - convint

workflow :

    - Platform


---

# ポータブル 仮想エージェント チャットウィジェットの構成

# ポータブル 仮想エージェント チャットウィジェットの構成 {#ariaid-title1}

* リリースバージョン: Yokohama
* 
* 更新日 2025年01月30日
* 
* ![](https://www.servicenow.com/docs/portal-asset/ico-clock) 所要時間：7分

サードパーティの Web ページで仮想エージェントを実行するようにポータブル仮想エージェントチャットウィジェットを設定します。

## 始める前に

注:  
Vancouver 以降の新規顧客のオンボーディングの場合、デフォルトでは認証されたユーザーのみがチャットウィジェットにアクセスできます。認証されていないユーザーがチャットウィジェットにアクセスできるようにするには、sn_va_web_client_app_embedページをパブリックアクセスで有効にする必要があります。詳細については、「[Make UI pages public or private](https://www.servicenow.com/docs/access?context=t_MakeAPagePublic&version=yokohama&pubname=yokohama-platform-security&ft:locale=en-US)」を参照してください。

必要なロール：アドミン

## このタスクについて

ServiceNow は、トップレベルドメインとドメイン名がチャットウィジェットをロードしているサイトと一致する場合にのみ、ポータブル 仮想エージェント をサポートします。SSO は、service-now.com URL を介してのみサポートされます。それを超える場合、カスタムソリューションと実装が必要です。

## 手順

1. \[すべて\] に移動してから、フィルターに「<kbd class="ph userinput">sys_properties.list</kbd>」と入力します。
2. システムプロパティ \[sys_properties\] テーブルで、com.glide.cs.embed.csp_frame_ancestors プロパティを名前で検索します。
3. プロパティ名をクリックしてフォームを開き、ディレクティブ値を指定します。  
   {#configure-portable-va-web-client__table_mny_mrp_ktb__entry__2}

   | フィールド | 説明 |
   |-|-|
   | タイプ | 文字列 これがデフォルト値です。 |
   | 値 | HTTP ヘッダーディレクティブのソース値：`Content-Security-Policy:frame-ancestors<source>` このプロパティは、Internet Explorer を除くほとんどの主要なブラウザーに適用されます。 以下を含む 1 つ以上のソースを指定します。 * 'self'：作成元が、提供されているページと同じであることを示します。たとえば、値が 'self' http://mywebsite.com の場合、iframe は親ドメインと mywebsite.com に埋め込まれます。これがデフォルト値です。 * host-source：外部 Web ページを埋め込むことができるドメイン。名前、IP アドレス、またはオプションの URL やポート番号によるインターネットホストサイトを指定します。サイトアドレスの先頭にワイルドカード (アスタリスク) 文字を使用できます。値の例：http://\*.example.com * scheme-source：スキーマ。例：http: または https: * none：一致する URL がありません。 {#configure-portable-va-web-client__ul_nny_mrp_ktb} |
   [ ]

   {#configure-portable-va-web-client__table_mny_mrp_ktb}
4. システムプロパティ \[sys_properties\] テーブルに戻り、com.glide.cs.embed.xframe_options プロパティを名前で検索します。
5. プロパティ名をクリックしてフォームを開き、ディレクティブ値を指定します。  
   {#configure-portable-va-web-client__table_mrd_5v5_4qbxxxxx__entry__2}

   | フィールド | 説明 |
   |-|-|
   | タイプ | 文字列 これがデフォルト値です。 |
   | 値 | ブラウザーがフレーム内に外部 Web ページをレンダリングできるかどうかを示す、X-Frame-Options ヘッダーディレクティブの値。 次のいずれかの値を指定します。 * sameorigin：ページ自体と同じ作成元を持つフレームにページを表示します。これがデフォルト値です。このプロパティは、Internet Explorer 11 などの古いブラウザーに適用されます。例の値：allow from https://example.com * deny：フレームにページを表示しません。 * allow-from uri：指定した作成元のフレームにのみ、ページを表示します。 注: この値は、最近のブラウザーでは機能しなくなっています。 {#configure-portable-va-web-client__ul_nrd_5v5_4qb} |
   [ ]

   {#configure-portable-va-web-client__table_mrd_5v5_4qbxxxxx}
6. ドメイン間でアクセスできるように REST API の CORS ルールを設定します。  
   このルールにより、Web ページ上のチャットウィジェットへのアクセスを提供する API を、セキュリティ上の制約なしで呼び出す権限が、指定した Web ドメインに付与されます。すべてのドメインは、共通の親ドメインを共有する必要があります。また、サポートするサブドメインごとに新しい CORS ルールを作成する必要があります。
   1. 移動先 すべてSystem Web ServicesRESTCORS ルール.
   2. \[新規\] をクリックします。
   3. フォームで、フィールドに入力します。  
      {#configure-portable-va-web-client__table_cvf_c5p_ktb__entry__2}

      | フィールド | 説明 |
      |-|-|
      | 名前 | ルールの一意の名前。 |
      | アプリケーション | アプリケーションのスコープデフォルト値は「グローバル」です。 |
      | REST API | REST API の名前。\[会話コンシューマーアカウント \[now/cs\]\] を選択します。 |
      | ドメイン | Web サイトのドメイン。例：https://mycompany.com Web サイトに複数のサブドメインがある場合は、それぞれに対して CORS ルールを作成する必要があります。たとえば、support.mycompany.com と products.mycompany.com には 2 つの別々の CORS ルールが必要です。 注: ワイルドカードは使用できません。 |
      | 最大経過時間 | クライアントセッションをキャッシュする秒数。最初の CORS 要求の後、指定された時間内に出された同じクライアントからの追加の要求には、プリフライトメッセージは必要ありません。 値を指定しない場合、デフォルト値の 0 は、すべての要求にプリフライトメッセージが必要であることを示します。 |
      [ ]

      {#configure-portable-va-web-client__table_cvf_c5p_ktb}
   4. \[HTTP メソッド\] タブで、\[GET\] を選択します。  
      ポータブルチャットウィジェットは要求のみを受信します。
   5. \[送信\] をクリックします。
   6. **オプション:** ポータブルチャットウィジェットを Web サイトの別のサブドメインに追加する場合は、これらの手順を繰り返します。
   {#configure-portable-va-web-client__substeps_jmp_vtp_ktb}
7. **オプション:** window.postMessage() メソッド (Web API) を使用して、ユーザーインターフェイスページで SSO 認証をトリガーし、指定したチャットウィジェットページにユーザーを戻すイベント条件を定義する JavaScript スクリプトを作成します。  
   ユーザーをチャットウィジェットページにリダイレクトするには、文字列 `"https://<your-instance>.service-now.com/sn_va_web_client_login.do?sysparm_redirect_uri=' + encodeURIComponent(<your-page>)` を使用します  
   注:  
   スクリプトを実行する前に、 com.glide.cs.web_client_login_redirect_urls システムプロパティを使用して、スクリプトで渡すことができる URL を指定します。リダイレクトは、プロパティ値に許可された URL を 1 つ以上指定した場合にのみ機能します。完全なリダイレクト URL または URL のホスト部分を指定します。例： <kbd class="ph userinput">https://example.com</kbd>。  
   スクリプト例

       <script>
           window.addEventListener("message", function(e) {
              // redirect to SSO login if the chat widget logs in but is logged in as a guest user(unauthenticated)
             if(e.data.type==="SESSION_CREATED" && e.data.authenticated === false)
               window.location.href = "https://<your-instance>.service-now.com/sn_va_web_client_login.do?sysparm_redirect_uri=<' + encodeURIComponent(<your-page>);
             
             // redirect to SSO login if the ServiceNow platform logs out from underneath the chat widget
             if(e.data.type==="SESSION_LOGGED_OUT")
               window.location.href = "https://<your-instance>service-now.com/"https://<your-instance>service-now.com/sn_va_web_client_login.do?sysparm_redirect_uri=' + encodeURIComponent(<your-page>);
           });
         </script>

   この例では、SESSION_CREATED または SESSION_LOGGED_OUT イベントが発生したときに、指定されたインスタンスで認証がトリガーされます。認証後 (ユーザーの SSO 認証情報が承認された場合)、com.glide.cs.web_client_login_redirect_urls プロパティにページ URL も指定している限り、`ユーザーは sn_va-web_client_login.do?sysparm_redirect_uri=' + encodeURIComponent(<your-page>)` で指定した埋め込みチャットウィジェットページにリダイレクトされます。

## 次のタスク

[サードパーティ Web サイトへのポータブル 仮想エージェント チャットウィジェットの追加](https://servicenow-prod.fluidtopics.net/ffCTY7byzw~GtzaLU4jMAw "サードパーティの Web ページで 仮想エージェント するためにポータブルチャットウィジェットを使用するには、必要なコードを Web ページに追加します。")に展開したカスタムモバイルアプリケーションを使用して管理しました。