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

このドキュメントのサンプルと例は、JEE環境上のAEM Formsに対してのみ提供されています。

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

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

メモ

この節では、Formsサービスを呼び出し、フラグメントに基づいてフォームをレンダリングするJavaサーブレットを使用するWebベースのアプリケーションを作成する方法について説明します。 (フラグメントに基づくFormsのレンダリングを参照)。

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

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

cw_cw_fragmentwebclient

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

cw_cw_fragmentformfooter

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

cw_cw_fragmentformfootercnd

メモ

フラグメントを基にしたフォームデザインの作成について詳しくは、Formsデザイナーを参照してください。

サンプルファイル

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

<>Formsデザイナーのインストールディレクトリ​>/Samples/Forms/発注書/フォームフラグメント

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

cw_cw_fragmentsrepository

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

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

メモ

Workbenchを使用したFormsアプリケーションの作成について詳しくは、workbenchヘルプを参照してください。

手順の概要

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

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

これらの手順の一部は、AEM FormsがデプロイされているJ2EEアプリケーションに依存しています。 例えば、WARファイルのデプロイに使用する方法は、使用しているJ2EEアプリケーションサーバーによって異なります。 この節では、AEM FormsがJBoss®にデプロイされていることを前提としています。

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

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

Webプロジェクトを作成するには:

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

必要なJARファイルをプロジェクトに追加するには:

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

プロジェクトにJavaサーブレットを追加するには:

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

プロジェクトにHTMLページを追加するには:

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

RenderFormFragment Javaサーブレットを呼び出すHTMLページの作成について詳しくは、Webページの作成を参照してください。

サーブレット用の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. Javaプロジェクトのクラスパスに、adobe-forms-client.jarなどのクライアントJARファイルを含めます。 これらのファイルの場所については、AEM Forms Java ライブラリファイルを含めるを参照してください。

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

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

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

  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メソッドを呼び出し、次の値を渡します。

    • ファイル名拡張子を含むフォームデザイン名を指定するstring値。
    • フォームとマージするデータを含むcom.adobe.idp.Documentオブジェクト(手順2で作成)。
    • 実行時オプションを格納するPDFFormRenderSpecオブジェクト。 詳しくは、AEM FormsAPIリファレンスを参照してください。
    • フラグメントに基づいてフォームをレンダリングするためにFormsサービスで必要なURI値を含むURLSpecオブジェクトです。
    • 添付ファイルを格納するjava.util.HashMapオブジェクト。 これはオプションのパラメーターです。フォームにファイルを添付しない場合は、nullを指定できます。

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

  10. FormsResultオブジェクト's 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 module」テキストボックスに、Javaプロジェクトの名前として「FragmentsWebApplication」と入力します。
  3. 宛先」テキストボックスに、ファイル名にFragmentsWebApplication.war​と入力し、WARファイルの場所を指定して、「完了」をクリックします。

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

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

WARファイルをJ2EEアプリケーションサーバーにデプロイするには:

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

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

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

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

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

このページ

Adobe Summit Banner

A virtual event April 27-28.

Expand your skills and get inspired.

Register for free
Adobe Summit Banner

A virtual event April 27-28.

Expand your skills and get inspired.

Register for free
Adobe Maker Awards Banner

Time to shine!

Apply now for the 2021 Adobe Experience Maker Awards.

Apply now
Adobe Maker Awards Banner

Time to shine!

Apply now for the 2021 Adobe Experience Maker Awards.

Apply now