Web インターフェイスを作成する(InterBase チュートリアル)
チュートリアル:Delphi および C++ アプリケーションで InterBase データベースを使用する への移動
このセクションでは、サーバーに対するクライアントを、ローカル アプリケーションではなく Web アプリケーションとして作成する方法を説明します。
このクライアントは、「DataSnap サーバーでサーバー側コンポーネントを作成する」で作成したサーバーを使用します。 サーバーが Delphi と C++ のどちらで実装されていても問題ありません。 Delphi でサーバーを、C++ でクライアントを実装することも、その逆の組み合わせにすることも可能です。
RAD Studio では、ローカル アプリケーションとほとんど同じように Web アプリケーションを開発できます。 ただし、ビジュアル コンポーネントには、前のセクションで使用したビジュアル コンポーネントではなく、Web に対応した IntraWeb コンポーネントを使用します。 これらのコンポーネントの多くは、Web 非対応のコンポーネントとほとんど同じ名前ですが、先頭が "T" ではなく "TIW" になっています。 この後の例では、TIWButton、TIWDBGrid、TIWDBNavigator コンポーネントを使用しますが、これらの目的は TButton、TDBGrid、TDBNavigator コンポーネントと同じです。 データベースに関しては、ローカル クライアントと Web クライアントの両方で同じコンポーネントを使用します。
以下は、Web クライアントを作成する手順です。
- 新しいプロジェクトを作成します。 メイン メニューで[ファイル|新規作成|その他...]のメニュー項目をクリックし、[新規作成]ダイアログを開きます。
- Delphi の場合は、[Delphi プロジェクト|VCL for the Web|VCL for the Web Application Wizard]を選択します。
- C++ の場合は、[VCL for the Web|VCL for the Web Application Wizard]を選択します。
- [OK]をクリックしてウィザードを開きます。
- プロジェクト名に "WebClient" を指定します。 [Browse...]ボタンをクリックし、プロジェクト用のディレクトリを選択します。 [Ok]をクリックします。 ウィザードによって一連のファイルが作成されます。
- [プロジェクト マネージャ]から UserSessionUnit を表示します。 次の図のように、このフォームに 2 つのコンポーネントを追加します。
- ローカル アプリケーションの場合と同様に、クライアントを作成するにはサーバーが起動している必要があります。 サーバーが起動していない場合には、「リッチクライアント インターフェイスを作成する」の手順に沿って、デバッガを使わずにサーバーを実行します。
- 以下のコンポーネントを UserSessionUnit フォーム(IWUserSession オブジェクト)に配置します。
- [TSQLConnection]を追加し、「リッチクライアント インターフェイスを作成する」と同様に構成します。
- TSQLConnection の[Driver]プロパティを "DataSnap" に設定します。
- [LoginPrompt]を[False]に設定します。
- [Connected]プロパティを[True]に設定します。
- TSQLConnection を右クリックし、[DataSnap クライアント クラスの生成]を選択します。 クライアント クラスが含まれている、新しく生成されたこのユニットを保存します。
- Delphi の場合は、ユニットを「Un_web_client_proxy.pas」という名前で保存します。
- C++ の場合は、ユニットを「Un_web_client_proxy.cpp」という名前で保存します。
- [TDSProviderConnection]コンポーネントをフォーム上に配置します。
- [SQLConnection]プロパティを "SQLConnection1" に設定します。
- [ServerClassName]プロパティを "TDSServerModule1" に設定します。
- [TSQLConnection]を追加し、「リッチクライアント インターフェイスを作成する」と同様に構成します。
- Web インターフェイスを作成します。
- Delphi の場合は、このユニットの名前を「Un_web_client.pas」に変更します。 Un_web_client.pas の
uses
句に UserSessionUnit を追加します。 - C++ の場合は、このユニットの名前を「Un_web_client.cpp」に変更します。 次の行を
- Un_web_client.cpp 内の他のインクルードの後に追加します。
- データベース接続を行うために必要なコンポーネントを追加します。
- [TClientDataSet]をフォーム上に配置します。
- TClientDataSet の[RemoteServer]プロパティを "IWUserSession.DSProviderConnection1" に設定します。これは、先ほど UserSessionUnit の IWUserSession(フォーム)に追加した TDSProviderConnection コンポーネントです。
- [ProviderName]プロパティをドロップダウン メニューの "ServerDataSetProvider1" に設定します。
- [TDataSource]を追加します。
- [DataSet]プロパティをドロップダウン メニューの ClientDataSet1 に設定します。
- 上の図のように、ビジュアル コンポーネントをフォーム上に配置します。
- [TIWDBNavigator]を配置します。
- [TIWDBGrid]をフォームにドラッグします。 [Caption]を「Client Demo」に設定します。
- TIWDBNavigator と TIWDBGrid の両方の[DataSource]プロパティを、ドロップダウン メニューの "DataSource1" に設定します。
- [TIWButton]を追加します。 [Caption]を「Load R/W」に変更します。 この TIWButton は、対応するローカル クライアント アプリケーションのボタンとまったく同じ機能を持つもので、グリッド内にテーブル データを表示します。 TIWButton の
[OnClick]
イベントのイベント ハンドラを作成し、次のコードを記述します。 - ファイルをすべて保存し、プロジェクトをビルドします。
- プロジェクトを実行すると、IntraWeb アプリケーション サーバーが開きます。
Delphi
UserSessionUnit.pas をダブルクリックしてフォームを表示します。
C++
UserSessionUnit.cpp をダブルクリックしてフォームを表示します。
メモ:TDSServerModule1 は、「DataSnap サーバーでサーバー側コンポーネントを作成する」で作成したサーバー クラスの名前です。 このサーバー クラスの名前は、先ほど作成した Un_web_client_proxy.pas または Un_web_client_proxy.cpp のプロキシ クラスでも使われています。 サーバー クラスの名前は、ストアド プロシージャを呼び出す次のコード行で使われています。
Delphi
FcallStoredProcedureCommand.Text := 'TDSServerModule1.callStoredProcedure';
C++
FcallStoredProcedureCommand->Text = "TDSServerModule1.callStoredProcedure";
[プロジェクト マネージャ]で Unit1 モジュールをダブルクリックします。
# include "UserSessionUnit.h"
次の図は、Web インターフェイスとなるフォームにこれから追加するコンポーネントを示しています。
[デザイン]タブをクリックして、Un_web_client の Web フォームを表示します。
Delphi
procedure TIWForm1.IWButton1Click(Sender: TObject);
begin
ClientDataSet1.Active := true;
end;
C++
void __fastcall TIWForm1::IWButton1Click(TObject *Sender)
{
ClientDataSet1->Active = true;
}
[Load R/W]ボタンをクリックすると、テーブル データが次のように TIWDBGrid に表示されます。
これで、サーバーに対する Web インターフェイスが完成しました。 この Web インターフェイスを拡張して、前のセクションで作成したローカル クライアントのすべての機能を持たせることもできます。 「リッチクライアント インターフェイスを作成する」で使用したものに対応する IntraWeb ビジュアル コンポーネントと、同じデータベース コンポーネントを追加してください。