Android アプリ
- 適用対象：
- Experience Manager as a Cloud Service
- トピック：
- コンテンツフラグメント
作成対象：
- 初心者
- 開発者
AEM Headless as a Cloud Service
サンプルアプリケーションは、Adobe Experience Manager（AEM）のヘッドレス機能を調べるうえで役に立ちます。 この Android アプリケーションは、AEM の GraphQL API を使用してコンテンツをクエリする方法の例を示しています。 AEM Headless Client for Java を使用すると、GraphQL クエリを実行し、データを Java オブジェクトにマッピングしてアプリを強化することができます。
前提条件
次のツールをローカルにインストールする必要があります。
AEM の要件
Android アプリケーションは、次の AEM デプロイメントオプションと連携します。すべてのデプロイメントに WKND Site v3.0.0 以降をインストールする必要があります。
Android アプリケーションは AEM パブリッシュ 環境に接続するように設計されていますが、Android アプリケーションの設定で認証が指定されている場合は、AEM オーサーからコンテンツを取得できます。
使用方法
-
adobe/aem-guides-wknd-graphqlリポジトリのクローンを作成します。$ git clone git@github.com:adobe/aem-guides-wknd-graphql.git -
Android Studio、フォルダー
android-appの順に開く -
app/src/main/assets/config.propertiesのファイルconfig.propertiesを変更し、ターゲット AEM 環境に一致するようにcontentApi.endpointを更新します。contentApi.endpoint=https://publish-p123-e456.adobeaemcloud.com基本認証
contentApi.userとcontentApi.passwordは、WKND GraphQL コンテンツにアクセスできるローカル AEM ユーザーを認証します。contentApi.endpoint=https://author-p123-e456.adobeaemcloud.com contentApi.user=my-special-android-app-user contentApi.password=password123 -
Android 仮想デバイス（API 28 以上）をダウンロードします。
-
Android エミュレーターを使用して、アプリをビルドしデプロイします。
AEM 環境への接続
AEM オーサー環境に接続する場合は、認証が必要です。AEMHeadlessClientBuilder は、トークンベースの認証を使用する機能を提供します。トークンベースの認証を使用するには、AdventureLoader.java と AdventuresLoader.java のクライアントビルダーを更新します。
/* Comment out basicAuth
if (user != null && password != null) {
builder.basicAuth(user, password);
}
*/
// use token-authentication where `token` is a String representing the token
builder.tokenAuth(token)
コード
アプリケーションの強化に使用される重要なファイルとコードの概要を以下に示します。完全なコードは GitHub にあります。
永続クエリ
AEM ヘッドレスのベストプラクティスに従って、iOS アプリケーションは AEM GraphQL 永続クエリを使用してアドベンチャーデータをクエリします。アプリケーションでは、次の 2 つの永続クエリを使用します。
wknd/adventures-all永続クエリ。AEM のすべてのアドベンチャーを要約されたプロパティセットとともに返します。この永続クエリは、初期ビューのアドベンチャーリストを制御します。
# Retrieves a list of all adventures
{
adventureList {
items {
_path
slug
title
price
tripLength
primaryImage {
... on ImageRef {
_dynamicUrl
_path
}
}
}
}
}
wknd/adventure-by-slug永続クエリ。slug（アドベンチャーを一意に識別するカスタムプロパティ）によって、完全なプロパティセットを含む単一のアドベンチャーを返します。この永続クエリで、アドベンチャーの詳細ビューが強化されます。
# Retrieves an adventure Content Fragment based on it's slug
# Example query variables:
# {"slug": "bali-surf-camp"}
# Technically returns an adventure list but since the the slug
# property is set to be unique in the CF Model, only a single CF is expected
query($slug: String!) {
adventureList(filter: {
slug: {
_expressions: [ { value: $slug } ]
}
}) {
items {
_path
title
slug
activity
adventureType
price
tripLength
groupSize
difficulty
price
primaryImage {
... on ImageRef {
_dynamicUrl
_path
}
}
description {
json
plaintext
}
itinerary {
json
plaintext
}
}
_references {
...on AdventureModel {
_path
slug
title
price
__typename
}
}
}
}
GraphQL 永続クエリの実行
AEM の永続クエリは HTTP GET を介して実行されるので、AEM Headless Client for Java を使用して、AEM に対して永続 GraphQL クエリを実行し、アドベンチャーコンテンツをアプリに読み込みます。
各永続クエリには、対応する「ローダー」クラスがあり、これが AEM HTTP GET エンドポイントを非同期的に呼び出し、カスタム定義のデータモデルを使用してアドベンチャーデータを返します。
-
loader/AdventuresLoader.javawknd-shared/adventures-all永続クエリを使用して、アドベンチャーのリストを取得しアプリケーションのホーム画面に表示します。 -
loader/AdventureLoader.javawknd-shared/adventure-by-slug永続クエリを使用して、slugパラメーターを通じて選択した単一のアドベンチャーを取得します。
//AdventuresLoader.java
public static final String PERSISTED_QUERY_NAME = "/wknd-shared/adventures-all";
...
AEMHeadlessClientBuilder builder = AEMHeadlessClient.builder().endpoint(config.getContentApiEndpoint());
// Optional authentication for basic auth
String user = config.getContentApiUser();
String password = config.getContentApiPassword();
if (user != null && password != null) {
builder.basicAuth(user, password);
}
AEMHeadlessClient client = builder.build();
// run a persistent query and get a response
GraphQlResponse response = client.runPersistedQuery(PERSISTED_QUERY_NAME);
GraphQL 応答データモデル
Adventure.java は、GraphQL リクエストからの JSON データで初期化される Java POJO であり、Android アプリケーションのビューで使用するアドベンチャーをモデル化します。
ビュー
Android アプリケーションでは 2 つのビューを使用して、アドベンチャーデータをモバイルエクスペリエンスに表示します。
-
AdventureListFragment.javaAdventuresLoaderを呼び出し、返されたアドベンチャーをリストで表示します。 -
AdventureDetailFragment.javaAdventureListFragmentビューで選択したアドベンチャーを通じて渡されたslugパラメーターを使用してAdventureLoaderを呼び出し、単一のアドベンチャーの詳細を表示します。
リモート画像
loader/RemoteImagesCache.java は、Android UI 要素で使用できるようにリモート画像をキャッシュ内に準備するのに役立つユーティリティクラスです。アドベンチャーコンテンツは、URL を通じて AEM Assets 内の画像を参照し、このクラスを使用してそのコンテンツを表示します。