パート2:クライアント・アプリケーションの開発
ここでは、EJ/JPAコンポーネントをベースとするデータ・コントロールを使用したJSFページの作成を開始します。

Data Controlsパネルから項目をドラッグし、特定のUIコンポーネントとしてページ上にドロップすることで、データ・バインドされたユーザー・インタフェースを設計できます。データ・コントロールを使用してUIコンポーネントを作成する場合、JDeveloperによって自動的に各種コードおよびオブジェクトが作成され、選択したデータ・コントロールに対してコンポーネントがバインドされます。
ステップ1:部門RESTデータ・コントロールの作成

次の手順では、部門サービス用のデータ・コントロールを構築します。この新しいRESTサービス・データ・コントロール(REST DC)を通じて、RESTサービスがOracle ADF内で使用されます。REST DCモデルを作成するには、次の手順を実行します。

ここでは、部門リソース用のRESTデータ・コントロールを作成します。このデータ・コントロールは、サービスのGETリクエストに対する1つのメソッドを公開し、部門のリストを表示するようXMLレスポンスに要求します。
  1. Oracle JDeveloperで、「File」→「Open」を選択し、サンプル・アプリケーションのZIPファイルの解凍済みコンテンツを含むディレクトリにナビゲートします。RestClientAppフォルダを開き、「RestClientApp.jws」ファイルを選択します。

    コンテキスト・メニューのNewオプション
  2. Model」プロジェクトを選択し、「File」→「New」→「From Gallery」を選択します。「Business Tier」→「Web Services」を展開し、「Web Service Data Control (SOAP / REST)」を選択します。「OK」をクリックします。

    New GalleryでPage項目を選択
  3. Create Web Service Data Controlダイアログ・ボックスで、NameフィールドにDepartmentRestDCと入力し、「REST」ラジオ・ボタンを選択します。

    Create JSF Pageウィザード

     

  4. Connectionフィールドの横にある緑色のプラス記号アイコン(「+」)をクリックします。

    Create URL Connectionダイアログ・ボックスで、NameフィールドにDepartmentsRestConnと入力します。

    URL Endpointフィールドにhttp://127.0.0.1:7101/hr-restservice-context-root/resources/tut/departmentと入力します。
    注:URL Endpoint URLの末尾にスラッシュは付けません。

    Test Connection」ボタンをクリックし、このサービスが利用できることを確認します。利用できない場合は、EjbRestServiceに戻り、DepartmentServiceをテストします。

    Structureペインとプロパティ・インスペクタ
  5. OK」をクリックし、Create Web Service Data Controlダイアログ・ボックスで「Next」をクリックします。

    Panel Accordionをページにドラッグ
  6. Resource Pathsラベルの横にある緑色のプラス記号アイコン(「+」)をクリックします。
    Resource Pathsの値を/に変更し、「GET」を選択します。
    Method Display NamegetAllDepartmentsと入力します。
    Next」をクリックします。

    プロパティ・インスペクタ

  7. Resource Methodsの下の「getAllDepartments」を選択し、Response XSDフィールドの横にある参照ボタン(虫眼鏡アイコン)をクリックします。

    ダイアログ・ボックスで、xsdフォルダを開き、「DepartmentsList.xsd」ファイルを選択して「Open」をクリックします。

    プロパティ・インスペクタ

  8. 「Next」をクリックし、「Test URL Connection」ボタンをクリックします。「Finish」をクリックしてデータ・コントロールを作成します。

    Structureペイン
  9. Save AllボタンSave Allアイコンをクリックして作業内容を保存します。

ステップ2:従業員RESTデータ・コントロールの作成

