從at.js 1.x​升級為at.js 2.x

Adobe Target 中的最新版 at.js 提供豐富的功能，讓貴公司能以新世代用戶端技術為基礎進行個人化。 本次的新版本著重於升級 at.js，進而與單一頁面應用程式 (SPA) 產生和諧互動。

以下是幾個使用at.js 2.x​特有（舊版未提供）的優點：

at.js 2.x​系統圖表

下列圖表可協助您瞭解at.js 2.x​搭配檢視的工作流程，以及如何藉由這套工作流程增強SPA整合。 若要更詳細地瞭解at.js 2.x​中使用的概念，請參閱單頁應用程式實作。

（按一下影像可展開至完整寬度。）

{modal="regular"}的Target流程

現在，SPA 上只要是有實作 triggerView() 的位置，系統都會從快取擷取檢視和動作並向使用者顯示，不需要伺服器呼叫。 triggerView() 也會對 Target 後端發出通知要求，以便增加和記錄曝光計數。

（按一下影像可展開至完整寬度。）

{modal="regular"}

部署at.js 2.x

透過Adobe Experience Platform擴充功能中的標籤部署at.js 2.x。

棄用的 at.js 函數

at.js 2.x​已棄用多個函式。

已棄時的函數及其對應的新函數如下所列。 如需完整的函數清單，請參閱 at.js 函數。

mboxCreate(mbox,params)

說明:

執行要求並將產品建議套用至具有 mboxDefault 類別名稱的最接近 DIV。

範例:

<div class="mboxDefault">
  default content to replace by offer
</div>
<script>
  mboxCreate('mboxName','param1=value1','param2=value2');
</script>

at.js 2.x對等專案

mboxCreate(mbox, params) 的替代函數為 getOffer() 和 applyOffer()。

範例:

<div class="mboxDefault">
  default content to replace by offer
</div>
<script>
  var el = document.currentScript.previousElementSibling;
  adobe.target.getOffer({
    mbox: "mboxName",
    params: {
      param1: "value1",
      param2: "value2"
    },
    success: function(offer) {
      adobe.target.applyOffer({
        mbox: "mboxName",
        selector: el,
        offer: offer
      });
    },
    error: function(error) {
      console.error(error);
      el.style.visibility = "visible";
    }
  });
</script>

mboxDefine() 和 mboxUpdate()

說明:

在元素與 mbox 名稱之間建立內部對應，但是不執行要求。 與 mboxUpdate() 搭配使用，會執行要求並將產品建議套用至 mboxDefine() 中的 nodeId 所識別的元素。 也可用來更新 mboxCreate 起始的 mbox。

範例:

<div id="someId" class="mboxDefault"></div>
<script>
 mboxDefine('someId','mboxName','param1=value1','param2=value2');
 mboxUpdate('mboxName','param3=value3','param4=value4');
</script>

at.js 2.x對等專案：

mboxDefine() 和 mboxUpdate 的替代函數為 getOffer() 和 applyOffer()，而 applyOffer() 中會使用選取器選項。 此做法可讓您使用任何 CSS 選取器將產品建議對應至元素，而非只能使用帶有 ID 的選取器。

範例:

<div id="someId" class="mboxDefault">
  default content to replace by offer
</div>
<script>
  adobe.target.getOffer({
    mbox: "mboxName",
    params: {
      param1: "value1",
      param2: "value2",
      param3: "value3",
      param4: "value4"
    },
    success: function(offer) {
      adobe.target.applyOffer({
        mbox: "mboxName",
        selector: "#someId",
        offer: offer
      });
    },
    error: function(error) {
      console.error(error);
      var el = document.getElementById("someId");
      el.style.visibility = "visible";
    }
  });
</script>

adobe.target.registerExtension()

說明:

提供標準方式來註冊特定的延伸模組。

此函數不再受支援且不應使用。

2.x​中已棄用、新增和支援的at.js函式摘要

限制和圖說

請留意下列限制和圖說:

轉換追蹤

客戶使用 mboxCreate() 追蹤轉換時必須使用 trackEvent() 或 getOffer()。

產品建議傳送

客戶若沒有將 mboxCreate() 取代為 getOffer() 或 applyOffer()，產品建議可能不會傳送。

若某些頁面上具有at.js 1.x，那麼可以在其他頁面上使用at.js 2.x​嗎？

可以，使用不同版本和資料庫的頁面中會保留訪客輪廓。 Cookie 格式相同。

