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 執行要求一樣。

引數：

  • 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 API，並等待回應。這可有效模擬通常提供給服務專員對話方塊的使用者輸入內容。系統會以任何使用者的查詢方式處理回應。

引數：

  • string：文字查詢

退貨：

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

例如：

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

sendRequest

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

引數：

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

退貨：

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

例如：

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

setQueryParameters

這個函式會為 Dialogflow 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，以便向使用者顯示。這項資訊會在工作階段的其餘時間持續存在。

引數：

  • 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();