Web擴充功能的事件型別

上次更新: 2023-05-25
  • 主題:
  • Tags
    檢視有關此主題的更多資訊
  • 建立對象:
  • Developer
    User
    Admin
    Leader
注意

Adobe Experience Platform Launch已經過品牌重塑,現在是Adobe Experience Platform中的一套資料收集技術。 因此,所有產品文件中出現了幾項術語變更。 如需術語變更的彙整參考資料,請參閱以下文件

在標籤規則中,事件是指為了讓規則觸發而必須發生的活動。 例如,網頁擴充功能可提供「手勢」事件型別,用來監視特定滑鼠或觸控手勢的發生。 一旦該手勢發生,事件邏輯就會引發規則。

事件型別程式庫模組的設計用途是偵測活動是否發生,然後呼叫函式以觸發相關規則。 偵測到的事件是可自訂的。 例如,可以偵測使用者何時做出特定手勢、快速捲動或互動某物。

本文介紹如何在Adobe Experience Platform中定義Web擴充功能的事件型別。

注意

本檔案假設您熟悉程式庫模組,以及如何將這些模組整合在Web擴充功能中。 回到本指南之前,請先參閱程式庫模組格式化概述文件,概略了解其實作方式。

事件型別由擴充功能定義,通常包含下列專案:

  1. A 檢視 顯示在Experience PlatformUI和資料收集UI中,可讓使用者修改事件的設定。
  2. 在標籤執行階段程式庫內發出的程式庫模組,用於解譯設定並監視特定活動的發生。

module.exports 同時接受 settingstrigger 引數。 如此可讓您自訂事件型別。

module.exports = function(settings, trigger) { … };
參數 說明
settings 此物件內含使用者在事件類型檢視中設定的任何設定。至於要在此物件中納入哪些項目,由您全權掌控。
trigger 模組在規則引發時所應呼叫的函數。彼此之間有一對一的關係 settings 物件, a trigger 函式與規則。 這表示您針對一個規則收到的觸發程式函式,無法用來引發另一個規則。
注意

對於已設定為要使用事件類型的每個規則,匯出的函數將會呼叫一次。

以經過5秒的活動為例,經過5秒後,活動已發生並將觸發規則。 模組看起來會類似於此範例。

module.exports = function(settings, trigger) {
  setTimeout(trigger, 5000);
};

如果您想讓Adobe Experience Platform使用者能夠設定持續時間,則需要輸入持續時間並儲存至設定物件的選項。 該物件可能如下所示:

{
  "duration": 25000
}

若要運用於使用者定義的持續時間,需要更新模組以包含此項。

module.exports = function(settings, trigger) {
  setTimeout(trigger, settings.duration);
};

傳遞內容事件資料

觸發規則時,就發生的事件提供其他詳細資訊通常有其效用。 建立規則的使用者可利用這項資訊來達成特定行為。例如,如果行銷人員想要建立每當使用者滑動畫面時就會傳送分析信標的規則。 擴充功能必須提供 swipe 事件型別,讓行銷人員可以使用此事件型別來觸發適當的規則。 假設行銷人員想要納入指標上發生撥動時的角度,這很難在不提供其他資訊的情況下完成。 若要就發生的事件提供其他相關資訊,請在呼叫 trigger 函數時傳遞一個物件。例如:

trigger({
  swipeAngle: 90 // the value would be the detected angle
});

行銷人員隨後可藉由在文字欄位中指定 %event.swipeAngle% 值,在分析信標上使用此值。他們也可以從其他內容 (例如自訂程式碼動作) 中存取 event.swipeAngle。也有可能包含其他型別的選擇性事件資訊,這些資訊可能以相同的方式對行銷人員很有用。

nativeEvent

如果您的事件型別以原生事件為基礎(例如,如果您的擴充功能提供 click 事件型別),建議設定 nativeEvent 屬性,如下所示。

trigger({
  nativeEvent: nativeEvent // the value would be the underlying native event
});

這對於嘗試從原生事件存取任何資訊 (例如游標座標) 的行銷人員,可能有其效用。

element

如果元素與發生的事件之間有強烈的關係,建議設定 element 屬性至元素的DOM節點。 例如,如果您的擴充功能提供 click 事件型別且您允許行銷人員加以設定,唯有當ID為的元素時才會觸發規則 herobanner 「 」已選取。 在此情況下,如果使用者選取主圖橫幅,建議呼叫 trigger 並設定 element 至主圖橫幅的DOM節點。

trigger({
  element: element // the value would be the DOM node
});

遵循規則順序

標籤讓使用者能夠排序規則。 例如,使用者可建立兩個規則,這兩個規則都使用orientation-change事件型別,並自訂規則引發的順序。 假設Adobe Experience Platform使用者指定的順序值為 2 規則A中的方向變更事件和順序值 1 規則B中的方向變更事件。這表示當行動裝置上的方向變更時,規則B應在規則A之前引發(具有低階值的規則會先引發)。

如前所述,對於已設定為要使用事件類型的每個規則,匯出的函數將在事件模組中呼叫一次。每次呼叫匯出的函數時,都會傳遞一個與特定規則繫結的唯一 trigger 函數。在剛才說明的案例中,匯出的函式將會使用呼叫一次 trigger 繫結至規則B的函式,然後使用 trigger 繫結至規則A的函式。規則B會先出現,因為使用者為其指定的順序值比規則A低。當程式庫模組偵測到方向變更時,請務必呼叫 trigger 函式會依照提供給程式庫模組的相同順序執行。

在以下範例程式碼中應留意,當偵測到方向變更時,觸發函數將會按照其提供至匯出函數時的順序進行呼叫:

var triggers = [];

window.addEventListener('orientationchange', function() {
  triggers.forEach(function(trigger) {
    trigger();
  });
});

module.exports = function(settings, trigger) {
  triggers.push(trigger);
};

這可確實保留使用者指定的順序。

若以不同的順序呼叫觸發函數,將是不當的實作:

var triggers = [];

window.addEventListener('orientationchange', function() {
  for (var i = triggers.length - 1; i >= 0; i--) {
    triggers[i]();
  }
});

module.exports = function(settings, trigger) {
  triggers.push(trigger);
};

自然程式設計實務準則通常會維持正確的順序,但仍須了解其影響並據此進行開發。

本頁內容