at.js 2.x​使用的新API

at.js 2.x​使用新的API，我們稱之為「傳送API」。 若要針對at.js是否正確呼叫Target Edge伺服器進行除錯，您可以將瀏覽器上「開發人員工具」的「網路」索引標籤篩選為「傳送」、「tt.omtrdc.net」或您的使用者端代碼。 您也會發現 Target 傳送的是 JSON 裝載而非機碼值組。

Target全域mbox已不再使用

在at.js 2.x​中，網路呼叫中不會再出現「target-global-mbox」。 我們已改為將傳送至Target伺服器的JSON裝載中的"target-global-mbox"語法取代為"execute > pageLoad"，如下所示：

{
  "id": {
    // ...
  },
  "context": {
    "channel": "web",
    // ...
  },
  "execute": {
    "pageLoad": {}
  }
}

基本上，推出全域 mbox 概念的目的，是用來告知 Target 是否要在頁面載入時擷取產品建議和內容。 因此我們在最新版本中讓這個用途更加明確。

at.js 中的全域 mbox 名稱仍重要嗎?

客戶可以透過​Target > 管理 > 實作 > 編輯at.js設定​來指定全域mbox名稱。 此設定供 Target Edge 伺服器用來將 execute > pageLoad 轉譯為 Target UI 中顯示的全域 mbox 名稱。 這麼做可讓客戶繼續使用伺服器端 API、表單式撰寫器、輪廓指令碼，以及使用全域 mbox 名稱建立客群。 強烈建議您也務必在​管理 > 視覺化體驗撰寫器​頁面上設定相同的全域mbox名稱，以防仍有頁面使用at.js 1.x，如下列圖例所示。

和

需要為at.js 2.x​開啟自動建立全域mbox設定嗎？

在大多數情況下需要。 此設定可告知at.js 2.x​在頁面載入時向Target邊緣伺服器觸發要求。 由於全域 mbox 已轉譯為 execute > pageLoad，因此如果您想在頁面載入時觸發要求，便應開啟此設定。

即使沒有從at.js 2.x​指定Target全域mbox名稱，現有的VEC活動仍會繼續運作嗎？

會，因為 execute > pageLoad 在 Target 後端上的處理方式如同 target-global-mbox。

如果我的表單式活動目標鎖定為 target-global-mbox，這些活動是否仍會繼續運作?

會，因為 execute > pageLoad 在 Target Edge 伺服器上的處理方式如同 target-global-mbox。

支援和不支援的at.js 2.x​設定

at.js 2.x中的跨網域追蹤支援

跨網域追蹤能夠拼接不同網域之間的訪客。 由於必須為各個網域建立新 Cookie，因此在訪客從某個網域導覽至另一個網域時，就很難加以追蹤。 為實現跨網域追蹤，Target 使用第三方 Cookie 來追蹤網域之間的訪客。 這可讓您建立橫跨siteA.com和siteB.com的Target活動，而且當訪客在各個唯一網域導覽時，訪客會維持相同的體驗。 此功能與Target的第三方和第一方Cookie行為整合。

在Target中，協力廠商Cookie儲存在<CLIENTCODE>.tt.omtrdc.net中。 第一方 Cookie 會儲存在 clientdomain.com 中。 第一個要求會傳回 HTTP 回應標頭，此標頭嘗試設定名為 mboxSession 和 mboxPC 的第三方 Cookie，之後傳回附有額外參數 (mboxXDomainCheck=true) 的重新導向要求。 若瀏覽器接受第三方 Cookie，則重新導向請求會包含這些 Cookie 並傳回體驗。 這個工作流程之所以可行，是因為我們使用 HTTP GET 方法。

不過，在at.js 2.x​中，並未使用HTTP GET。 而是透過at.js 2.x​使用HTTP POST將JSON裝載傳送至Target部Edge伺服器。 使用HTTP POST表示檢查瀏覽器是否支援第三方Cookie的重新導向要求將中斷。 這是因為 HTTP GET 要求為等冪交易，而 HTTP POST 是非等冪交易且不得任意重複。 因此，不支援立即使用at.js 2.x （2.10之前）進行跨網域追蹤。 只有at.js 1.x​才有跨網域追蹤的立即可用支援。

若要針對at.js v2.10或更新版本使用跨網域追蹤，您可以執行下列其中一項作業：

