対話プラットフォーム連携:Web サイト
一、設定画面に入る
1. 経路一:Webカスタマーサポート対話を追加する
左側メニューの「カスタマーサポート対話 > 対話プラットフォーム」をクリックし、右上の「+対話プラットフォームを連携」を選択して、プラットフォーム「Website」を選びます。
2. 経路二:AIアシスタントから対話プラットフォームを関連付ける
左側の機能欄で AI機能 → AIアシスタント の順に進み、設定するアシスタントを選択して、対話プラットフォームタブに切り替えます。調整するWeb対話プラットフォームを見つけ、プラットフォーム設定をクリックします。

設定が完了したら、ページ上部の AIアシスタント設定に戻るをクリックすると、元のアシスタントの 対話プラットフォームタブに戻ることができます。基本、クォータ、自動応答設定の間で切り替えても、この戻るボタンは引き続き表示されます。

利用シーン:Webカスタマーサポートの調整後にアシスタントへ戻る
カスタマーサポートの責任者が「製品相談アシスタント」のWebカスタマーサポート設定を更新するとします。このAIアシスタントの 対話プラットフォームタブで プラットフォーム設定をクリックし、調整が完了したら AIアシスタント設定に戻るをクリックします。同じアシスタントの対話プラットフォーム一覧に戻り、ほかのカスタマーサポート窓口の確認を続けられるため、AIアシスタント一覧から探し直す必要はありません。
3. 経路三:対話プラットフォームの操作
左側機能欄の「カスタマーサポート対話 > 対話プラットフォーム」で、設定したいAIアシスタントを選択し、「操作」アイコンをクリックすると、対話プラットフォームの構成画面に入ることができます。
二、基本設定
1. 基本設定
プラットフォーム名の設定
「プラットフォーム名」欄に、Webサイト上で表示したいAIアシスタントの名前を入力します
例:「カスタマーサポートアシスタント」「スマートアシスタント」など
AIアシスタントの選択
「AIアシスタント」のドロップダウンメニューで、使用するAIアシスタントを選択します
これにより、チャットルームでどのAIアシスタントが質問に回答するかが決まります
戻りURLの設定
「戻りURL」欄に、貴社のWebサイトのURLを入力します
ユーザーがチャットルームの戻るボタンをクリックすると、このURLに遷移します
公開URLの取得と利用
システムが自動的に「公開アクセスURL」を生成します
次の操作が可能です:
「コピー」ボタンをクリックしてURLをコピーする
「アクセス」ボタンをクリックして新しいウィンドウでチャットルームを開く
「埋め込み」ボタンをクリックして埋め込みコードを取得する
「埋め込みプレビュー」ボタンをクリックして埋め込み後の表示をプレビューする
埋め込みスクリプトの最適化
埋め込み方式を選択すると、システムは最適化された embed.js スクリプトを提供します。このスクリプトには以下の特長があります:
重複実行防止の仕組み:スクリプトが複数回読み込まれても、初期化は一度しか行われず、競合を防ぎます
より優れたエラーハンドリング:読み込みに失敗した際は、明確なエラーメッセージを表示し、デバッグを容易にします
読み込みパフォーマンスの最適化:スクリプトは最適化されており、Webサイトの読み込み速度に影響を与えません
互換性の向上:さまざまなWebサイト環境やフレームワークとの互換性がさらに高まっています
埋め込みのベストプラクティス:
埋め込みスクリプトは
</body>タグの直前に配置し、ページのメインコンテンツが先に読み込まれるようにします埋め込みスクリプトはページに一度だけ追加し、重複を避けます
SPA(Single Page Application)で使用する場合は、技術ドキュメントの高度な設定を参照してください
埋め込み方式の選択
「埋め込み」をクリックすると、ウィンドウ上部で 3 種類の埋め込み方式を切り替えることができます。
JavaScript:
<script>で読み込む最も一般的な方式で、読み込みと互換性を自動的に処理しますIframe:
<iframe>で直接埋め込む方式で、スクリプトを挿入できない環境に適していますMaiGPT:ChatGPT スタイルのフル対話インターフェース(左側に対話履歴 + 右側にメイン対話エリア)で、ページに常駐埋め込みするか、右下の浮動ボタンをクリックしてフルスクリーンで展開できます
MaiGPT を選択すると、左側で「埋め込みコンテナ(targetElement)」、「言語(locale)」、「タイトル(maigptTitle)」を調整でき、右側の コードプレビュー がリアルタイムで更新されます。「コピー」をクリックすれば、そのまま自社サイトに貼り付けられます。
埋め込みを許可するドメイン
この設定について
基本設定の「埋め込みを許可するドメイン」は、埋め込みの許可リストです。入力すると、リストに登録されたWebサイトのみがこのWeb Chatを埋め込めるようになり、その他のWebサイトに設置された埋め込みコードは機能しなくなります。
次のような場合に有効化することをおすすめします。
無断埋め込みの防止:第三者のWebサイトに埋め込みコードをコピーされ、カスタマーサポートボットをそのページに埋め込まれて対話クォータを消費されることを防ぎたい場合
セキュリティコンプライアンス:会社または顧客のセキュリティポリシーにより、このカスタマーサポートコンポーネントを読み込めるWebサイトの管理が求められる場合
動作
空(デフォルト)
制限されず、どのWebサイトでもこのWeb Chatを埋め込めます
空ではない
許可リストモード:ブラウザは他のドメインからの埋め込みをブロックし、SDKもその setup 呼び出しを拒否します
ブロックされたドメインに埋め込んだ場合:そのページのチャットコンポーネントは初期化を完了せず、訪問者は対話を開始できません
公開アクセスURLを直接開いた訪問者:この設定は「埋め込み」のみを制限します。公開URLからチャットページを直接開いた訪問者には影響しません
セキュリティの仕組みは「検証できない場合は拒否」:リストが空でない場合、オリジン検証に合格できない埋め込みはすべて拒否されます。これには、ドメインの入力ミスや、オリジン検証に対応していない古い埋め込みスクリプトを使用するページも含まれます
設定手順
ドメインを追加する
各項目には、正確なオリジン(https://example.com)またはワイルドカードドメイン(*.example.com。example.comとそのすべてのサブドメインに一致します)を指定できます。
✅ https://www.example.com
正確なオリジン:このURL(プロトコルを含む)のページのみ埋め込みを許可します
✅ *.example.com
ワイルドカードドメイン:example.comとそのすべてのサブドメイン(www、shop、blogなど)の埋め込みを許可します
❌ example.com
正確なオリジンにはプロトコルが必要です。https://がない場合は機能しません
❌ *.com
範囲が広すぎるため、すべての.com Webサイトに開放するのと同じになり、許可リストの意味が失われます
有効化前のチェックリスト
リストが空でなくなると、リストにないすべての埋め込みがブロックされます。「入力した直後にすべてブロックされる」状態を避けるため、有効化する前に次の項目を順番に確認してください。
このWeb Chatを埋め込むすべてのドメインを列挙する—本番環境、テスト環境、プレビュー環境を含め、漏れなく登録します
最新の埋め込みコードを再取得する—以前取得した埋め込みスクリプトはオリジン検証に対応しておらず、リストの有効化後に常に拒否される可能性があります。まず「埋め込み」を開いて新しいコードをコピーし、Webサイトを更新することをおすすめします
最初は追加のみ行い、削除しない:初めて有効化する際は、リストを整理しながらではなく、すべてのドメインを追加してから有効化します
一つずつ検証する:保存後、各埋め込みページで実際に対話を一度開始し、正常に動作することを確認します
復旧手段を確保する:有効化後に埋め込み側で対話を作成できない場合は、リストを空にして保存します。約1分待つと制限なしの状態に戻ります
よくある質問
Q:設定はどのくらいで反映されますか?
保存後、通常は約1分以内に反映されます。その後、開いている埋め込みページを再読み込みすると新しい設定が適用されます。
Q:サブドメインが多い場合、一つずつ登録する必要がありますか?
いいえ。*.example.comを1件登録すると、example.comとそのすべてのサブドメインに一致します。
Q:この設定で防げることと、防げないことは何ですか?
これは「埋め込みレイヤー」の保護です。他のWebサイトがこのWeb Chatをそのページに埋め込むことを防げます。ただし、認証機能ではありません。公開アクセスURLを知っているユーザーは、引き続きチャットページを直接開いて対話できます。「誰が対話できるか」を管理する必要がある場合は、ログイン設定も併用してください。
Q:設定を間違えて、すべての埋め込み側で対話できなくなった場合はどうすればよいですか?
「埋め込みを許可するドメイン」リストを空にして保存します。約1分待つと制限なしの状態に戻るため、ドメインの記述方法をもう一度確認してください。
2. 外観設定
企業ロゴのアップロード
「Logo」エリアのアップロードボタンをクリックします
貴社のロゴ画像ファイルを選択します
アップロード後はプレビューが表示され、クリックして削除し再アップロードできます
AIアシスタントのアバターのアップロード
「アバター」エリアのアップロードボタンをクリックします
適切なアバター画像を選択します
アップロード後はプレビューが表示され、クリックして削除し再アップロードできます
カラーテーマの設定
「テーマカラー」セレクターをクリックし、チャットルームウィンドウのタイトルの色を選択します
「タイトル文字色」セレクターをクリックし、タイトル文字の色を設定します
「AIアシスタント回答の背景色」セレクターをクリックし、AIの回答メッセージの背景色を設定します
テーマ切り替えの有効化
「テーマモード切り替え」スイッチをオンにします
ユーザーはライトテーマとダークテーマを切り替えることができます
3. 機能設定
有効化の設定
対話を開いてサービスを提供するかどうかを設定します
ファイルアップロードの設定
「ファイルアップロードを許可」スイッチをオンにします
ユーザーは画像やファイルなどをAIにアップロードして分析させることができます
引用文書の表示設定
「引用文書を表示」スイッチをオンにします
AIが回答する際に、参照した出典文書を表示します
引用文書のダウンロード許可の設定
「引用文書のダウンロードを許可」スイッチをオンにします
ユーザーは対話中にAIアシスタントが引用したファイルの内容をダウンロードできます
使用ツールおよび結果の表示設定
「使用ツールおよび結果を表示」スイッチをオンにします
システムは MCP または API による処理が進行中であることを表示します
4. インタラクション設定
冒頭メッセージの設定
冒頭メッセージの入力欄にウェルカムメッセージを入力します
例:「こんにちは!私はスマートカスタマーサポートです。何かお手伝いできることはありますか?」
「追加」ボタンをクリックして、冒頭メッセージをリストに加えます
複数の冒頭メッセージを追加でき、システムがランダムに選択します
削除する場合は、該当する項目の右側にある削除ボタンをクリックします
対話開始時の質問の設定
「対話開始時の質問」の入力欄に、あらかじめ用意する質問を入力します
例:「返品はどのように申請しますか?」「営業時間はいつですか?」
「追加」ボタンをクリックして、質問をリストに加えます
これらの質問は、ユーザーがクリックできるクイック選択肢として表示されます
削除する場合は、該当する項目の右側にある削除ボタンをクリックします
冒頭メッセージの選択肢をAgentのコンテキストに含める
「対話開始時の質問」の下に「冒頭メッセージの選択肢をAgentのコンテキストに含める」スイッチがあります(デフォルトはオフ)。オンにすると、システムは冒頭メッセージの本文と番号付きの選択肢リストをAIに提供し、ユーザーが数字や短い語句で選択肢に回答した場合も認識できるようにします。

オンにする前と後の違い
航空会社のカスタマーサポートを例に説明します。冒頭メッセージを「どのようなサポートが必要ですか?」に設定し、対話開始時の質問を「フライト照会」「手荷物規定」「会員マイル」の順に設定します。オンにすると、システムが順番に自動で番号を付けます。訪問者が「2」とだけ入力した場合の違いは次のとおりです。
訪問者に表示される画面
冒頭メッセージ+ランダムに選択された一部の開始時の質問
冒頭メッセージ+設定順にすべて表示される開始時の質問
AIが取得する情報
冒頭メッセージの本文のみで、選択肢リストは含まれません
冒頭メッセージの本文+番号付きの選択肢リスト
訪問者が「2」と回答した場合
AIは「2」がどの選択肢に対応するか分からず、「何について知りたいですか?」と聞き返す可能性があります
AIは「2」=手荷物規定と理解し、手荷物規定について直接回答します
開始時の質問の表示動作
ランダムに並べ替えられ、「ランダム表示件数」の制限を受けます
すべて設定順に表示され、「ランダム表示件数」の設定は適用されません
利用シーンの例
冒頭メッセージと複数の「対話開始時の質問」を組み合わせてメニュー形式の案内を作成し、訪問者に固定のサービス項目から選択してもらう場合に適しています。
金融/銀行:冒頭メッセージに「オンラインカスタマーサポートへようこそ。サービス項目を選択してください」を使用し、「口座残高照会」「クレジットカード申請状況」「保険契約照会」「担当者への転送」を対話開始時の質問に設定します。顧客が「3」と回答すると、AIは保険契約照会のフローを直接開始します
医療/クリニック:冒頭メッセージに「こんにちは。どのサービスが必要ですか?」を使用し、「診療時間照会」「診療予約」「診察進捗」「健康教育情報」を対話開始時の質問に設定します。利用者が「予約」などの短い語句で回答しても、AIは選択肢2に対応付けられます
行政/公共部門:冒頭メッセージに「申請する項目を選択してください」を使用し、「助成金申請」「イベント登録」「サービス拠点検索」を対話開始時の質問に設定します。市民が「1」と回答すると、AIは申請する助成金のカテゴリを続けて質問します
オンにすることをおすすめする場合
メニュー形式の案内:複数の「対話開始時の質問」を設定し、訪問者にシステムが表示する番号や短い語句で回答してもらい、固定のフローに沿って案内したい場合
✅ オンを推奨します
自由対話形式:一般的な挨拶(「こんにちは!何かお手伝いできることはありますか?」など)のみで、「対話開始時の質問」の選択肢を設定していない場合
❌ オンにする必要はありません。Tokenコストを節約できます
オンにした後の注意事項
「ランダム表示件数」の設定が適用されなくなります:訪問者に表示される番号とAIが理解する番号を一致させるため、オンにすると対話開始時の質問はランダムに並べ替えられず、表示件数も制限されません。常に設定順ですべて表示されます。現在「ランダム表示件数」の設定でレイアウトを調整している場合は、オンにする前に開始時の質問の数が多すぎないことを確認してください
Tokenコストが増加します:オンにすると黄色の警告が表示され、この機能によってリクエストごとのコンテキスト長(Tokenコスト)が増加することを通知します。選択肢が多いほど増加幅も大きくなるため、必要に応じてオンにしてください
5. ログイン設定
SSOログインソースの設定
MaiAgent は現在、Keycloak との統合により SSO(Single Sign-On)サービスを実現できます
「ログインソース」のドロップダウンメニューで切り替えます
認証方式として Maiagent または Keycloak を選択します
埋め込み側からログインせずに対話する
Web Chat を自社の Web サイトに埋め込み、ユーザーがすでにそのサイトにログインしている場合は、「埋め込み側で Source ID を使用したログイン不要の対話を許可」を有効にすると、ユーザーはすぐに対話できます。設定方法と署名連携については、連絡先の Source ID によるログイン不要の対話を参照してください。
三、自動応答設定
ここでは、ボットが応答する時間帯を設定できます。
日付の横にあるスイッチをクリックする:週のうちどの曜日に応答するかを選択します。
時間帯を設定する:開始時刻と終了時刻を選択します。
時間帯を追加する:複数の時間帯を設定したい場合は、「+時間帯を追加」を押して追加し、時間帯を設定できます。
最終更新
役に立ちましたか?


