EMS ペット クライアントの作成

提供: RAD Studio
移動先: 案内、 検索

チュートリアル：EMS クライアントを使用してカスタム EMS リソースにアクセスする への移動


EMS クライアント アプリケーションを作成して、EMS サーバーが公開している REST API を通じて EMS サーバーに接続することができます。 EMS サーバー リソースや EMS データベースの情報にアクセスするには、開発済みのカスタム EMS ペット リソースをこのチュートリアルの EMS ペット クライアント アプリケーションで使用する必要があります。

このチュートリアルの EMS クライアント アプリケーションには、以下のコンポーネントが必要です。

  • TEMSProvider コンポーネント。EMS サーバーとの接続をセットアップするために使用します。
  • TBackendEndpoint コンポーネント。EMS クライアント アプリケーションから特定の EMS リソース エンドポイント メソッド（EMS サーバーの REST API メソッドの 1 つ）にアクセスするために使用します。EMS クライアント アプリケーションは、TBackendEndpoint を呼び出して、EMS サーバーに対する JSON の GET や POST を行います。
メモ： TBackendEndpoint コンポーネントは、それぞれ 1 つの EMS リソース エンドポイントにアクセスするよう構成されます。アクセス先の EMS リソース エンドポイント メソッドの数だけ TBackendEndpoint を追加してください。

EMS リソース エンドポイントを呼び出すには、TBackendEndpoint コンポーネントの Method プロパティに、適切なメソッドを選択する必要があります。

EMS クライアント アプリケーションの作成

  1. マルチデバイス アプリケーションを新規作成します。
    • Delphi の場合： ［ファイル｜新規作成｜マルチデバイス アプリケーション - Delphi］
  2. ［ツール パレット］で TEMSProvider コンポーネントを探して TForm にドロップします。
  3. ［オブジェクト インスペクタ］で、EMS サーバー構成に合わせて以下のように EMS サーバー関連のパラメータを構成します。
    • URLHost： localhost
    • URLPort： 8080
    • URLProtocol： http
    EMSServerConnection.png
  4. ［接続テスト］ボタンをクリックします。接続が正しくセットアップされていれば、EMS サーバーの現在のバージョンを示すメッセージが出力されます。


リソース エンドポイント メソッドの呼び出し

EMS クライアント アプリケーションから REST API 呼び出しを行うことで、EMS サーバー リソース エンドポイントを呼び出してデータを取得したり設定することができます。

このチュートリアルでは、「EMS ペット リソースの作成」で作成した、EMS サーバー機能を拡張するカスタム リソースを使用しています。EMS リソース エンドポイント メソッドは、EMS ペット リソースで定義されています。

  1. EMS クライアント アプリケーションの TForm に TBackendEndpoint コンポーネントをドロップします。
  2. ［オブジェクト インスペクタ］で、TBackendEndpoint コンポーネントの名前を「BackendEndpointGetPets」に変更します。
  3. ［オブジェクト インスペクタ］で、EMS サーバー リソースを使用できるよう、TBackendEndpoint の以下のパラメータを設定します。
    • Provider： ドロップダウン リストから EMSProvider1 を選択します。
    • Resource： Pets
    • ResourceSuffix： このチュートリアルでは空のままにしておきます。
    • Method： rmGET
    TBackendEndpointGetPets1.png
  4. これらのパラメータを正しく設定すると、TBackendEndpoint コンポーネントの構成をテストしたときに、EMS サーバーから成功の応答が返されます。テストは次のいずれかで行います。
    • ［オブジェクト インスペクタ］で［実行...］をクリックします。
    • TBackendEndpoint コンポーネントを右クリックして［実行...］を選択します。エンドポイントからの応答が成功した場合は、「応答: 200 - OK。」というメッセージが表示されます。
  5. EMS サーバー ウィンドウの［ログ］ペインには、バージョン要求が表示されます。
    UsersGetEMSServerLogGetPets.png
    メモ： EMS ペット リソースに定義されている EMS リソース エンドポイント メソッドと同じ数の TBackendEndpoint を追加する必要があります。
    上記の手順（1 ～ 4）を繰り返して、次の表に示すように TBackendEndpoint コンポーネントを構成します。
    Name Provider Resource ResourceSuffix Method

    BackendEndpointGetPet

    EMSProvider1

    Pets

    {item}

    rmGET

    BackendEndpointPostPets

    EMSProvider1

    Pets

    （空のまま）

    rmPOST

    BackendEndpointPutPet

    EMSProvider1

    Pets

    {item}

    rmPUT

    BackendEndpointDeletePet

    EMSProvider1

    Pets

    {item}

    rmDELETE


    EMSClientBackendEndpoints.png
  6. TForm に TMemo コンポーネントをドロップします。
  7. TMemo の名前を「ServerResponse」に変更します。
  8. ［オブジェクト インスペクタ］で、TMemo コンポーネントの ReadOnly プロパティを True に設定します。
  9. このチュートリアルでは、5 つの TButton コンポーネントを TForm にドロップします。
  10. ［オブジェクト インスペクタ］で、各ボタンの Name プロパティおよび Text プロパティを次のように設定します。
    Button 1 Button 2 Button 3 Button 4 Button 5

    Name

    ButtonAddPet

    ButtonDelete

    ButtonGetPet

    ButtonGetPets

    ButtonUpdate

    Text

    Add Pet

    Delete Pet

    Get Pet

    Get Pets

    Update Pet

  11. 4 つの TEdit コンポーネントをフォームにドロップします。名前を「EId」、「EName」、「EKind」、「EPetId」に変更します。
  12. 4 つの TLabel コンポーネントをフォームにドロップします。［オブジェクト インスペクタ］で、各ラベルの Text プロパティを「Id」、「Name」、「Kind」、「Pet Id」に変更します。
