與整合項目互動

整合功能會為您處理使用者互動。您只需要建構代理、視需要實作 Webhook,並設定整合功能。

本指南說明如何使用 Dialogflow CX Messenger 整合功能,為代理提供簡單的文字對話使用者介面。

事前準備

如果您不打算使用整合功能,可以略過這份快速入門導覽課程。

閱讀本指南之前,請先完成下列工作:

  1. 請參閱流程基本概念。
  2. 執行設定步驟。
  3. 按照使用流程建構代理快速入門指南中的步驟操作。以下步驟會繼續使用同一個代理。如果該代理已不存在,可以下載代理並還原。

設定

如要設定未經驗證的 Dialogflow CX Messenger 代理存取權,請按照下列步驟操作:

  1. 前往 Dialogflow CX 控制台。
  2. 選擇 Google Cloud 專案。
  3. 選取代理程式。
  4. 選取「管理」分頁標籤。
  5. 按一下左側側欄選單中的「整合」。
  6. 按一下「Dialogflow CX Messenger」上的「連結」。
  7. 設定對話方塊隨即開啟。
  8. 如果先前已為這個代理程式設定整合,您會看到可嵌入的 HTML 程式碼。無論您要驗證或不驗證,請按一下對話方塊底部的「Disable...」(停用...) 按鈕,以便在下一個步驟中重新設定。
  9. 選取「Environment」(環境)。
  10. 選取「Unauthenticated API」。
  11. 選取樣式。
  12. 視需要限制網域存取權。
  13. 按一下「Enable the unauthenticated API」。
  14. 對話方塊會顯示可嵌入網站的 HTML 程式碼。複製這組代碼。
  15. 按一下「完成」。

嵌入

將上述複製的內嵌程式碼貼到網站網頁中。 <script> 和 <df-messenger> HTML 元素應位於網頁的 <body> 元素中。

如果您使用經過驗證的整合功能,請將 <df-messenger> 的 oauth-client-id 屬性設為 OAuth 用戶端 ID。如要使用使用者身分進行工具驗證,請將 access-token-name 屬性設為任何名稱。然後使用值為 $session.params.ACCESS_TOKEN_NAME 的不記名權杖進行工具驗證。

更新其他需要更新的屬性。

如要允許回應式版面配置,請在 <head> 元素中加入以下內容:

<meta name="viewport" content="width=device-width, initial-scale=1">

嵌入後,只要點選右下角的對話圖示,即可透過網頁與代理互動。

Messenger 介面螢幕截圖

自訂

您可以透過多種方式自訂這個使用者介面的外觀和行為。詳情請參閱 Dialogflow CX Messenger 說明文件。