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 クライアントを作成する手順です。

1. 新しいプロジェクトを作成します。 メイン メニューで［ファイル｜新規作成｜その他...］のメニュー項目をクリックし、［新規作成］ダイアログを開きます。

• 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］をクリックします。 ウィザードによって一連のファイルが作成されます。

2. ［プロジェクト マネージャ］から UserSessionUnit を表示します。 次の図のように、このフォームに 2 つのコンポーネントを追加します。

Delphi

UserSessionUnit.pas をダブルクリックしてフォームを表示します。




C++

UserSessionUnit.cpp をダブルクリックしてフォームを表示します。






ローカル アプリケーションの場合と同様に、クライアントを作成するにはサーバーが起動している必要があります。 サーバーが起動していない場合には、「リッチクライアント インターフェイスを作成する」の手順に沿って、デバッガを使わずにサーバーを実行します。

以下のコンポーネントを UserSessionUnit フォーム（IWUserSession オブジェクト）に配置します。

1. ［TSQLConnection］を追加し、「リッチクライアント インターフェイスを作成する」と同様に構成します。
   • TSQLConnection の［Driver］プロパティを "DataSnap" に設定します。
   • ［LoginPrompt］を［False］に設定します。
   • ［Connected］プロパティを［True］に設定します。
   • TSQLConnection を右クリックし、［DataSnap クライアント クラスの生成］を選択します。 クライアント クラスが含まれている、新しく生成されたこのユニットを保存します。
     • Delphi の場合は、ユニットを「Un_web_client_proxy.pas」という名前で保存します。
     • C++ の場合は、ユニットを「Un_web_client_proxy.cpp」という名前で保存します。
2. ［TDSProviderConnection］コンポーネントをフォーム上に配置します。
   • ［SQLConnection］プロパティを "SQLConnection1" に設定します。
   • ［ServerClassName］プロパティを "TDSServerModule1" に設定します。

メモ：TDSServerModule1 は、「DataSnap サーバーでサーバー側コンポーネントを作成する」で作成したサーバー クラスの名前です。 このサーバー クラスの名前は、先ほど作成した Un_web_client_proxy.pas または Un_web_client_proxy.cpp のプロキシ クラスでも使われています。 サーバー クラスの名前は、ストアド プロシージャを呼び出す次のコード行で使われています。

Delphi

FcallStoredProcedureCommand.Text := 'TDSServerModule1.callStoredProcedure';

C++

FcallStoredProcedureCommand->Text = "TDSServerModule1.callStoredProcedure";

3. Web インターフェイスを作成します。

［プロジェクト マネージャ］で Unit1 モジュールをダブルクリックします。

• Delphi の場合は、このユニットの名前を「Un_web_client.pas」に変更します。 Un_web_client.pas の uses 句に UserSessionUnit を追加します。
• C++ の場合は、このユニットの名前を「Un_web_client.cpp」に変更します。 次の行を

# include "UserSessionUnit.h"

Un_web_client.cpp 内の他のインクルードの後に追加します。

次の図は、Web インターフェイスとなるフォームにこれから追加するコンポーネントを示しています。




［デザイン］タブをクリックして、Un_web_client の Web フォームを表示します。

4. データベース接続を行うために必要なコンポーネントを追加します。
• ［TClientDataSet］をフォーム上に配置します。
  • TClientDataSet の［RemoteServer］プロパティを "IWUserSession.DSProviderConnection1" に設定します。これは、先ほど UserSessionUnit の IWUserSession（フォーム）に追加した TDSProviderConnection コンポーネントです。
  • ［ProviderName］プロパティをドロップダウン メニューの "ServerDataSetProvider1" に設定します。
• ［TDataSource］を追加します。
  • ［DataSet］プロパティをドロップダウン メニューの ClientDataSet1 に設定します。
5. 上の図のように、ビジュアル コンポーネントをフォーム上に配置します。
• ［TIWDBNavigator］を配置します。
• ［TIWDBGrid］をフォームにドラッグします。 ［Caption］を「Client Demo」に設定します。
• TIWDBNavigator と TIWDBGrid の両方の［DataSource］プロパティを、ドロップダウン メニューの "DataSource1" に設定します。
• ［TIWButton］を追加します。 ［Caption］を「Load R/W」に変更します。 この TIWButton は、対応するローカル クライアント アプリケーションのボタンとまったく同じ機能を持つもので、グリッド内にテーブル データを表示します。 TIWButton の［OnClick］イベントのイベント ハンドラを作成し、次のコードを記述します。

Delphi

procedure TIWForm1.IWButton1Click(Sender: TObject);
begin
  ClientDataSet1.Active := true;
end;

C++

void __fastcall TIWForm1::IWButton1Click(TObject *Sender)
{
  ClientDataSet1->Active = true;
}

6. ファイルをすべて保存し、プロジェクトをビルドします。
7. プロジェクトを実行すると、IntraWeb アプリケーション サーバーが開きます。






メニュー項目［File｜Execute］をクリックするか、［Execute］ボタン（）をクリックして、プロジェクトを IntraWeb プロジェクトとして実行します。 デフォルトの Web ブラウザ上に Web フォームが表示されます。




［Load R/W］ボタンをクリックすると、テーブル データが次のように TIWDBGrid に表示されます。




これで、サーバーに対する Web インターフェイスが完成しました。 この Web インターフェイスを拡張して、前のセクションで作成したローカル クライアントのすべての機能を持たせることもできます。 「リッチクライアント インターフェイスを作成する」で使用したものに対応する IntraWeb ビジュアル コンポーネントと、同じデータベース コンポーネントを追加してください。

前のチュートリアル

リッチクライアント インターフェイスを作成する

関連項目

• IntraWeb（VCL for the Web）の利用
• IntraWeb を使用した Web サーバー アプリケーションの作成
• IntraWeb ファースト ステップ