[整合]{class="badge positive"}
整合AEM Sites和Experience Platform Web SDK
[AEM Sites as a Cloud Service]{class="badge informative"}
瞭解如何將AEM as a Cloud Service與Experience PlatformWeb SDK整合。 此基礎步驟對於整合Adobe Experience Cloud產品(例如Adobe Analytics、Target)或最近的創新產品(例如Real-time Customer Data Platform、Customer Journey Analytics和Journey Optimizer)至關重要。
您也會瞭解如何在Experience Platform中收集及傳送WKND — 範例Adobe Experience Manager專案頁面檢視資料。
完成此設定後，您已實作堅實的基礎。 此外，您已準備好使用類似Real-time Customer Data Platform (Real-Time CDP)、Customer Journey Analytics (CJA)和Adobe Journey Optimizer (AJO)的應用程式來推進Experience Platform實作。 進階實作可標準化網頁和客戶資料，協助促進更佳的客戶參與度。
先決條件
整合Experience Platform Web SDK時，需要下列專案。
在 AEM中作為Cloud Service：
- AEM管理員對AEM as a Cloud Service環境的存取權
- 部署管理員對Cloud Manager的存取權
- 複製並部署WKND — 範例Adobe Experience Manager專案至您的AEM as a Cloud Service環境。
在 Experience Platform 中：
- 存取預設生產 Prod 沙箱。
- 存取資料管理下的 結構描述
- 存取資料管理下的 資料集
- 存取資料收集底下的 資料串流
- 存取資料收集底下的 標籤
如果您沒有必要的許可權，使用Adobe Admin Console的系統管理員可以授與必要的許可權。
建立XDM結構描述 — Experience Platform
體驗資料模型(XDM)結構描述可幫助您標準化客戶體驗資料。 若要收集 WKND pageview 資料，請建立XDM結構描述，並使用Adobe提供的欄位群組AEP Web SDK ExperienceEvent進行網頁資料收集。
有一般和特定產業，例如零售、金融服務、醫療保健等參考資料模型套件，如需詳細資訊，請參閱產業資料模型概觀。
從XDM系統總覽瞭解XDM結構描述和相關概念，例如欄位群組、型別、類別和資料型別。
XDM系統總覽是瞭解XDM結構描述和相關概念（如欄位群組、型別、類別和資料型別）的絕佳資源。 它提供對於XDM資料模型以及如何建立和管理XDM結構描述的全面瞭解，以標準化整個企業的資料。 探索它以更深入瞭解XDM結構描述，以及它如何能讓您的資料收集和管理流程受益。
建立資料串流 — Experience Platform
資料串流會指示PlatformEdge Network將收集到的資料傳送至何處。 例如，可傳送至Experience Platform、Analytics或Adobe Target。
請造訪資料串流總覽頁面，以熟悉「資料串流」的概念和相關主題，例如資料控管和組態。
建立標籤屬性 — Experience Platform
瞭解如何在Experience Platform中建立標籤屬性，以將Web SDK JavaScript程式庫新增至WKND網站。 新定義的標籤屬性有下列資源：
- 標籤擴充功能： 核心和Adobe Experience Platform Web SDK
- 資料元素：使用WKND網站的Adobe使用者端資料層擷取page-name、site-section和host-name的自訂程式碼型別資料元素。 此外，XDM物件型別資料元素也符合之前建立XDM結構描述步驟中新建立的WKND XDM結構描述內建。
- 規則：每當使用Adobe使用者端資料層觸發
cmp:show事件來造訪WKND網頁時，將資料傳送至PlatformEdge Network。
使用 發佈流程 建置及發佈標籤庫時，您可以使用 新增所有變更的資源 按鈕。 若要選取所有資源，例如資料元素、規則和標籤擴充功能，而非識別及挑選個別資源。 此外，在開發階段中，您可以僅將程式庫發佈到 開發 環境，然後驗證並提升到 階段 或 生產 環境。
-
Page Name資料元素程式碼。code language-javascript if(event && event.component && event.component.hasOwnProperty('dc:title')) { // return value of 'dc:title' from the data layer Page object, which is propogated via 'cmp:show` event return event.component['dc:title']; } -
Site Section資料元素程式碼。code language-javascript if(event && event.component && event.component.hasOwnProperty('repo:path')) { let pagePath = event.component['repo:path']; let siteSection = ''; //Check of html String in URL. if (pagePath.indexOf('.html') > -1) { siteSection = pagePath.substring(0, pagePath.lastIndexOf('.html')); //replace slash with colon siteSection = siteSection.replaceAll('/', ':'); //remove `:content` siteSection = siteSection.replaceAll(':content:',''); } return siteSection } -
Host Name資料元素程式碼。code language-javascript if(window && window.location && window.location.hostname) { return window.location.hostname; } -
all pages - on load規則事件代碼code language-javascript var pageShownEventHandler = function(evt) { // defensive coding to avoid a null pointer exception if(evt.hasOwnProperty("eventInfo") && evt.eventInfo.hasOwnProperty("path")) { // trigger tags Rule and pass event console.debug("cmp:show event: " + evt.eventInfo.path); var event = { // include the path of the component that triggered the event path: evt.eventInfo.path, // get the state of the component that triggered the event component: window.adobeDataLayer.getState(evt.eventInfo.path) }; // Trigger the tags Rule, passing in the new 'event' object // the 'event' obj can now be referenced by the reserved name 'event' by other tags data elements // i.e 'event.component['someKey']' trigger(event); } } // set the namespace to avoid a potential race condition window.adobeDataLayer = window.adobeDataLayer || []; // push the event listener for cmp:show into the data layer window.adobeDataLayer.push(function (dl) { //add event listener for 'cmp:show' and callback to the 'pageShownEventHandler' function dl.addEventListener("cmp:show", pageShownEventHandler); });
標籤總覽提供資料元素、規則和擴充功能等重要概念的深入知識。
如需整合AEM核心元件與Adobe使用者端資料層的詳細資訊，請參閱搭配使用Adobe使用者端資料層與AEM核心元件指南。
將標籤屬性連線至AEM
瞭解如何透過AEM中的Adobe IMS和Adobe Experience Platform設定中的標籤，將最近建立的標籤屬性連結至AEM。 建立AEM as a Cloud Service環境時，會自動產生數個Adobe IMS技術帳戶設定，包括標籤。 如需逐步指示，請參閱使用IMS連線AEM Sites與標籤屬性。
不過，對於AEM 6.5版本，您必須手動設定。
連結標籤屬性後，WKND網站便能使用Adobe Experience Platform雲端服務設定中的標籤，將標籤屬性的JavaScript程式庫載入網頁。
驗證WKND上的標籤屬性載入
使用Adobe Experience Platform DebuggerChrome延伸模組，驗證WKND頁面上是否載入標籤屬性。 您可以確認，
- 標籤屬性詳細資訊，例如，擴充功能、版本、名稱等。
- Platform Web SDK程式庫版本，資料流ID
- XDM物件作為Experience Platform Web SDK中
events屬性的一部分
建立資料集 — Experience Platform
使用Web SDK收集的Pageview資料會以資料集的形式儲存在Experience Platform資料湖中。 資料集是資料集合的儲存和管理結構，例如遵循結構描述的資料庫表格。 瞭解如何建立資料集並設定先前建立的資料流，以將資料傳送至Experience Platform。
資料集總覽提供概念、設定和其他擷取功能的詳細資訊。
Experience Platform中的WKND pageview資料
在使用AEM設定Web SDK後，尤其是在WKND網站上，您可以導覽網站頁面來產生流量。 然後確認正在將Pageview資料擷取至Experience Platform資料集。 在資料集UI中，各種詳細資訊（例如，記錄總數、大小和擷取的批次）會與視覺上吸引人的長條圖一起顯示。
摘要
做得好！您已使用Experience Platform Web SDK完成AEM的設定，以收集並從網站擷取資料。 有了這個基礎，您現在可以探索更多可能性來增強和整合Analytics、Target、Customer Journey Analytics (CJA)和其他許多產品，為您的客戶打造豐富的個人化體驗。 持續學習和探索，以釋放Adobe Experience Cloud的完整潛能。