Forms をレンダリングする web アプリケーションの作成

Forms をレンダリングする web アプリケーションの作成

Java サーブレットを使用して Forms サービスを呼び出し、フォームをレンダリングする web ベースのアプリケーションを作成できます。Java™ サーブレットを使用する利点の 1 つは、プロセスの戻り値をクライアント Web ブラウザーに書き込める点です。つまり、フォームを返す Forms サービスとクライアント Web ブラウザーの間のリンクとして Java サーブレットを使用できます。

Java サーブレットを使用すると、顧客がフォームにデータを表示して入力できるように、フォームをクライアント Web ブラウザーに書き込むことができます。フォームにデータを入力した後、Web ユーザーはフォーム上の送信ボタンをクリックして、情報を Java サーブレットに送り返し、データを取得して処理できます。例えば、別のプロセスにデータを送信できます。

ここでは、次の図に示すように、米国ベースのフォームデータとカナダベースのフォームデータのいずれかを選択できる Web ベースのアプリケーションを作成する方法について説明します。

レンダリングされるフォームは、フラグメントに基づくフォームです。つまり、ユーザーが米国のデータを選択した場合、返されるフォームは米国のデータに基づくフラグメントを使用します。例えば、次の図に示すように、フォームのフッターにはアメリカの住所が含まれています。

同様に、ユーザーがカナダのデータを選択した場合、返されるフォームには、次の図に示すように、カナダの住所が含まれます。

サンプルファイル

このセクションでは、次の場所にあるサンプルファイルを使用します。

<Forms Designer のインストールディレクトリ>/Samples/Forms/Purchase Order/Form Fragments

ここで、<インストールディレクトリ>はインストールパスです。クライアントアプリケーションの目的上、Purchase Order Dynamic.xdp ファイルはこのインストール場所からコピーされ、Applications/FormsApplication という名前の Forms アプリケーションにデプロイされました。Purchase Order Dynamic.xdp ファイルは、FormsFolder という名前のフォルダーに配置されます。同様に、フラグメントは、次の図に示すように、Fragments という名前のフォルダーに配置されます。

Purchase Order Dynamic.xdp フォームデザインにアクセスするには、Applications/FormsApplication/1.0/FormsFolder/Purchase Order Dynamic.xdp をフォーム名（renderPDFForm メソッドに渡される 1 番目のパラメーター）として指定し、repository:/// をコンテンツルート URI 値として設定します。

Web アプリケーションで使用される XML データファイルが Data フォルダーから C:\Adobe（AEM Forms をホストする J2EE アプリケーションサーバーに属するファイルシステム）に移動されました。ファイル名は「Purchase Order Canada.xml」および「Purchase Order US.xml」です。

手順の概要

フラグメントに基づいて Forms をレンダリングする Web ベースのアプリケーションを作成するには、次の手順を実行します。

1. 新規 web プロジェクトを作成します。
2. Java サーブレットを表す Java アプリケーションロジックを作成します。
3. Web アプリケーション用の Web ページを作成します。
4. Web アプリケーションを WAR ファイルにパッケージ化します。
5. J2EE アプリケーションサーバーに WAR ファイルをデプロイします。
6. Web アプリケーションをテストします。

Web プロジェクトの作成

Forms サービスを呼び出す Java サーブレットを含む Web アプリケーションを作成する最初の手順は、新しい Web プロジェクトを作成することです。このドキュメントの基になる Java IDE は Eclipse 3.3 です。Eclipse IDE を使用して、Web プロジェクトを作成し、必要な JAR ファイルをプロジェクトに追加します。最後に、index.html という名前の HTML ページと Java サーブレットをプロジェクトに追加します。

次のリストは、Web プロジェクトに追加する必要がある JAR ファイルを指定します。

• adobe-forms-client.jar
• adobe-livecycle-client.jar
• adobe-usermanager-client.jar
• adobe-utilities.jar

これらのファイルの場所については、AEM Forms Java ライブラリファイルを含めるを参照してください。

新しい web プロジェクトを作成するには、次の手順を実行します。

