Dialogflow CX Messenger JavaScript

Dialogflow CX Messenger 提供可呼叫的函式，可影響其行為。

renderCustomText

這個函式會顯示簡單的訊息，就像是代理程式傳送的簡單文字回應，或是使用者輸入的內容。

引數：

  • string：簡訊
  • boolean：如果是來自代理程式的訊息，則為 true；如果是來自使用者的訊息，則為 false

退貨：

  • void

例如：

const dfMessenger = document.querySelector('df-messenger');
dfMessenger.renderCustomText('Custom text', true);

renderCustomCard

這個函式會算繪自訂資訊卡，就像是來自 Dialogflow CX 執行要求一樣。

引數：

  • payload：自訂酬載回應清單，定義於「執行要求」部分。

退貨：

  • void

例如：

const dfMessenger = document.querySelector('df-messenger');
const payload = [
  {
    "type": "info",
    "title": "Info item title",
    "subtitle": "Info item subtitle",
    "image": {
      "rawUrl": "https://example.com/images/logo.png"
    },
    "anchor": {
      "href": "https://example.com",
      "target": "_blank"
    }
  }
];
dfMessenger.renderCustomCard(payload);

sendQuery

這個函式會將查詢傳送至 Dialogflow CX API，並等待回應。這項功能可有效模擬一般提供給代理程式對話方塊的使用者輸入內容。系統會像處理一般使用者的查詢一樣處理回覆。

引數：

  • string：文字查詢

退貨：

  • Promise<void>：非同步作業的回傳值

例如：

const dfMessenger = document.querySelector('df-messenger');
dfMessenger.sendQuery('Describe shipping costs.');

sendRequest

這個函式會將要求傳送至 Dialogflow CX API，並等待回應。

引數：

  • string：要求類型，支援 query (另請參閱sendQuery 上方) 和 event (請參閱自訂事件)
  • any：對應要求類型的酬載，目前支援的兩種要求類型都是字串

退貨：

  • Promise<void>：非同步作業的回傳值

例如：

const dfMessenger = document.querySelector('df-messenger');
dfMessenger.sendRequest('query', 'Describe shipping costs.');

setQueryParameters

這個函式會為 Dialogflow CX API detectIntent 要求的 queryParams 欄位設定預設值。其他 Dialogflow CX Messenger 方法可能會取代查詢參數中的相應預設值。

引數：

  • object：JSON 資料。如需查詢參數的結構定義，請參閱 QueryParameters

退貨：

  • void

例如：

const dfMessenger = document.querySelector('df-messenger');
const queryParameters = {
  parameters: {
  timeZone: "America/New_York"
  }
};
dfMessenger.setQueryParameters(queryParameters);

setContext

這項函式會將使用者的生成式個人化資訊傳送至 Dialogflow CX。這項資訊會在工作階段期間保留。

引數：

  • object：JSON 資料，請參閱生成式個人化說明文件

退貨：

  • void

例如：

const dfMessenger = document.querySelector('df-messenger');
const metadata = {
  "subscription plan": "Business Premium Plus",
  "devices owned": [
    {
      model: "Google Pixel 7",
    },
    {
      model: "Google Pixel Tablet",
    },
  ],
};
dfMessenger.setContext(metadata);

clearStorage

這項函式會清除代理程式對話的永久儲存空間。這項操作也會清除代理程式對話的目前狀態。預設會保留使用者的驗證狀態。如要自訂這項行為，請使用選用的 args。

引數：

名稱 類型 說明
args object? 選用引數，可設定清除儲存空間作業。
args.clearAuthentication boolean? 清除驗證狀態的選用旗標。如果設為 true，系統會清除驗證狀態，否則會保留。

退貨：

  • void

例如：

const dfMessenger = document.querySelector('df-messenger');
dfMessenger.clearStorage();

clearAuthentication

這項函式會清除代理程式對話的驗證。

引數：

  • 無

退貨：

  • void

例如：

const dfMessenger = document.querySelector('df-messenger');
dfMessenger.clearAuthentication();

startNewSession

這項函式會在服務專員對話方塊中啟動新工作階段。根據預設，這項作業會清除訊息記錄，但保留使用者的驗證狀態。如要自訂這項行為，請使用選用的 args。

引數：

名稱 類型 說明
args object? 用於設定新工作階段建立作業的選用引數。
args.retainHistory boolean? 保留記錄的選用旗標。如果設為 true，系統會保留記錄，否則會清除記錄。
args.clearAuthentication boolean? 清除驗證狀態的選用旗標。如果設為 true，系統會清除驗證狀態，否則會保留。

退貨：

  • void

例如：

const dfMessenger = document.querySelector('df-messenger');
dfMessenger.startNewSession({ retainHistory: true });

openChat

這項功能會開啟即時通訊。在 df-messenger-chat-bubble 元素上呼叫，即可開啟即時通訊。如果即時通訊已開啟，系統不會有任何動作。

引數：

  • 無

退貨：

  • void

例如

const dfMessengerBubble = document.querySelector('df-messenger-chat-bubble');
dfMessengerBubble.openChat();

closeChat

這項功能會關閉即時通訊。在 df-messenger-chat-bubble 元素上呼叫，即可關閉對話。如果對話已關閉，系統不會有任何動作。

引數：

  • 無

退貨：

  • void

例如

const dfMessengerBubble = document.querySelector('df-messenger-chat-bubble');
dfMessengerBubble.closeChat();

openMinChat

Dialogflow CX Messenger 縮小對話視窗

這項功能會開啟縮小版的即時通訊視窗。在 df-messenger-chat-bubble 元素上呼叫，即可開啟縮小的對話。如果對話已縮到最小，則不會有任何動作。

引數：

名稱 類型 說明
args object? 設定縮小對話視窗的選用引數
args.anchor string? (選用) anchor 可設定開啟縮小對話視窗的位置。與即時通訊泡泡元素上的 anchor 屬性相同。預設值為 left-top。
args.showActorImages boolean? 選用旗標，可顯示演員圖片 (如在 df-messenger-chat-bubble 元素中指定)。預設值為 false。

範例：

const dfMessengerChatBubble = document.querySelector('df-messenger-chat-bubble');
dfMessengerChatBubble.openMinChat({
  anchor: 'top-left'
});

closeMinChat

關閉縮到最小的對話。在 df-messenger-chat-bubble 元素上呼叫此函式，即可關閉縮到最小的對話。如果對話已關閉，系統不會有任何動作。

範例：

const dfMessengerChatBubble = document.querySelector('df-messenger-chat-bubble');
dfMessengerChatBubble.closeMinChat();