使用Edge Decisioning API傳遞優惠方案 edge-decisioning-api
快速入門與必要條件 edge-overview-and-prerequisites
Adobe Experience Platform Web SDK是使用者端的JavaScript資料庫,可讓Adobe Experience Cloud客戶透過Experience PlatformEdge Network與Experience Cloud中的各種服務互動。
Experience Platform Web SDK支援Adobe查詢個人化解決方案,包括決定管理,可讓您擷取並轉譯您使用API或優惠資料庫建立的個人化優惠。 如需詳細指示,請參閱有關建立選件的檔案。
有兩種方式可透過Platform Web SDK實作決定管理。 一種方式是針對開發人員,且需要網站和程式設計知識。 另一種方式是使用Adobe Experience Platform使用者介面來設定選件,這只需要在HTML頁面的標頭中參照小型指令碼。
如需有關如何使用Adobe Experience Platform Web SDK提供個人化優惠的詳細資訊,請參閱有關決定管理的Adobe Experience Platform檔案。
Adobe Experience Platform Web SDK aep-web-sdk
Platform Web SDK會取代下列SDK:
- Visitor.js
- AppMeasurement.js
- AT.js
- DIL.js
SDK並未合併這些程式庫,而是全新實施。 若要使用,您必須先執行下列步驟:
-
確保貴組織擁有使用SDK的適當許可權,且您已正確設定許可權。
-
安裝SDK。 有多種方法可以執行此作業,這些方法包含在安裝SDK頁面中。 本頁將繼續提供各種不同的實作方法。
若要個人化優惠方案,您必須個別設定個人化/設定檔。
若要設定SDK以進行決策管理,請遵循下列兩個步驟之一:
選項1 — 使用Launch安裝標籤擴充功能和實施
此選項對編碼體驗較差的人更容易使用。
選項2 — 使用預先建立的獨立版本手動實作
以下是使用Web SDK預先建立的獨立安裝來使用決定管理所需的步驟。 本指南假設這是您首次實作SDK,因此所有步驟可能不適用於您。 本指南也假定您有一些開發經驗。
包含選項2中的下列JavaScript程式碼片段:在HTML頁面的<head>
區段中,於此頁面預先建立的獨立版本。
javascript
<script>
!function(n,o){o.forEach(function(o){n[o]||((n.__alloyNS=n.__alloyNS||
[]).push(o),n[o]=function(){var u=arguments;return new Promise(
function(i,l){n[o].q.push([i,l,u])})},n[o].q=[])})}
(window,["alloy"]);
</script>
<script src="https://cdn1.adoberesources.net/alloy/2.6.4/alloy.js" async></script>
您需要在Adobe帳戶內取得兩個ID才能設定SDK設定:edgeConfigId和orgId。 edgeConfigId與您的資料串流ID相同,您應在「先決條件」中設定該ID。
若要尋找您的edgeConfigID/資料串流ID,請前往資料收集並選取您的資料串流。 若要尋找您的orgId,請前往您的設定檔。
依照本頁面上的指示,在JavaScript中設定SDK。 在設定函式中,您一律會使用edgeConfigId和orgId。 本檔案也會說明您的設定有哪些可選引數。 您的最終設定可能會如以下所示:
javascript
alloy("configure", {
"edgeConfigId": "12345678-0ABC-DEF-GHIJ-KLMNOPQRSTUV",
"orgId":"ABCDEFGHIJKLMNOPQRSTUVW@AdobeOrg",
"debugEnabled": true,
"edgeDomain": "edge.adobedc.net",
"clickCollectionEnabled": true,
"idMigrationEnabled": true,
"thirdPartyCookiesEnabled": true,
"defaultConsent":"in"
});
安裝Debugger Chrome擴充功能,以便用於偵錯。 您可在下列位置找到: https://chrome.google.com/webstore/detail/adobe-experience-platform/bfnnokhpnncpkdmbokanobigaccjkpob
接下來,在除錯工具中登入您的帳戶。 接著,前往「記錄檔」 ,確認您已連線至正確的工作區。 現在,從您的優惠中複製決定範圍的base64編碼版本。
編輯您的網站時,請包含具有設定的指令碼和sendEvent
函式,以將決定範圍傳送給Adobe。
範例:
javascript
alloy("sendEvent", {
"decisionScopes":
[
"eyJ4ZG06YWN0aXZpdHlJZCI6Inhjb3JlOm9mZmVyLWFjdGl2aXR5OjE0ZWE4MDhhZjJjZDM1NzQiLCJ4ZG06cGxhY2VtZW50SWQiOiJ4Y29yZTpvZmZlci1wbGFjZW1lbnQ6MTRjNGFmZDI2OTXXXXXXXXXX"
]
});
如需如何處理回應的範例,請參閱下列內容:
javascript
alloy("sendEvent", {
"decisionScopes":
[
"eyJ4ZG06YWN0aXZpdHlJZCI6Inhjb3JlOm9mZmVyLWFjdGl2aXR5OjE0ZWE4MDhhZjJjZDM1NzQiLCJ4ZG06cGxhY2VtZW50SWQiOiJ4Y29yZTpvZmZlci1wbGFjZW1lbnQ6MTRjNGFmZDI2OTXXXXXXXXXX"
]
}).then(function(result) {
Object.entries(result).forEach(([key, value]) => {
console.log(key, value);
});
});
您可以使用Debugger,確認已成功連線至Edge網路。
請參閱您建立選件的方式及所使用的格式。 系統會根據決定中符合的條件,傳回優惠給您,其中包含您在Adobe Experience Platform中建立優惠時指定的資訊。
在此範例中,要傳回的JSON為:
json
{
"name":"ABC Test",
"description":"This is a test offer",
"link":"https://sampletesting.online/",
"image":"https://sample-demo-URL.png"
}
處理回應物件並剖析您需要的資料。 由於您可以在一個sendEvent
呼叫中傳送多個決定範圍,因此您的回應可能會稍微不同。
json
{
"id": "abrxgl843d913",
"scope": "eyJ4ZG06YWN0aXZpdHlJZCI6Inhjb3JlOm9mZmVyLWFjdGl2aXR5OjE0ZWE4MDhhZjJjZDM1NzQiLCJ4ZG06cGxhY2VtZW50SWQiOiJ4Y29yZTpvZmZlci1wbGFjZW1lbnQ6MTRjNGFmZDI2OTVlNWRmOSJ9",
"items":
[
{
"id": "xcore:fallback-offer:14ea7f1ea26ebd0a",
"etag": "1",
"schema": "https://ns.adobe.com/experience/offer-management/content-component-json",
"data": {
"id": "xcore:fallback-offer:14ea7f1ea26ebd0a",
"format": "application/json",
"language": [
"en-us"
],
"content": "{\"name\":\"ABC Test\",\"description\":\"This is a test offer\", \"link\":\"https://sampletesting.online/\",\"image\":\"https://sample-demo-URL.png\"}"
}
}
]
}
]
}
json
{
"propositions":
[
{
"renderAttempted": false,
"id": "e15ecb09-993e-4b66-93d8-0a4c77e3d913",
"scope": "eyJ4ZG06YWN0aXZpdHlJZCI6Inhjb3JlOm9mZmVyLWFjdGl2aXR5OjE0ZWE4MDhhZjJjZDM1NzQiLCJ4ZG06cGxhY2VtZW50SWQiOiJ4Y29yZTpvZmZlci1wbGFjZW1lbnQ6MTRjNGFmZDI2OTVlNWRmOSJ9",
"items":
[
{
"id": "xcore:fallback-offer:14ea7f1ea26ebd0a",
"etag": "1",
"schema": "https://ns.adobe.com/experience/offer-management/content-component-json",
"data": {
"id": "xcore:fallback-offer:14ea7f1ea26ebd0a",
"format": "application/json",
"language": [
"en-us"
],
"content": "{\"name\":\"Claire Hubacek Test\",\"description\":\"This is a test offer\", \"link\":\"https://sampletesting.online/\",\"image\":\"https://sample-demo-URL.png\"}"
}
}
]
}
]
}
在此範例中,在網頁中處理及使用選件特定詳細資料所需的路徑為: result['decisions'][0]['items'][0]['data']['content']
若要設定JS變數:
javascript
const offer = JSON.parse(result['decisions'][0]['items'][0]['data']['content']);
let offerURL = offer['link'];
let offerDescription = offer['description'];
let offerImageURL = offer['image'];
document.getElementById("offerDescription").innerHTML = offerDescription;
document.getElementById('offerImage').src = offerImageURL;