1. Eclipse を起動し、ファイル／新規プロジェクト​をクリックします。
2. 新規プロジェクト​ダイアログボックスで、Web／ダイナミック Web プロジェクト​を選択します。
3. FragmentsWebApplication をプロジェクト名を入力し、「完了」をクリックします。

必要な JAR ファイルをプロジェクトに追加するには、次の手順に従います。

1. プロジェクトエクスプローラウィンドウで、FragmentsWebApplication プロジェクトを右クリックして​プロパティ​を選択します。
2. 「Java ビルドパス」をクリックしてから「ライブラリ」タブをクリックします。
3. 「外部 JAR を追加」ボタンをクリックし、含める JAR ファイルを参照します。

Java サーブレットをプロジェクトに追加するには、次の手順を実行します。

1. プロジェクトエクスプローラウィンドウで、FragmentsWebApplication プロジェクトを右クリックして、新規／その他​を選択します。
2. Web フォルダーを展開し、「Servlet」を選択してから「次へ」をクリックします。
3. サーブレットを作成ダイアログボックスで、RenderFormFragment をサーブレット名として入力してから「完了」をクリックします。

プロジェクトに HTML ページを追加するには、次の手順を実行します。

1. プロジェクトエクスプローラウィンドウで、FragmentsWebApplication プロジェクトを右クリックして、新規／その他​を選択します。
2. Web フォルダーを展開して、HTML を選択し、次へ​をクリックします。
3. 新しい HTML ダイアログボックスで、ファイル名に index.html と入力してから「完了」をクリックします。

サーブレットの Java アプリケーションロジックの作成

