各製品の資料を入手。
詳細はこちら →クラウドサイン とのデータ連携ができるMVC アプリケーションの作成
この記事では、クラウドサイン にデータ接続して、MVC Web アプリケーションでクエリを実行する方法を説明します。
最終更新日:2021-03-17
この記事で実現できるクラウドサイン 連携のシナリオ
こんにちは!ウェブ担当の加藤です。マーケ関連のデータ分析や整備もやっています。
この記事では、Visual Studio のウィザードを使って簡単なMVC(モデル・ビュー・コントローラ)プロジェクトを作成し、Entity Framework のメソッドを使うクラウドサイン にcreate, read, update, delete (CRUD) コマンドクエリを実行する方法を説明します。
Entity Framework Model の作成
下記の手順に従って接続プロパティを保存し、データモデルのエンティティにテーブルをマップします。
- Entity Framework 6 をお使いの場合は、あらかじめプロジェクトに クラウドサイン Entity Framework プロバイダーを登録してください。詳しくは、ヘルプドキュメントの「LINQ およびEntity Framework」をご参照ください。
- Visual Studio で新規MVC プロジェクトを作成[Internet Application]テンプレート、[Razor]ビューエンジンを選択します。この例では、プロジェクト名はMvcCloudSignApp です。
- デザイナーから.edmx ファイルを追加するには、[プロジェクト]>[新しい項目の追加]をクリックします。ADO.NET Entity Data Model を選択してモデルに名前を付けたら[追加]をクリックします。この例では、モデル名はCloudSignModel です。
- [Entity Data Model]ウィザードで、[EF Designer from database]オプションを選択します。[Entity Data Model]ウィザードが表示されます。
- [New Connection]をクリックします。ダイアログが表示されたらCData クラウドサイン のデータソースを選択します。
必要な接続文字列プロパティを指定します。 CloudSign に接続するためには、ClientId が必要です。
一般的な接続文字列は次のとおりです。
ClientId=MyClientId;UseSandbox=false;
接続に名前を付け、資格情報などのセンシティブ情報を接続文字列に含めるかどうかを選択します。簡略化のため、この例ではセンシティブ情報をWeb.config に保存しています。
- 必要なテーブルおよびビューを選択します。ここでは、Documents をインポートしています。また、オブジェクト名を複数形に変換するオプションは、チェックをはずしています。[Finish]をクリックして.edmx ファイルを作成します。
- プロジェクトをビルドして完成です。
コントローラーの作成およびメソッドとビューの生成
モデルの作成とプロジェクトのビルドが終わったら、以下の手順に従ってコントローラー、ビュー、および関連するCRUD メソッドを作成できます。 Documents テーブルに許可されたすべてのアクションのビューは、[Views]フォルダ内のDocuments サブフォルダに.cshtml ファイルとして格納されます。
[ソリューション エクスプローラー]で[Controllers]フォルダを右クリックし、[追加]>[コントローラー]をクリックします。コントローラーにCloudSignController のような名前を付け、以下のオプションを設定します。
- Template:次のオプションを選択します:'Controller with read/write actions, using Entity Framework'.
- Model class:Documents を選択。
- Data context class:CloudSignEntities を選択。

これで、プロジェクトを実行できます。[Index]ビューにアクセスするには、"CloudSign" をURL に追加します。 [Create New]をクリックして[Create view]を選択すると、自動生成されたフォームを含むビューが作成されます。各レコードの隣にあるEdit およびDelete links をクリックして、対応するEdit またはDelete ビューを表示します。

一からコントローラーを作成
このセクションでは、ほんの数行のコードでCRUD コマンドクエリをインプリメントする方法について説明します。利用可能なウィザードは、各ステップで詳しく説明します。
このチュートリアルを始める前に、エンティティデータモデルを作成しておいてください。クラウドサイン へのコマンドを実行するために、コンテキストクラスのメソッドを使用していきます。[Entity Framework Data Model]ウィザードを使ってモデルを作成する方法については、前のセクションをご参照ください。 — これはモデルファーストアプローチです。 コードファーストアプローチの利用に関する詳細は、ヘルプドキュメントの「LINQ およびEntity Framework」をご参照ください。
- 次の例のCloudSignController のようにコントローラーを手動で作成するには、[ソリューション エクスプローラー]で[Controllers]フォルダを右クリックし、[追加]>[コントローラー]をクリックします。
- [Add Controller]ダイアログが表示されたら、[Template]メニューから'Controller with empty read/write actions' オプションを選択します。[Controller]フォルダ内にCloudSignController.cs が作成されます。