次の手順では、2つ目のデータ・コントロールを作成します。次に構築する従業員RESTデータ・コントロールは、部門データ・コントロールよりもやや複雑で、GET、POST、DELETEの3つのREST HTTPメソッドを公開します。また、GETとDELETEについては入力引数を定義する必要もあります。

  1. もう一度、Oracle JDeveloper Applicationウィンドウで、「Model」プロジェクトを右クリックし、「New」→「Web Service Data Control (SOAP / REST)」を選択します。

    データ・コントロールをページにドロップ

  2. Create Web Service Data Controlダイアログ・ボックスで、NameフィールドにEmployeeRestDCと入力し、

    REST」ラジオ・ボタンを選択します。

    Createダイアログ
  3. Connectionフィールドの横にある緑色のプラス記号アイコン(「+」)をクリックします。
    Create URL Connectionダイアログ・ボックスで、NameフィールドにEmployeesRestConnと入力します。
    URL Endpointフィールドにhttp://127.0.0.1:7101/hr-restservice-context-root/resources/tut/employeeと入力します。

    Test Connection」ボタンをクリックします。

    Edit Form Fieldsダイアログ
  4. OK」、「Next」の順にクリックします。

    Edit Form Fieldsダイアログ

  5. Resource Pathsラベルの横にある緑色のプラス記号アイコン(「+」)をクリックします。
    Resource Pathsの値を/path0から/##departmentId##に変更し、「GET」を選択します。Method Display NameのGETの値としてgetEmployeesByDepartmentと入力します。

    注:##departmentId##フラグは、Oracle ADF RESTデータ・コントロールのパラメータを定義するものです。パラメータ名は、データ・コントロール・パネル内でメソッドの引数として示されます。

    データ・コントロールをページにドロップ

  6. もう一度、Resource Pathsラベルの横にある緑色のプラス記号アイコン(「+」)をクリックします。
    Resource Pathsの値を/path0から/に変更し、「POST」を選択します。Method Display NameのPOSTの値としてupdateEmployeeと入力します。

    データ・コントロールをページにドロップ
  7. もう一度、Resource Pathsラベルの横にある緑色のプラス記号アイコン(「+」)をクリックします。
    Resource Pathsの値を/path0から/##employeeId##に変更し、「DELETE」を選択します。Method Display NameのDELETEの値としてremoveEmployeeと入力します。

    次に、「Next」をクリックします。

    Createダイアログ
  8. Resource Methodsリストから「removeEmployee」を選択し、(URL Parametersセクションで)employeeIdのデフォルト値として100と入力します。
    注:この100という値は、設計時にRESTメソッドのリクエストが有効であることを確認するために使用されます(削除処理は実行されません)。

    Edit Table Columnsダイアログ
  9. Resource Methodsリストから「updateEmployee」を選択し、Payload XSDフィールドの横にある参照ボタン(虫眼鏡アイコン)をクリックします。

    Openダイアログ・ボックスで、xsdフォルダを開き、「Employee.xsd」ファイルを選択して「Open」をクリックします。

    注:RESTサービスの更新メソッドには、Employee型のオブジェクト引数が1つあります。この型はJAXBオブジェクトとして定義されるため、XMLとのマーシャリング/アンマーシャリングが可能です。そのため、この引数にはXML表現を指定します。

    Edit Table Columnsダイアログ
  10. Resource Methodsリストから「getEmployeesByDepartment」を選択し、Response XSDフィールドの横にある参照ボタン(虫眼鏡アイコン)をクリックします。

    Openダイアログ・ボックスで、xsdフォルダを開き、「EmployeesList.xsd」ファイルを選択して「Open」をクリックします。

    Edit Table Columnsダイアログ
  11. (URL Parametersセクションで)departmentIdのデフォルト値として60と入力します。ここでも、このデフォルト値は、REST URIの検証のために設計時にのみ使用されます。

    Edit Table Columnsダイアログ
  12. Next」をクリックし、「Test URL Connection」をクリックします。

    データ・コントロールをページにドロップ
  13. テストが成功したら、「Finish」をクリックします。テストが失敗した場合は、指定したREST URIを確認し、修正します。

    Applicationウィンドウで、「Data Controls」パネルを展開し、「Refresh」ボタン(2本の矢印のアイコン)をクリックしてリフレッシュします。2つのデータ・コントロールが表示されるようになります。

    Createメニュー
  14. Save AllボタンSave Allアイコンをクリックして作業内容を保存します。

