Show Menu
トピック×

SPAモデルのルーティング

AEMのシングルページアプリの場合、アプリはルーティングを行います。 本書では、使用可能なルーティング・メカニズム、契約およびオプションについて説明します。
SPAフレームワークベースのクライアント側レンダリング(ReactやAngularなど)を必要とするプロジェクトには、SPA Editorが推奨されるソリューションです。

プロジェクト経路

アプリはルーティングを所有し、プロジェクトのフロントエンド開発者によって実装されます。 このドキュメントでは、AEMサーバーから返されるモデルに固有のルーティングについて説明します。 ページモデルのデータ構造は、基になるリソースのURLを公開します。 フロントエンドプロジェクトは、ルーティング機能を提供するカスタムライブラリまたはサードパーティライブラリを使用できます。 ルートでモデルのフラグメントが必要になったら、関数を呼び出す PageModelManager.getData() ことができます。 モデルルートが変更された場合、ページエディターなどのリスニングライブラリに警告を出すためにイベントをトリガーする必要があります。

アーキテクチャ

詳細な説明については、SPA Blueprintドキュメントの PageModelManager (ページモデルマネージャ)の節を参照してください。

ModelRouter

有効 ModelRouter な場合、HTML5履歴API関数をカプセル化し、特定のモデ pushState ルのフ replaceState ラグメントが事前にフェッチされ、アクセス可能であることを保証します。 次に、モデルが変更されたことを登録されたフロントエンドコンポーネントに通知します。

手動ルーティングと自動モデルルーティング

は、モ ModelRouter デルのフラグメントの取得を自動化します。 しかし、自動化されたツールには制限が伴います。 必要に応じて、メタ ModelRouter プロパティを使用してパスを無効にしたり、無視するように設定したりできます( SPA Page Componentドキュメントの「Meta Properties 」セクションを参照)。 フロントエンド開発者は、関数を使用して特定のモデルのフラグメントを読み込むように要求することで、独自 PageModelManager のモデルルーティングレイヤーを実装することがで getData() きます。
現在、We.Retail JournalサンプルReactプロジェクトは自動アプローチを示し、Angularプロジェクトは手動アプローチを示します。 半自動アプローチも有効です。
現在のバージョンのみ ModelRouter で、Sling modelエントリポイントの実際のリソースパスを指すURLの使用がサポートされています。 バニティURLやエイリアスの使用はサポートされていません。

ルーティングのコントラクト

現在の実装は、SPAプロジェクトでHTML5 History APIを使用して異なるアプリケーションページにルーティングすることを前提としています。

設定

は、モデ ModelRouter ルフラグメントをリッスンし、モデルフラグメントをプリフェッチする呼び出しを pushState サポート replaceState しています。 内部的には、特定のURL PageModelManager に対応するモデルの読み込みをトリガーし、他のモジュールがリス cq-pagemodel-route-changed ンできるイベントを実行します。
デフォルトではこの処理が自動的に有効になっています。無効にする場合は、SPA で次のメタプロパティをレンダリングする必要があります。
<meta property="cq:pagemodel_router" content="disable"\>

Note that every route of the SPA should correspond to an accessible resource in AEM (e.g., " /content/mysite/mypage" ) since the PageModelManager will automatically try to load the corresponding page model once the route is selected. Though, if needed, the SPA can also define a "black list" of routes that should be ignored by the PageModelManager :
<meta property="cq:pagemodel_route_filters" content="route/not/found,^(.*)(?:exclude/path)(.*)"/>