Java サーブレット内から Forms サービスを呼び出す Java アプリケーションロジックを作成します。次のコードは、RenderFormFragment Java サーブレットの構文を示します。

     public class RenderFormFragment extends HttpServlet implements Servlet {
         public void doGet(HttpServletRequest req, HttpServletResponse resp
         throws ServletException, IOException {
         doPost(req,resp);

         }
         public void doPost(HttpServletRequest req, HttpServletResponse resp
         throws ServletException, IOException {
             //Add code here to invoke the Forms service
             }

通常、Java サーブレットの doGet または doPost メソッドにはクライアントコードを配置しません。より優れたプログラミング方法は、このコードを別のクラスに配置し、doPost メソッド（または doGet メソッド）内からクラスをインスタンス化し、適切なメソッドを呼び出すことです。ただし、コードを簡潔にするため、このセクションのコード例は最低限に抑えられており、コード例は doPost メソッドに配置されています。

Forms サービス API を使用してフラグメントに基づいてフォームをレンダリングするには、次のタスクを実行します。

1. adobe-livecycle-client.jar などのクライアント JAR ファイルを Java プロジェクトのクラスパスに含めます。これらのファイルの場所については、AEM Forms Java ライブラリファイルを含めるを参照してください。

2. HTML フォームから送信されたラジオボタンの値を取得し、米国データとカナダデータのどちらを使用するかを指定します。米国データが送信された場合、Purchase Order US.xml のデータを格納する com.adobe.idp.Document を作成します。同様に、カナダの場合は、Purchase Order Canada.xml ファイルのデータを格納する com.adobe.idp.Document を作成します。

3. 接続プロパティを含む ServiceClientFactory オブジェクトを作成します（接続プロパティの設定を参照）

4. コンストラクターを使用して ServiceClientFactory オブジェクトを渡すことによって、FormsServiceClient オブジェクトを作成します。

5. コンストラクターを使用して、URI 値を格納する URLSpec オブジェクトを作成します。

6. URLSpec オブジェクトの setApplicationWebRoot メソッドを呼び出して、アプリケーションの web ルートを表す文字列値を渡します。

7. URLSpec オブジェクトの setContentRootURI メソッドを呼び出して、コンテンツルート URI 値を指定する文字列値を渡します。フォームデザインとフラグメントがコンテンツルート URI に配置されていることを確認します。そうでない場合、Forms サービスは例外をスローします。AEM Forms リポジトリを参照するには、repository:// を指定してください。

8. URLSpec オブジェクトの setTargetURL メソッドを呼び出して、フォームデータの送信先となるターゲット URL 値を指定する文字列値を渡します。フォームデザインでターゲット URL を定義する場合、空の文字列を渡すことができます。また、計算を実行するためのフォームの送信先の URL を指定することもできます。

9. FormsServiceClient オブジェクトの renderPDFForm メソッドを呼び出して次の値を渡します。

   • ファイル名拡張子を含んだフォームデザイン名を指定する文字列値。
   • フォームに結合するデータを含む com.adobe.idp.Document オブジェクト（手順 2 で作成）。
   • 実行時オプションを保存する PDFFormRenderSpec オブジェクト。詳細情報については、「AEM Forms API リフェレンス」を参照してください。
   • URLSpec フラグメントに基づいてフォームをレンダリングするために Forms サービスで必要な URI 値を含むオブジェクト。
   • 添付ファイルを保存する java.util.HashMap オブジェクト。オプションのパラメーターです。フォームにファイルを添付しない場合は null を指定できます。

   renderPDFForm メソッドは、クライアントの Web ブラウザーに書き込む必要があるフォームデータストリームを含む FormsResult オブジェクトを返します。

10. FormsResult オブジェクトの getOutputContent メソッドを呼び出して、com.adobe.idp.Document オブジェクトを作成します。

11. getContentType メソッドを呼び出して、com.adobe.idp.Document オブジェクトのコンテンツタイプを取得します。

12. javax.servlet.http.HttpServletResponse オブジェクトのコンテンツタイプを設定するには、setContentType メソッドを呼び出して、com.adobe.idp.Document オブジェクトのコンテンツタイプを渡します。

13. javax.servlet.http.HttpServletResponse オブジェクトの getOutputStream メソッドを呼び出して、フォームデータストリームをクライアント web ブラウザーに書き込むために使用される javax.servlet.ServletOutputStream オブジェクトを作成します。

14. com.adobe.idp.Document オブジェクトの getInputStream メソッドを呼び出して java.io.InputStream オブジェクトを作成します。

15. InputStream オブジェクトの read メソッドを呼び出して、引数としてバイト配列を渡すことで、バイト配列を作成し、フォームデータストリームを入力します。

16. javax.servlet.ServletOutputStream オブジェクトの write メソッドを呼び出して、クライアント web ブラウザーにフォームデータストリームを送信します。バイト配列を write メソッドに渡します。

次のコード例は、Formsサービスを呼び出し、フラグメントに基づいてフォームをレンダリングする Java サーブレットを表しています。

 /*
     * This Java Quick Start uses the following JAR files
     * 1. adobe-forms-client.jar
     * 2. adobe-livecycle-client.jar
     * 3. adobe-usermanager-client.jar
     *
     * (Because Forms quick starts are implemented as Java servlets, it is
     * not necessary to include J2EE specific JAR files - the Java project
     * that contains this quick start is exported as a WAR file which
     * is deployed to the J2EE application server)
     *
     * These JAR files are located in the following path:
     * <install directory>/sdk/client-libs
     *
     * For complete details about the location of these JAR files,
     * see "Including AEM Forms library files" in Programming with AEM forms
     */
 import java.io.File;
 import java.io.FileInputStream;
 import java.io.IOException;
 import java.io.PrintWriter;

 import javax.servlet.Servlet;
 import javax.servlet.ServletException;
 import javax.servlet.ServletOutputStream;
 import javax.servlet.http.HttpServlet;
 import javax.servlet.http.HttpServletRequest;
 import javax.servlet.http.HttpServletResponse;
 import com.adobe.livecycle.formsservice.client.*;
 import java.util.*;
 import java.io.InputStream;
 import java.net.URL;

 import com.adobe.idp.Document;
 import com.adobe.idp.dsc.clientsdk.ServiceClientFactory;
 import com.adobe.idp.dsc.clientsdk.ServiceClientFactoryProperties;

 public class RenderFormFragment extends HttpServlet implements Servlet {

     public void doGet(HttpServletRequest req, HttpServletResponse resp)
         throws ServletException, IOException {
             doPost(req,resp);

     }
     public void doPost(HttpServletRequest req, HttpServletResponse resp)
     throws ServletException, IOException {



         try{
             //Set connection properties required to invoke AEM Forms
             Properties connectionProps = new Properties();
             connectionProps.setProperty(ServiceClientFactoryProperties.DSC_DEFAULT_SOAP_ENDPOINT, "https://[server]:[port]");
             connectionProps.setProperty(ServiceClientFactoryProperties.DSC_TRANSPORT_PROTOCOL,ServiceClientFactoryProperties.DSC_SOAP_PROTOCOL);
             connectionProps.setProperty(ServiceClientFactoryProperties.DSC_SERVER_TYPE, "JBoss");
             connectionProps.setProperty(ServiceClientFactoryProperties.DSC_CREDENTIAL_USERNAME, "administrator");
             connectionProps.setProperty(ServiceClientFactoryProperties.DSC_CREDENTIAL_PASSWORD, "password");

             //Get the value of selected radio button
             String radioValue = req.getParameter("radio");

             //Create an Document object to store form data
             Document oInputData = null;

             //The value of the radio button determines the form data to use
             //which determines which fragments used in the form
             if (radioValue.compareTo("AMERICAN") == 0)            {
                 FileInputStream myData = new FileInputStream("C:\\Adobe\Purchase Order US.xml");
                 oInputData = new Document(myData);
             }
             else if (radioValue.compareTo("CANADIAN") == 0)            {
                 FileInputStream myData = new FileInputStream("C:\\Adobe\Purchase Order Canada.xml");
                 oInputData = new Document(myData);
             }

             //Create a ServiceClientFactory object
             ServiceClientFactory myFactory = ServiceClientFactory.createInstance(connectionProps);

             //Create a FormsServiceClient object
             FormsServiceClient formsClient = new FormsServiceClient(myFactory);

             //Set the parameter values for the renderPDFForm method
             String formName = "Applications/FormsApplication/1.0/FormsFolder/Purchase Order Dynamic.xdp";

             //Cache the PDF form
             PDFFormRenderSpec pdfFormRenderSpec = new PDFFormRenderSpec();
             pdfFormRenderSpec.setCacheEnabled(new Boolean(true));

             //Specify URI values that are required to render a form
             //design based on fragments
             URLSpec uriValues = new URLSpec();
             uriValues.setApplicationWebRoot("https://[server]:[port]/RenderFormFragment");
             uriValues.setContentRootURI("repository:///");
             uriValues.setTargetURL("https://[server]:[port]/FormsServiceClientApp/HandleData");

             //Invoke the renderPDFForm method and write the
             //results to a client web browser
             FormsResult formOut = formsClient.renderPDFForm(
                         formName,               //formQuery
                         oInputData,             //inDataDoc
                         pdfFormRenderSpec,      //PDFFormRenderSpec
                         uriValues,                //urlSpec
                         null                    //attachments
                         );

             //Create a Document object that stores form data
             Document myData = formOut.getOutputContent();

             //Get the content type of the response and
             //set the HttpServletResponse object’s content type
             String contentType = myData.getContentType();
             resp.setContentType(contentType);

             //Create a ServletOutputStream object
             ServletOutputStream oOutput = resp.getOutputStream();

             //Create an InputStream object
             InputStream inputStream = myData.getInputStream();

             //Write the data stream to the web browser
             byte[] data = new byte[4096];
             int bytesRead = 0;
             while ((bytesRead = inputStream.read(data)) > 0)
             {
                 oOutput.write(data, 0, bytesRead);
             }

         }catch (Exception e) {
              System.out.println("The following exception occurred: "+e.getMessage());
       }
     }
 }

Web ページの作成

index.html の Web ページは、Java サーブレットへのエントリポイントを提供し、Forms サービスを呼び出します。この Web ページは、2 つのラジオボタンと 1 つの送信ボタンを含む基本的な HTML フォームです。ラジオボタンの名前は radio です。ユーザーが送信ボタンをクリックすると、フォームデータが RenderFormFragment Java サーブレットに投稿されます。

Java サーブレットは、次の Java コードを使用して、HTML ページからポストされるデータをキャプチャします。

             Document oInputData = null;

             //Get the value of selected radio button
             String radioValue = req.getParameter("radio");

             //The value of the radio button determines the form data to use
             //which determines which fragments used in the form
             if (radioValue.compareTo("AMERICAN") == 0)            {
                 FileInputStream myData = new FileInputStream("C:\\Adobe\Purchase Order US.xml");
                 oInputData = new Document(myData);
             }
             else if (radioValue.compareTo("CANADIAN") == 0)            {
                 FileInputStream myData = new FileInputStream("C:\\Adobe\Purchase Order Canada.xml");
                 oInputData = new Document(myData);
             }

次の HTML コードは、開発環境のセットアップ中に作成された index.html ファイルにあります（Web プロジェクトの作成を参照）。

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "https://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 <html xmlns="https://www.w3.org/1999/xhtml">
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 <title>Untitled Document</title>
 </head>

 <body>
 <form name="myform" action="https://[server]:[port]/FragmentsWebApplication/RenderFormFragment" method="post">
      <table>
      <tr>
        <th>Forms Fragment Web Client</th>
      </tr>
      <tr>
        <td>
          <label>
          <input type="radio" name="radio" id="radio_Data" value="CANADIAN" />
          Canadian data<br />
          </label>
          <p>
            <label>
            <input type="radio" name="radio" id="radio_Data" value="AMERICAN" checked/>
            American data</label>
          </p>
        </td>
      </tr>
      <tr>
      <td>
        <label>
          <input type="submit" name="button_Submit" id="button_Submit" value="Submit" />
            </label>
            </td>
         </tr>
        </table>
      </form>
 </body>
 </html>

Web アプリケーションのパッケージ化

Forms サービスを呼び出す Java サーブレットをデプロイするには、web アプリケーションを WAR ファイルにパッケージ化します。コンポーネントのビジネスロジックが依存する外部 JAR ファイル（adobe-livecycle-client.jar や adobe-forms-client.jar など）も WAR ファイルに含めるようにします。

Web アプリケーションを WAR ファイルにパッケージ化するには、次の手順に従います。

1. プロジェクトエクスプローラ​ウィンドウで、FragmentsWebApplication プロジェクトを右クリックして、 書き出し／WAR ファイル​を選択します。
2. 「Web モジュール」テキストボックスで、Java プロジェクトの名前として FragmentsWebApplication と入力します。
3. 宛先​テキストボックスで、ファイル名にFragmentsWebApplication.war と入力し、WAR ファイルの場所を指定して「完了」をクリックします。

J2EE アプリケーションサーバーへの WAR ファイルのデプロイ

WAR ファイルは、AEM Forms がデプロイされている J2EE アプリケーションサーバーにデプロイできます。WAR ファイルをデプロイした後は、Web ブラウザーを使用して HTML Web ページにアクセスできます。

J2EE アプリケーションサーバーに WAR ファイルをデプロイするには、次の手順に従います。

• WAR ファイルをエクスポートパスからにコピーします。 [Forms Install]\Adobe\Adobe Experience Manager Forms\jboss\server\all\deploy

Web アプリケーションのテスト

Web アプリケーションをデプロイした後、Web ブラウザーを使用してテストできます。AEM Forms をホストしているコンピューターを使用している場合は、次の URL を指定できます。

• http://localhost:8080/FragmentsWebApplication/index.html

  「ラジオ」ボタンを選択し、「送信」ボタンをクリックしてください。フラグメントに基づくフォームが Web ブラウザーに表示されます。問題が発生した場合は、J2EE アプリケーションサーバーのログファイルを参照してください。

Business.Adobe.com リソース

Content Insights Embedded Charts Mobile Forms Responsive Forms Content As A Service Digital Signage