XDP フォームの HTML5 プレビューの生成

AEM Forms Designer でフォームをデザインする間、フォームの PDF レンダリングをプレビューする他に、HTML5 レンダリングをプレビューすることもできます。「HTML プレビュー」タブを使用すると、フォームがブラウザでどのように表示されるかをプレビューすることができます。

Designer での XDP フォームの HTML プレビューの有効化

Designer での XDP フォームの HTML プレビューの生成を有効にするには、次の設定を行います。

Apache Sling Authentication Service の設定
保護モードの無効化
AEM Forms サーバーの詳細の指定

Apache Sling Authentication Service の設定

OSGi で実行されている AEM Forms では https://[server]:[port]/system/console/configMgr、

JEE で実行されている AEM Forms では https://[server]:[port]/lc/system/console/configMgr に移動します。
Apache Sling Authentication Service 設定を探してクリックし、編集モードで開きます。
AEM Forms を OSGi または JEE のどちらで実行しているかにより、Authentication Requirements フィールドで以下を追加します。
- JEE 上の AEM Forms
  - -/content/xfaforms
  - -/etc/clientlibs
- OSGi 上の AEM Forms
  - -/content/xfaforms
  - -/etc/clientlibs/fd/xfaforms
メモ

Authentication Requirements フィールドで指定した値をコピーアンドペーストしないでください。値に使用されている特殊文字が文字化けするおそれがあります。代わりに、フィールドに指定の値を入力します。
「匿名ユーザー名」フィールドと「匿名ユーザーパスワード」フィールドで、ユーザー名とパスワードをそれぞれ指定します。指定した資格情報は、匿名認証を処理し、匿名ユーザーにアクセスを許可するために使用されます。
「保存」をクリックして、設定を保存します。

保護モードの無効化

保護モードは、デフォルトで有効になっています。実稼働環境の場合、このモードを有効のままにしてください。開発環境でこのモードを無効にすると、Designer で HTML5 フォームのプレビューを表示することができます。このモードを無効にするには、以下の手順を実行します。

管理者として AEM Web コンソールにログインします。
- OSGi 上の AEM Forms の URL：https://[server]:[port]/system/console/configMgr
- JEE 上の AEM Forms の URL：https://[server]:[port]/lc/system/console/configMgr
Mobile Forms の設定を編集用に開きます。
「保護モード」オプションの選択を解除して「保存」をクリックします。

AEM Forms サーバーの詳細の指定

Designer で、ツール／オプションに移動します。
オプションウィンドウでサーバーオプションページを選択し、次の詳細を提供して「OK」をクリックします。
- Server URL：AEM Forms サーバーの URL です。
- HTTP port number：AEM サーバーポート。デフォルト値は 4502 です。
- HTML Preview Context： XFA フォームのレンダリングに使用するプロファイルのパス。Designer でのフォームのプレビューには、次のプロファイルがデフォルトで使用されています。ただし、カスタムプロファイルへのパスを指定することもできます。
  - /content/xfaforms/profiles/default.html (OSGi 上の AEM Forms)
  - /lc/content/xfaforms/profiles/default.html (JEE 上の AEM Forms)
- Forms Manager Context : Forms Manager UI がデプロイされるコンテキストパス。デフォルト値は次のとおりです。
  - /aem/forms (OSGi 上の AEM Forms)
  - /lc/forms (JEE 上の AEM Forms)
**注：**サーバーが起動および実行されていることを確認してください。HTML プレビューは、プレビューを生成するために CRX サーバーに接続します。

AEM Forms Designer のオプション
フォームを HTML でプレビューするには、「HTML プレビュー」タブをクリックします。

メモ

「HTML Preview」タブが閉じている場合は、F4 を押して「Preview HTML」を開けます。また、表示メニューから「Preview HTML」を選択して、「Preview HTML」タブを開けることもできます。

メモ

HTML プレビューは PDF ドキュメントをサポートしません。HTML プレビューは XDP ドキュメント専用です。

サンプルデータを使用してフォームをプレビューするには

Designer では、サンプル XML データを使用してフォームをプレビューおよびテストすることができます。フォームが正しくレンダリングされるよう、フォームをサンプルデータで頻繁にテストすることをお勧めします。

サンプルデータがない場合には、Designer で自動生成するか、または独自に作成することができます。フォームのプレビュー用にサンプルデータを自動生成するにはおよびフォームのプレビュー用にサンプルデータを作成するにはも参照してください。

サンプルデータソースを使用してフォームをテストすると、データとフィールドがマップされていること、および繰り返しサブフォームが指定どおりに繰り返されることを確認できます。各オブジェクトに結合されたデータを表示するにあたり適切なスペースが確保された、バランスのよいフォームレイアウトを作成できます。

ファイル／フォームのプロパティを選択します。
「プレビュー」タブをクリックし、「データファイル」ボックスに、テストデータファイルへの完全なパスを入力します。参照ボタンを使用してファイルを指定することもできます。
「OK」をクリックします。次回に「HTML プレビュー」タブでフォームをプレビューするときには、それぞれのオブジェクトにサンプル XML ファイルからのデータ値が表示されます。