使用 JavaScript 2.x 追蹤廣告 track-ads-on-javascript

下列指示提供使用 2.x SDK 實作的指引。

IMPORTANT
若您正在實作 SDK 1.x 版,您可以在此處下載 1.x 開發人員指南:下載 SDK。

廣告追蹤常數

常數名稱
說明
AdBreakStart
用於追蹤廣告插播開始事件的常數
AdBreakComplete
用於追蹤廣告插播事件的常數
AdStart
用於追蹤廣告開始事件的常數
AdComplete
用於追蹤廣告完成事件的常數
AdSkip
用於追蹤廣告略過事件的常數

實作步驟

  1. 識別廣告插播界限何時開始 (包括前段),並使用廣告插播資訊建立 AdBreakObject

    AdBreakObject 參考資料:

    table 0-row-3 1-row-3 2-row-3 3-row-3 3-align-center 7-align-center 11-align-center 15-align-center
    變數名稱 說明 必填
    name 廣告插播名稱,例如前段、中段和後段。
    position 廣告插播的編號位置從 1 開始。
    startTime 廣告插播開始時的播放點值。

    廣告插播物件建立:

    code language-js
    var adBreakObject =
      MediaHeartbeat.createAdBreakObject(<ADBREAK_NAME>,
                                         <POSITION>,
                                         <START_TIME>);
    
  2. MediaHeartbeat 例項中使用 AdBreakStart 呼叫 trackEvent() 以開始追蹤廣告插播。

    code language-js
    mediaHeartbeat.trackEvent(MediaHeartbeat.Event.AdBreakStart, adBreakObject);
    
  3. 識別廣告何時開始,並使用廣告資訊建立 AdObject 例項。

    AdObject 參考資料:

    table 0-row-3 1-row-3 2-row-3 3-row-3 4-row-3 3-align-center 7-align-center 11-align-center 15-align-center 19-align-center
    變數名稱 說明 必填
    name 廣告的易記名稱。
    adId 廣告的唯一識別碼。
    position 廣告插播中的廣告編號位置從 1 開始。
    length 廣告長度

    廣告物件建立:

    code language-js
    var adObject =
      MediaHeartbeat.createAdObject(<AD_NAME>,
                                    <AD_ID>,
                                    <POSITION>,
                                    <LENGTH>);
    
  4. 可選擇透過內容資料變數,將標準和/或廣告中繼資料附加到媒體追蹤工作階段。

    • 在 JavaScript 上實作標準廣告中繼資料

    • 自訂廣告中繼資料 - 對於自訂中繼資料,請建立自訂資料變數的變數物件,並填入目前廣告的資料:

      code language-js
      /* Set custom context data */
      var adCustomMetadata = {
          affiliate: "Sample affiliate",
          campaign: "Sample ad campaign",
          creative: "Sample creative"
      };
      
  5. MediaHeartbeat 例項中使用 AdStart 事件呼叫 trackEvent() 以開始追蹤廣告播放。

    將參考加入您的自訂中繼資料變數 (或空白物件),作為事件呼叫中的第三個參數:

    code language-js
    _onAdStart = function() {
        this._mediaHeartbeat.trackEvent(MediaHeartbeat.Event.AdStart,
                                        adObject,
                                        adCustomMetadata);
    };
    
  6. 當廣告播放達到廣告結尾時,請使用 AdComplete 事件呼叫 trackEvent()

    code language-js
    _onAdComplete = function() {
        this._mediaHeartbeat.trackEvent(MediaHeartbeat.Event.AdComplete);
    };
    
  7. 如果由於使用者選擇略過廣告而導致廣告播放未完成,請追蹤 AdSkip 事件:

    code language-js
    _onAdSkip = function() {
        this._mediaHeartbeat.trackEvent(MediaHeartbeat.Event.AdSkip);
    };
    
  8. 如果在相同 AdBreak 內有任何其他廣告,請再次重複步驟 3 到 7。

  9. 當廣告插播完成時,請使用 AdBreakComplete 事件進行追蹤:

    code language-js
    _onAdBreakComplete = function() {
        this._mediaHeartbeat.trackEvent(MediaHeartbeat.Event.AdBreakComplete);
    };
    

如需詳細資訊,請參閱追蹤案例具有前段廣告的 VOD 播放

recommendation-more-help
c8eee520-cef5-4f8c-a38a-d4952cfae4eb