教學課程的第7章使用原生Android行動應用程式來使用Content Services中AEM的內容。
本教學課程使用簡單的原生Android Mobile App來使用和顯示Content Services公開的事AEM件內容。
使用Android基本上不重要,而且消費性的行動應用程式可以在任何行動平台(例如iOS)的架構中編寫。
Android是教學課程,因為它能夠在Windows、macOs和Linux上執行Android模擬器,而且其受歡迎程度也很高,而且它可以編寫成Java語言,這是開發人員十分熟悉的AEM語言。
本教學課程的Android行動應用程式並非要指示如何建立Android行動應用程式或傳達Android開發的最佳實務,而是要說明如何從行動應用程式使用AEMContent Services。
如果AEM Publish未在http://localhost:4503上執行,則可在行動應用程式的Settings中更新主機和連接埠,以指向屬性AEM Publish主機/連接埠。
本節重點說明最能互動且依賴於Content Services及其JSON輸AEM出的Android行動應用程式程式碼。
在載入時,行動應用程式會將HTTP GET
設為/content/wknd-mobile/en/api/events.model.json
,此為Content Services的端點,設定AEM為提供內容以驅動行動應用程式。
由於事件API(/content/wknd-mobile/en/api/events.model.json
)的可編輯範本已鎖定,因此行動應用程式可以編碼,以在JSON回應的特定位置尋找特定資訊。
HTTP GET
請求至/content/wknd-mobile/en/api/events.model.json
的AEM Publish,以收集要填入行動應用程式UI的內容。以下是行動應用程式MainActivity
中負責叫用內容服務以收集驅動行動應用程式體驗的AEM內容的程式碼摘要。
protected void onCreate(Bundle savedInstanceState) {
...
// Create the custom objects that will map the JSON -> POJO -> View elements
final List<ViewBinder> viewBinders = new ArrayList<>();
viewBinders.add(new LogoViewBinder(this, getAemHost(), (ImageView) findViewById(R.id.logo)));
viewBinders.add(new TagLineViewBinder(this, (TextView) findViewById(R.id.tagLine)));
viewBinders.add(new EventsViewBinder(this, getAemHost(), (RecyclerView) findViewById(R.id.eventsList)));
...
initApp(viewBinders);
}
private void initApp(final List<ViewBinder> viewBinders) {
final String aemUrl = getAemUrl(); // -> http://localhost:4503/content/wknd-mobile/en/api/events.mobile.json
JsonObjectRequest request = new JsonObjectRequest(aemUrl, null,
new Response.Listener<JSONObject>() {
@Override
public void onResponse(JSONObject response) {
for (final ViewBinder viewBinder : viewBinders) {
viewBinder.bind(response);
}
}
},
...
);
}
onCreate(..)
是行動應用程式的初始化掛接,並註冊負責剖析JSON ViewBinders
及將值系結至元素的3個自訂 View
掛接。
initApp(...)
接著呼叫,以便在AEM Publish上向AEMContent Services終點提出HTTPGET要求以收集內容。收到有效的JSON回應時,JSON回應會傳遞給負責剖析JSON並將其系結至行動裝置View
元素的每個ViewBinder
。
接下來,我們將看LogoViewBinder
,它很簡單,但突出了幾個重要考慮事項。
public class LogoViewBinder implements ViewBinder {
...
public void bind(JSONObject jsonResponse) throws JSONException, IOException {
final JSONObject components = jsonResponse.getJSONObject(":items").getJSONObject("root").getJSONObject(":items");
if (components.has("image")) {
final Image image = objectMapper.readValue(components.getJSONObject("image").toString(), Image.class);
final String imageUrl = aemHost + image.getSrc();
Glide.with(context).load(imageUrl).into(logo);
} else {
Log.d("WKND", "Missing Logo");
}
}
}
bind(...)
的第一行透過:items → root → :items鍵,導覽至JSON回應,此鍵代表元AEM件所新增的「版面容器」。
在此處會檢查名為image的索引鍵,此索引鍵代表Image元件(同樣,此節點名稱→JSON索引鍵是穩定的)。 如果此對象存在,則通過Jackson ObjectMapper
庫讀取並映射到自定義映像POJO。 下面將探索映像POJO。
最後,標誌的src
會使用Glide輔助程式庫載入Android ImageView。
請注意,我們必須AEM將架構、主機和連接埠(透過aemHost
)提供至AEM Publish例項,因為AEMContent Services將僅提供JCR路徑(即 /content/dam/wknd-mobile/images/wknd-logo.png
)至參考內容。
雖然可選,但是使用Jackson ObjectMapper或其他程式庫(例如Gson)提供的類似功能,可協助將複雜的JSON結構對應至Java POJO,而不需直接處理原生JSON物件本身。 在此簡單案例中,我們會透過@JSONProperty
註解,將image
JSON物件的src
索引鍵直接對應至「影像POJO」中的src
屬性。
package com.adobe.aem.guides.wknd.mobile.android.models;
import com.fasterxml.jackson.annotation.JsonProperty;
public class Image {
@JsonProperty(value = "src")
private String src;
public String getSrc() {
return src;
}
}
Event POJO需要從JSON物件中選取更多資料點,它比簡單影像更有好處,我們只要src
。
現在您已瞭解Content Services如何推動原生AEMMobile體驗,請運用您學到的知識來執行下列步驟,並查看您在Mobile應用程式中所反映的變更。
在每個步驟後,拉進以重新整理行動應用程式,並驗證行動體驗的更新。
您已完成無頭教學AEM課程!
若要進一步了AEM解內容服務,並AEM以無頭CMS的形式,請造訪Adobe的其他檔案與啟用資料: