AEM Commerce の開発 develop

AEM用Commerce integration framework（CIF）に基づくAEM Commerce プロジェクトの開発は、他のAEM プロジェクトと同様のルールとベストプラクティスに従います。 最初に次の点を確認します。

AEM Commerceのローカル開発 local

CIF プロジェクトを使用する場合は、ローカル開発環境を使用することをお勧めします。

CIF アドオンとして知られるAEM用AEM Commerce アドオンは、ローカル開発でも利用でき、AEM パッケージとして提供されます。 ​ ソフトウェア配布ポータル ​から機能パックとしてダウンロードできます。

必要なソフトウェア

以下をローカルにインストールしておく必要があります。

CIF アドオンへのアクセス

CIF アドオンは、​ ソフトウェア配布ポータル ​からダウンロードできます。AEM Commerce add-onを検索してください。

ローカル設定

AEMとアドオンのCIFを使用してローカルのCIF プロジェクトを開発する場合は、次の操作を行います。

OSGI コンソールでセットアップを確認します：http://localhost:4502/system/console/osgi-installer。 このリストには、CIF アドオン関連バンドル、コンテンツパッケージ、OSGI 設定が含まれている必要があります。 すべてのバンドルが起動されていることを確認します。

プロジェクトのセットアップ project

CIF を使用して AEM Commerce プロジェクトを開始する方法は 2 とおりあります。

AEM プロジェクトアーキタイプの使用

CIF を使い始めるために事前に設定されたプロジェクトを Bootstrap するには、AEM プロジェクトアーキタイプが主なツールです。 CIF コアコンポーネントと必要なすべての設定を、生成されたプロジェクトに 1 つの追加オプションで含めることができます。

AEM プロジェクトの生成方法については、AEM プロジェクトアーキタイプの「使用手順」を参照してください。 プロジェクトに CIF を含めるには、includeCommerce オプションを使用します。

次に例を示します。

mvn -B archetype:generate \
 -D archetypeGroupId=com.adobe.granite.archetypes \
 -D archetypeArtifactId=aem-project-archetype \
 -D aemVersion=6.5.5 \
 -D appTitle="My Site" \
 -D appId="mysite" \
 -D groupId="com.mysite" \
 -D frontendModule=general \
 -D includeExamples=n \
 -D includeCommerce=y

CIFのコアコンポーネントは、あらゆるプロジェクトで使用できます。 提供されたall パッケージを含めるか、CIF コンテンツパッケージと関連するOSGi バンドルを個別に使用します。 次の依存関係を使用して、CIF コアコンポーネントを手動でプロジェクトに追加します。

<dependency>
    <groupId>com.adobe.commerce.cif</groupId>
    <artifactId>core-cif-components-apps</artifactId>
    <type>zip</type>
    <version>x.y.z</version>
</dependency>
<dependency>
    <groupId>com.adobe.commerce.cif</groupId>
    <artifactId>core-cif-components-config</artifactId>
    <type>zip</type>
    <version>x.y.z</version>
</dependency>
<dependency>
    <groupId>com.adobe.commerce.cif</groupId>
    <artifactId>core-cif-components-core</artifactId>
    <version>x.y.z</version>
</dependency>
<dependency>
    <groupId>com.adobe.commerce.cif</groupId>
    <artifactId>graphql-client</artifactId>
    <version>x.y.z</version>
</dependency>
<dependency>
    <groupId>com.adobe.commerce.cif</groupId>
    <artifactId>magento-graphql</artifactId>
    <version>x.y.z</version>
</dependency>

AEM Venia リファレンスストアの使用

CIF プロジェクトを開始する 2 つ目の方法は、AEM Venia 参照用ストアをコピーして使用する方法です。 AEM Venia 参照用ストアは、AEM 用の CIF コアコンポーネントの使用方法を示すサンプルのストアフロントアプリケーションです。 これは、ベストプラクティス例として意図されていて、独自機能を開発するための有望な出発点としての役割も果たします。

Git リポジトリ ​を複製してVenia Reference Storeを開始し、ニーズに応じてプロジェクトのカスタマイズを開始します。

コマースシステムへの AEM の接続

プロジェクトをコマースシステムに接続するには、コマースシステムのGraphQL エンドポイントを使用してAEMを設定する必要があります。

AEM プロジェクト アーキタイプ ​またはAEM Venia リファレンス ストア ​によって生成されたプロジェクトには、調整が必要な既定の設定が既に含まれています。

com.adobe.cq.commerce.graphql.client.impl.GraphqlClientImpl~default.cfg.json の url の値を、プロジェクトで使用されるコマースシステムの GraphQL エンドポイントに置き換えます。

AEM Commerce アドオンとCIF コアコンポーネントは、AEM サーバーを介してCommerce GraphQL エンドポイントに接続します。 直接ブラウザーから取り込むこともできます。 クライアントサイドのCIF コアコンポーネントとCIF アドオンオーサリングツールは、デフォルトで/api/graphqlに接続します。 必要に応じて、CIF Cloud Service設定（以下を参照）を使用して調整できます。

CIF アドオンは、/api/graphql で GraphQL プロキシサーブレットを提供します。 ローカルの AEM Dispatcher を使用する予定がない場合は、GraphQL プロキシサーブレットも設定することをお勧めします。

http://localhost:4502/system/console/configMgrに移動し、Adobe CIF GraphQL Proxy Configuration サービスのOSGI設定を作成します。 上記の GraphQL クライアントで使用したのと同じ GraphQL エンドポイントを、コマースシステムで使用します。

その他のリソース