若要對2.10之前的at.js v2.x​版本使用跨網域追蹤，您可以實作上述選項#1 （安裝ECID程式庫）。

支援自動建立全域 mbox

此設定可告知at.js 2.x​在頁面載入時向Target邊緣伺服器觸發要求。 由於全域 mbox 已轉譯為 execute > pageLoad，且會由 Target Edge 伺服器加以解譯，因此顧客如果希望在頁面載入時觸發要求，便應開啟此功能。

支援全域 mbox 名稱

客戶可以透過​Target > 管理 > 實作 > 編輯​指定全域mbox名稱。 此設定供 Target Edge 伺服器用來將 execute > pageLoad 轉譯為輸入的全域 mbox 名稱。 這麼做可讓客戶繼續使用伺服器端 API、表單式撰寫器、輪廓指令碼，以及建立鎖定全域 mbox 為目標的客群。

以下 at.js 自訂事件適用於 triggerView()，還是僅適用於 applyOffer() 或 applyOffers()?

是的，at.js 自訂事件也適用於 triggerView()。

它表示當我使用&lbrace；"page" : "true"&rbrace；呼叫triggerView()時，它會傳送通知至Target後端並增加曝光次數。 那麼也會造成輪廓指令碼執行嗎?

對 Target 後端發出預先擷取呼叫時，會執行輪廓指令碼， 接著會加密受影響的輪廓資料，然後傳回用戶端。 叫用含有 {"page": "true"} 的 triggerView() 後，會傳送通知並附上加密的輪廓資料。 此時 Target 後端會將輪廓資料解密並儲存至資料庫中。

呼叫 triggerView() 之前需要新增預先隱藏程式碼以處理忽隱忽現情況嗎?

不需要，您不需要在呼叫 triggerView() 之前新增預先隱藏程式碼。 at.js 2.x​會在顯示和套用檢視之前，處理預先隱藏和忽隱忽現邏輯。

at.js 2.x​不支援建立對象的at.js 1.x​引數？

使用at.js 2.x​時，下列at.js 1.x引數目前不支援對象建立​NOT：

at.js 2.x​不支援使用vst.*引數建立對象

at.js 1.x​的客戶可以使用vst.* mbox引數建立對象。 這是at.js 1.x​傳送mbox引數至Target後端時的意外副作用。 移轉至at.js 2.x​後，您無法再使用這些引數建立對象，因為at.js 2.x​傳送mbox引數的方式不同。

at.js 相容性

下表說明 at.js。 2.x​與不同活動型別、整合、功能和at.js函式的相容性。

活動類型

整合

功能

查詢字串參數

回應 Token

at.js 2.x，就像at.js 1.x​一樣，會使用自訂事件at-request-succeeded來顯示回應Token。 如需使用 at-request-succeeded 自訂事件的程式碼範例，請參閱回應 Token。

at.js 1.x​引數至at.js 2.x​裝載對應

本節概述at.js 1.x​與at.js 2.x​之間的對應。

探索參數對應之前，請注意這些資料庫版本使用的端點已變更:

另一項顯著差異為:

以下區段列出每個at.js 1.x​引數、其說明，以及相對應的2.x JSON裝載（若適用）：

at_property

（at.js 1.x​引數）

用於企業使用者權限。

{
  ....
  "property": {
    "token": "1213213123122313121"
  }
  ....
}

mboxHost

（at.js 1.x​引數）

Target資料庫執行所在頁面的網域。

at.js 2.x JSON裝載：

{
  "context": {
    "browser": {
       "host": "test.com"
    }
  }
}

webGLRenderer

（at.js 1.x​引數）

瀏覽器的 WEB GL 轉譯器功能 我們的裝置偵測機制會使用此功能，判斷訪客的裝置是否為桌上型電腦、iPhone、Android 裝置等。

at.js 2.x JSON裝載：

{
  "context": {
    "browser": {
       "webGLRenderer": "AMD Radeon Pro 560X OpenGL Engine"
    }
  }
}

mboxURL

（at.js 1.x​引數）

頁面 URL。

at.js 2.x JSON裝載：

{
  "context": {
    "address": {
       "url": "http://test.com"
    }
  }
}

mboxReferrer

（at.js 1.x​引數）

頁面轉介者。

at.js 2.x JSON裝載：

{
  "context": {
    "address": {
       "referringUrl": "http://google.com"
    }
  }
}

mbox (名稱) 等於全域 mbox