コンテキストの作成
以下のコードを追加し、コンテキストクラスをクラス変数としてインスタンスを生成します。この簡単な例では、コントローラーはコンテキストクラスのメソッドを直接呼び出してCRUD コマンドを実行します。
private CloudSignEntities db = new CloudSignEntities();
クラウドサイン のデータエンティティの取得
レコードのリストをビューに表示するには、Index メソッドを以下のように書き換えます。このコードは、コンテキストクラスのToList() メソッドを呼び出して、レコードテーブルを表示するビューを返します。デフォルトでは、Index メソッドは空のビューを返します。
public ActionResult Index() { return View(db.Documents.ToList()); }
ビューを作成するには、Index メソッド内を右クリックし、[Add View]をクリックします。ウィザードが表示されたら新しいビューIndex.cshtml を作成します。作成されたビューは[Views]フォルダに格納されます。このビューをロードするには、.cshtml ファイルを右クリックして[View In Page Inspector]をクリックします。
[Add View]ダイアログでビューに名前を付け、以下のオプションを設定します:
- Create a strongly typed view:このオプションを選択し、Documents タイプのビューを作成。
- Model class:Documents エンティティ、Documents を選択。
- Scaffold template:[List]を選択。このメニューオプションは、エンティティを表示するHTML テーブルを生成します。

クラウドサイン データ エンティティの作成
レコードを作成するには、フォームにユーザーが送ったDocuments エンティティを受け取るビューを作成しておく必要があります。以下の手順に従って、create アクションをインプリメントします。
- HttpPost 属性をアノテーションする2つ目のCreate メソッドをオーバーライドします。このメソッドは、ユーザーがsubmits it back したときにデータを処理します。最初のメソッドはフォームを表示するだけなので、この動作をオーバーライドする必要はありません。
- デフォルトでインプットされたFormCollection を、ユーザーに作成を許可したいクラウドサイン エンティティのタイプに置き換えます。
以下のコードを追加して、Entity Framework 経由で新しいレコードを追加します。次のサンプルコードでは、コンテキストのAdd およびSaveChanges メソッドは、レコードを挿入するために呼び出されます。
[HttpPost] public ActionResult Create(Documents documents) { try { db.Documents.Add(documents); db.SaveChanges(); return RedirectToAction("Index"); } catch { return View(); } }
Create アクションのために追加する必要があるビューは1つだけです。新しいビューCreate.cshtml は、Index.cshtml と並んでViews のクラウドサイン サブフォルダに追加されます。どちらかのCreate メソッド内を右クリックし、[Add]>[View]をクリックします。[Add View]ダイアログが表示されたら、以下のオプションを設定します。
- Create a strongly typed view:このオプションを選択し、Documents タイプのビューを作成。
- Model class:Documents エンティティを選択。
- Scaffold template:[Create]を選択し、フォーム用にHTML を生成。

クラウドサイン のデータエンティティの編集および保存
クラウドサイン 内のレコードを編集するには、Create メソッド同様に、ビューから入力された値を受け取りデータソースにコマンドを実行する必要があります。さらに、Edit アクションのもう一つのアスペクトも定義が必要です:コントローラーのEdit メソッドで、コンテキストを変更されたエンティティの状態に更新します。これら3つのステップを以下に示します。
-
最初のEdit メソッドをオーバーライドして、コードを次のように書き換えます。ユーザーがDocuments のEdit link をクリックすると、このメソッドは選択されたDocuments エンティティをビューに送り、フォーム内での修正が可能になります。
public ActionResult Edit(int id) { return View(db.Documents.Find(id)); }
- 最初のEdit メソッドを右クリックし、[Add]>[View]をクリックします。Create アクション同様、必要なEdit ビューは1つだけです。ウィザードが表示されたら、以下のオプションを設定します:
- Create a strongly typed view:このオプションを選択し、Documents タイプのビューを作成。Documents を選択。
- Model class:Documents エンティティを選択。
- Scaffold template:[Edit]を選択し、フォーム用にHTML を生成。
-
以下のサンプルコードで、2つ目のEdit メソッドをオーバーライドします。HttpPost 属性によってアノテーションされると、このメソッドはユーザーがフォームの変更を送信するときにビューからデータを受け取ります。
送信された値がDocuments レコードの更新に使える値である場合は、クラウドサイン はSaveChanges メソッドが呼び出されたときに更新されます。提供されたデータ型が正しくないなど、送信された値が有効でない場合は、それらはフォームに再表示されます。
最初のEdit メソッドで作成したビューは、フォームを表示します。Edit ビューは、エラーメッセージを表示するHtml.ValidationMessageFor helper も含みます。
[HttpPost] public ActionResult Edit(Documents documents) { if (ModelState.IsValid) { db.Entry(documents).State = EntityState.Modified; db.SaveChanges(); return RedirectToAction("Index"); } return View(documents); }

クラウドサイン のデータエンティティの削除
以下のコードは、最初のDelete メソッド用のコードで、削除するDocuments エンティティのビューを返します。
public ActionResult Delete(string id) {
Documents documents = db.Documents.Find(id);
return View(documents);
}
このメソッド内を右クリックし、[Add]>[View]をクリックします。ダイアログが表示されたら、以下の情報を入力します。
- Create a strongly typed view:このオプションを選択し、Documents タイプのビューを作成。
- Model class:Documents エンティティを選択。
- Scaffold template:[Delete]を選択し、フォーム用にHTML を生成。

ビューを作成したら、DeleteConfirmed メソッドに次のコードを使います。ユーザーから削除を確認するポストバックを受け取ったときにエンティティを削除します。
[HttpPost, ActionName("Delete")] public ActionResult DeleteConfirmed(string id) {
Documents documents = db.Documents.Find(id);
db.Documents.Remove(documents);
db.SaveChanges();
return RedirectToAction("Index");
}