この記事では、RAD Serverデータベースエンドポイントウィザードを使って、FireDAC接続により、RAD ServerのRESTエンドポイント(JSON Webサービス)を作成します。そして、データのCRUD(Create/Read/Update/Delete)操作を行うグリッドを持つSencha Webクライアントを作成し、これを利用します。
RAD Serverの構築手順
1. RAD Studio(DelphiまたはC++Builder)から、[ファイル|新規作成|その他]メニューを選択し、「RAD Server」カテゴリの「RAD Serverパッケージ」を選択して[OK]ボタンをクリックします。
2. RAD Serverパッケージウィザードで、「リソースを含むパッケージを作成する」を選択します。
[次へ]ボタンをクリックします。
3.「リソース名」に任意の名前を入力します。ファイルの種類に「データモジュール」を選択します。
[次へ]ボタンをクリックします。
4.「エンドポイント」ページで、「Sample End Points」と「API Documentation」の選択を解除し、「Database EndPoints」を選択します
[次へ]ボタンをクリックします。
5.「接続名」で既存のFireDAC接続を選択し、データベースにログインします。
正しいログイン情報を入力したら、[OK]ボタンをクリックします。
6.Sencha CRUDグリッドdWebアプリケーションに使用する1つ以上のテーブルを選択します。ここでは、EMPLOYEEデータベースからCOUNTRY、CUSTOMER、EMPLOYEEテーブルを選択します。
[完了]ボタンをクリックします。
7. ウィザードは、FireDACによるデータベース接続(FDConnection)、COUNTRY、CUSTOMER、EMPLOYEEの各テーブルに対するクエリー(qryCountry、qryCustomer、qryEmployee)、RAD Server (EMS) DataSetResourceコンポーネントが配置されたデータモジュールを生成します。
新しいEMSDataSetResourceコンポーネントを使用すれば、RAD Serverアプリケーションに接続するデスクトップ、マルチデバイス、Web、その他のサービスベースアプリケーションによって取得されるデータをより詳細に制御できます。この新しいコンポーネントにより、RAD Serverアプリケーションは、データセットのすべてのデータあるいはデータの特定ページへのアクセス、データセットレコードの更新、新しいデータセットレコードの作成、データセットエントリの削除といった機能を提供できます。
8.手順4で使用したウィザードの「エンドポイント」の箇所では、各テーブルにTEMSDataSetResourceコンポーネントも追加しています。オブジェクトインスペクタで確認すると、これらのテーブルのAllowed Actionsプロパティの各値(List、Get、Post、Put、Delete)にTrueが設定され、完全なCRUD機能が提供されていることが分かります。
9.[ファイル|プロジェクトに名前を付けて保存]メニューで、RAD ServerモジュールをRadServer_Sencha_CRUDという名称で保存します。
10.RAD Serverモジュールをビルドして実行します。RAD Serverログには、テーブルのデータにアクセスするためのRESTエンドポイントが表示されます。例えば、EMPLOYEEテーブルのGETには、次のようなRESTエンドポイントがあります。
[crayon-67390717d3f0c692959698/]このエンドポイントは、http://localhost:8080/mydata/EMPLOYEE/ になります。
11.このRESTエンドポイントをテストするには、RAD ServerコンソールUIで[ブラウザを開く]ボタンをクリックします。そして、URLに、http://localhost:8080/mydata/EMPLOYEE/ と入力します。これは、従業員テーブルデータを取得するためのJSON Webサービスです。
ブラウザには、JSON配列の形式で返されたEMPLOYEEテーブルのデータが表示されます。
以上でRAD Server側の構築は完了です。次に、このデータを使用するCRUDグリッドが配置されたSencha Webクライアントアプリケーションを作成しましょう。
Sencha Webクライアントアプリケーションの構築手順
1.Sencha Architectを起動します。
2.[New Project|Blank|Classic Project]を選択し[Create]ボタンをクリックします。
3.新しいSencha ExtJS Classsic Webアプリケーションが作成されました。
4.Sencha Data UI Builderアイコン
5.「Data Source」項目で「JSON Web Service」を選択します。
6.「Model Name」に「MyModel」と設定し、「URL」に使用するREST WebサービスのURL「http://localhost:8080/mydata/EMPLOYEE/」を入力します。
7.「Parts to Create」で、すべての項目(Model、Store、List View、Details View、Form View、Controller)にチェックを入れ、[Import Fiedls]ボタンをクリックします。
8.EMPLOYEEテーブルのすべての列(フィールド)が追加されます。
9.[Generate]ボタンをクリックします。
10.Sencha Project Inspectorを見ると、プロジェクトにビューとモデルが追加されたことが確認できます。
11.「MyModels」ビューを選択します。Senchaパネルには、初期ビューが表示されています。ここには、データのCRUD機能を提供する[Add][Edit][Remove]ボタンがあります。
以上で、RAD Server上で動作するFireDAC接続によるRAD ServerのRESTエンドポイント(JSON Webサービス)を、RAD Serverデータベースエンドポイントウィザードを用いて簡単に作成し、Sencha WebクライアントからCRUDグリッドによって利用する例を示しました。一連の手順が、極めて簡単であることをご理解いただけたと思います。
RAD Serverアプリケーションの構築は、RAD Studioトライアル版でお試しいただくことができます。
Sencha Webアプリケーションの構築(およびSencha Architect)については、Sencha Ext JSトライアル版でお試しいただくことができます。