（at.js 1.x​引數）

傳遞 API 已無全域 mbox 概念。 在 JSON 裝載中，您必須使用 execute > pageLoad。

at.js 2.x JSON裝載：

{
  "execute": {
    "pageLoad": {
       "parameters": ....
       "profileParameters": ...
       .....
    }
  }
}

mbox (名稱) 不​等於全域 mbox

（at.js 1.x​引數）

若要使用 mbox 名稱，請將其傳遞至 execute > mboxes。 mbox 需要索引和名稱。

at.js 2.x JSON裝載：

{
  "execute": {
    "mboxes": [{
       "index": 0,
       "name": "some-mbox",
       "parameters": ....
       "profileParameters": ...
       .....
    }]
  }
}

mboxId

（at.js 1.x​引數）

已不再使用。

mboxCount

（at.js 1.x​引數）

已不再使用。

mboxRid

（at.js 1.x​引數）

下游系統用來協助進行偵錯的要求 ID。

at.js 2.x JSON裝載：

{
  "requestId": "2412234442342"
  ....
}

mboxTime

（at.js 1.x​引數）

已不再使用。

mboxSession

（at.js 1.x​引數）

工作階段 ID 會以查詢字串參數 (sessionId) 的形式傳送至傳送 API 端點。

mboxPC

（at.js 1.x​引數）

TNT ID 會傳遞至 id > tntId。

at.js 2.x JSON裝載：

{
  "id": {
    "tntId": "ca5ddd7e33504c58b70d45d0368bcc70.21_3"
  }
  ....
}

mboxMCGVID

（at.js 1.x​引數）

Marketing Cloud 訪客 ID 會傳遞至 id > marketingCloudVisitorId。

at.js 2.x JSON裝載：

{
  "id": {
    "marketingCloudVisitorId": "797110122341429343505"
  }
  ....
}

vst.aaaa.id和vst.aaaa.authState

（at.js 1.x​引數）

客戶 ID 應傳遞至 id > customerIds。

at.js 2.x JSON裝載：

{
  "id": {
    "customerIds": [{
       "id": "1232131",
       "integrationCode": "aaaa",
       "authenticatedState": "....."
     }]
  }
  ....
}

mbox3rdPartyId

（at.js 1.x​引數）

用來連結不同Target ID的客戶協力廠商ID。

at.js 2.x JSON裝載：

{
  "id": {
    "thirdPartyId": "1232312323123"
  }
  ....
}

mboxMCSDID

（at.js 1.x​引數）

SDID (也稱為補充資料 ID)。 應傳遞至 experienceCloud > analytics > supplementalDataId。

at.js 2.x JSON裝載：

{
  "experienceCloud": {
    "analytics": {
      "supplementalDataId": "1212321132123131"
    }
  }
  ....
}

vst.trk

（at.js 1.x​引數）

Analytics追蹤伺服器 應傳遞至 experienceCloud > analytics > trackingServer。

at.js 2.x JSON裝載：

{
  "experienceCloud": {
    "analytics": {
      "trackingServer": "analytics.test.com"
    }
  }
  ....
}

vst.trks

（at.js 1.x​引數）

Analytics 追蹤伺服器安全。 應傳遞至 experienceCloud > analytics > trackingServerSecure。

at.js 2.x JSON裝載：

{
  "experienceCloud": {
    "analytics": {
      "trackingServerSecure": "secure-analytics.test.com"
    }
  }
  ....
}

mboxMCGLH

（at.js 1.x​引數）

Audience Manager 位置提示。 應傳遞至 experienceCloud > audienceManager > locationHint。

at.js 2.x JSON裝載：

{
  "experienceCloud": {
    "audienceManager": {
      "locationHint": 9
    }
  }
  ....
}

mboxAAMB

（at.js 1.x​引數）

Audience Manager Blob。 應傳遞至 experienceCloud > audienceManager > blob。

at.js 2.x JSON裝載：

{
  "experienceCloud": {
    "audienceManager": {
      "blob": "2142342343242342"
    }
  }
  ....
}

mboxVersion

（at.js 1.x​引數）

版本會透過版本參數以查詢字串參數的形式傳送。

訓練影片： at.js 2.x​架構圖表

at.js 2.x​增強了Adobe Target對SPA的支援，並與其他Experience Cloud解決方案整合。 本影片說明整合方式。

如需詳細資訊，請參閱瞭解at.js 2.x​的運作方式。