ステップ3:マスター・ディテール・ページの構築
  1. 最後に、作成したRESTサービスとRESTデータ・コントロールを使用して、マスター・ディテール・ページを構築します。マスター・ディテール・ページを作成するには、次の手順を実行します。

    Applicationウィンドウで、「ViewController」プロジェクトを展開し、「Web Content」→「pages」ノードを展開します。
    DeptEmp.jsf」ページをダブルクリックして、ビジュアル・ページ・エディタで開きます。

    コンテキスト・メニュー
  2. Data Controls」パネルを展開し、「DepartmentRestDC」→「getAllDepartments()」→「departmentList」ノードを展開します。

    Webブラウザ内に表示されたページ

  3. Data Controlsパネルから「alldepartments」エントリをドラッグし、ビジュアル・ページ・エディタのDepartments領域にドロップします。

    Createメニューから「ADF Form」を選択します。

    Webブラウザ内に表示されたページ

  4. Create Formダイアログ・ボックスで、「Read-Only Form」チェック・ボックスを選択します。
    Include Controls forセクションで、「Row Navigation」を選択し、フィールドはすべてデフォルト値のままにします。

    OK」をクリックします。

    Webブラウザ内に表示されたページ

  5. Data Controlsパネルで、「EmployeeRestDc」→「getEmployeesByDepartment」→「employeeList」ノードを展開します。

    Data Controlsパネルから「allemployees」エントリをドラッグし、ビジュアル・ページ・エディタのEmployees領域にドロップします。

    Createメニューから「Table/List View」→「ADF Table」を選択します。

    Webブラウザ内に表示されたページ

  6. Create Tableダイアログ・ボックスで「Single Row」と「Read-Only Table」を選択します。必要に応じて、従業員の属性を適切な順に並べ替えます。
    OK」をクリックします。

    Webブラウザ内に表示されたページ
  7. Edit Action Bindingダイアログ・ボックスで、departmentIdの値として#{bindings.departmentId.inputValue}と入力し、「OK」をクリックします。

    Webブラウザ内に表示されたページ
  8. Structureウィンドウで、Employees領域の「table」をクリックします。ビジュアル・エディタの下側のブレッドクラムが最後の要素として(太字で)ハイライト表示されて、af:table#t1クラムと表示されます。そうでない場合は、このブレッドクラムをクリックして表を選択します。

    Webブラウザ内に表示されたページ
  9. Propertiesウィンドウを開き(「Window」→「Properties」)、Behaviorカテゴリの下の「PartialTriggers」プロパティにナビゲートし、::b1 ::b2 ::b3 ::b4と入力します。

    注:::b1から::b4は、表のリフレッシュ時にトリガーされる各ナビゲーション・ボタンのIDです。ユーザーが部門のリストにナビゲートしたときは、従業員のリストがリフレッシュされ、選択した部門の従業員のみが表示されます。

    Webブラウザ内に表示されたページ

  10. すべての作業内容を保存します。

    ここでは、前のステップで作成した部門RESTサービス、部門RESTデータ・コントロール、および従業員RESTデータ・コントロールを使用するマスター・ディテール・ページを作成しました。

ステップ4:アプリケーションの実行とテスト
ここでは、RESTサービス機能の実行とテストを行います。
  1. Applicationパネルで、「ViewController」→「Web Content」→「pages」を展開し、「DepEmp.jsf」ファイル・ノードを右クリックして「Run」を選択します。

    Create操作のドロップ
  2. Departmentsセクションのナビゲーション・ボタンを使用して表示を変更し、従業員のリストがリフレッシュされることを確認します。

    コンテキスト・メニュー

    Delete操作のドロップ

  3. ブラウザ・ウィンドウを閉じて、JDeveloperに戻ります。これでチュートリアルは完了です。

ブックマーク 印刷 すべて表示 | すべて非表示
トップに戻る
Copyright © 2014, Oracle and/or its affiliates. All rights reserved.