EMSPetsClientDesignTab.png

EMS クライアントへのペット クラスの追加

この EMS クライアントでは、EMS ペット リソース用に作成したものと同じユーザー定義のオブジェクトを使用します。

ペット型のユニットを EMS クライアント アプリケーションに追加します。

  1. ［プロジェクト マネージャ］でプロジェクトを右クリックし、［新規追加｜ユニット］を選択します。
  2. ユニットの名前を「PetType」に変更します。
  3. 「ペット型の作成」の PetType ユニットのコードを、このユニットに追加します。

EMS ペット リソース エンドポイント メソッドの作成

アプリケーションに追加したボタンごとに、EMS ペット リソース エンドポイント メソッドに対する要求を作成する必要があります。 また、EMS サーバーからの応答データを EMS ペット クライアント アプリケーション内のコンポーネントにビジュアルにバインドすることもできます。

  1. EMS サーバーからデータを取得するために、クラスに private 関数を作成します。
    • Delphi の場合：
    // To Get all pets
procedure TForm1.GetAllPets;
begin
  BackendEndpointGetPets.Execute;
  ServerResponse.Text := BackendEndpointGetPets.Response.JSONText;
end;
  2. TForm にドロップした TButton コンポーネントそれぞれの onClick イベントを（ダブルクリックして）作成します。
  3. イベントへのイベント ハンドラの実装に次のコードを追加します。
    • Delphi の場合：
    // To Add a Pet
procedure TForm1.ButtonAddPetClick(Sender: TObject);
var
  LJSONObject: TJSONObject;
  LPet: TPet;
begin
  LJSONObject := TJSONObject.Create;
  LPet.Create(EId.Text.ToInteger, EName.Text, EKind.Text);
  try
    TPetJSON.PetToJSON(LPet, LJSONObject);
    BackendEndpointPostPets.ClearBody;
    BackendEndpointPostPets.AddBody(LJSONObject);
    BackendEndpointPostPets.Execute;
    GetAllPets;
  finally
    LJSONObject.Free;
  end;
end;

// To Get all pets
procedure TForm1.ButtonGetPetsClick(Sender: TObject);
begin
  GetAllPets
end;
// To Get a Pet
procedure TForm1.ButtonGetPetClick(Sender: TObject);
var
  LJSON: TJSONValue;
  APet: TPet;
begin
  BackendEndpointGetPet.Params.Items[0].Value := EPetId.Text;
  BackendEndpointGetPet.Execute;
  LJSON := BackendEndpointGetPet.Response.JSONValue;
  if LJSON <> nil then
  begin
    APet := TPetJSON.JSONToPet(LJSON);
    ServerResponse.Text := BackendEndpointGetPet.Response.JSONText;
    EName.Text := APet.Name;
    EKind.Text := APet.Kind;
    EId.Text := APet.Id.ToString;
  end;
end;

procedure TForm1.ButtonDeleteClick(Sender: TObject);
begin
  BackendEndpointDeletePet.Params.Items[0].Value := EPetId.Text;
  BackendEndpointDeletePet.Execute;
  GetAllPets;
end;

// To update a pet

procedure TForm1.ButtonUpdateClick(Sender: TObject);
var
  LJSONObject: TJSONObject;
  LPet: TPet;
begin
  LJSONObject := TJSONObject.Create;
  LPet.Create(0, EName.Text, EKind.Text);
  try
    BackendEndpointPutPet.Params.Items[0].Value := EId.Text;
    TPetJSON.PetToJSON(LPet, LJSONObject);
    BackendEndpointPutPet.ClearBody;
    BackendEndpointPutPet.AddBody(LJSONObject);
    BackendEndpointPutPet.Execute;
    GetAllPets;
  finally
    LJSONObject.Free;
  end;

end;
  4. EMS ペット クライアント クラスを宣言します。
    • Delphi の場合：
    TForm1 = class(TForm)
    EMSProvider1: TEMSProvider;
    BackendEndpointGetPets: TBackendEndpoint;
    BackendEndpointGetPet: TBackendEndpoint;
    BackendEndpointPostPets: TBackendEndpoint;
    BackendEndpointPutPet: TBackendEndpoint;
    BackendEndpointDeletePet: TBackendEndpoint;
    ButtonAddPet: TButton;
    ButtonGetPets: TButton;
    ButtonUpdate: TButton;
    ButtonGetPet: TButton;
    ButtonDelete: TButton;
    EId: TEdit;
    EName: TEdit;
    EKind: TEdit;
    LId: TLabel;
    LName: TLabel;
    LKind: TLabel;
    ServerResponse: TMemo;
    EPetId: TEdit;
    LPetId: TLabel;
    procedure ButtonAddPetClick(Sender: TObject);
    procedure ButtonGetPetsClick(Sender: TObject);
    procedure ButtonUpdateClick(Sender: TObject);
    procedure ButtonGetPetClick(Sender: TObject);
    procedure ButtonDeleteClick(Sender: TObject);
  private
    procedure GetAllPets;
  public
    { Public declarations }
  end;
  5. アプリケーションをビルドして実行します。F9 キーを押すか、［実行｜実行］を選択します。
    EMSPetsClientRunning.png
メモ： EMS サーバーが動作していて、そこに EMS ペット リソースが既に読み込まれている必要があります。

関連項目

「http://docwiki.embarcadero.com/RADStudio/Berlin/j/index.php?title=EMS_ペット_クライアントの作成&oldid=222962」から取得