第4章 — 定義內容服務範本
AEM Headless教學課程的第4章涵蓋AEM Content Services內容中AEM可編輯範本的角色。 可編輯的範本是用來定義AEM Content Services透過構成啟用AEM元件的方式向使用者端公開的JSON內容結構。
瞭解AEM Content Services中範本的角色
AEM可編輯範本用於定義存取的HTTP端點,以將事件內容公開為JSON。
傳統上,使用AEM可編輯範本來定義網頁,不過這僅是慣例。 可編輯的範本可用於撰寫 任何 內容集;內容的存取方式:作為瀏覽器中的HTML、JavaScript (AEM SPA Editor)或行動應用程式使用的JSON,是該頁面請求方式的函式。
在AEM Content Services中,可編輯的範本可用來定義JSON資料的公開方式。
對於 WKND Mobile 應用程式,我們將建立單一可編輯範本,用於驅動單一API端點。 雖然此範例只是簡單說明AEM Headless的概念,但您可以建立多個頁面(或端點),每個頁面都會公開不同的內容集,以建立更複雜、更有條理的API。
瞭解API端點
瞭解如何組成API端點,以及應該向我們的展示哪些內容 WKND Mobile 應用程式,讓我們重新造訪設計。
如我們所見,我們有三個邏輯內容集可提供給行動應用程式。
- 此 標誌
- 此 標籤行
- 清單 活動
為此,我們可以將這些需求對應至AEM元件(在此例中為AEM WCM核心元件),以將必要內容公開為JSON。
- 此 標誌 是透過 影像元件
- 此 標籤行 是透過 文字元件
- 清單 活動 是透過 內容片段清單元件 這進而會參考一組事件內容片段。
定義事件API範本
-
瀏覽至 工具 > 一般 > 範本 >WKND Mobile.
-
建立 Events API 範本:
- 點選 建立 在頂端動作列中
- 選取 WKND Mobile - Empty Page 範本
- 點選 下一個 在頂端動作列中
- 輸入 Events API 在 範本標題 欄位
- 點選 建立 在頂端動作列中
- 點選 開啟 開啟新範本以進行編輯
-
首先,我們允許三個已識別的AEM元件,以透過編輯 原則 根目錄的 配置容器. 確保 結構 模式為作用中,選取 Layout Container [Root],然後點選 原則 按鈕。
-
在 屬性 > 允許的元件 搜尋 WKND Mobile. 允許下列元件來自 WKND Mobile 元件群組,以便用於 Events API頁面。
-
WKND Mobile > Image
- 應用程式的標誌
-
WKND Mobile > Text
- 應用程式的簡介文字
-
WKND Mobile > Content Fragment List
- 可在應用程式中顯示的事件類別清單
-
-
點選 完成 完成後,右上角勾選記號。
-
重新整理 要檢視的瀏覽器視窗 允許的元件 清單。
-
從左側欄的「元件」尋找器中,拖曳下列AEM元件:
- Image 代表標誌
- Text (標籤行)
- Content Fragment List 適用於事件
-
針對上述每個元件,選取它們並按 解除鎖定 按鈕。
-
不過,請確保 配置容器 是 已鎖定 以防止新增其他元件,或移除這三個元件。
-
點選 頁面資訊 > 在管理員中檢視 以返回 WKND Mobile 範本清單。 選取新建立的 Events API 範本並點選 啟用 在頂端動作列中。
後續步驟
或者安裝 com.adobe.aem.guides.wknd-mobile.content.chapter-4.zip AEM Author上的內容套件,透過 AEM封裝管理員. 此套件包含本教學課程及先前章節中概述的設定和內容。