ASP.NET MVCと実際の例。 理論と紹介。

Microsoftチームは、開発者向けの製品とツールを非常に集中的に開発しています。 フレームワークの新しいバージョンのリリースに関しては、このテーマですでにコミックの放出がありました。 大企業で働く開発者は、大規模なプロジェクトに関与しています。一般に、そのようなエンジンは新しいバージョンに迅速に移行できないため、あまり熱心に見ていません。 ポップアップバグと​​、プロジェクトの構造全体の変更の両方に悩まされる可能性がありますが、これは必ずしも簡単ではありません。 上記は、残念ながら（または幸いなことに）、私には関係ありません。これは、背景を見ずに最新のものを使用する機会を与えてくれます。 プロジェクトはかなり目に見え、それらは新しいバージョンに簡単に転送されることが多く、プロジェクトの次のタスクを実装するときに新しい機能を導入し始めます。 実装時には、これはもちろん、コードにさまざまな混乱をもたらします。これは、コードのさまざまな部分でさまざまな原則が使用されているためです（たとえば、LINQ実装）が、その後のコードのリファクタリングにより、単一のフォームになり、すべてが正常に戻ります。

なんでこんなこと？

これらの革新の1つは、.NETプラットフォーム用のModel-View-Controllerテンプレートの実装であるASP.NET MVCです。 それが何であるのか、なぜそれが必要なのかを理解し、私たちの知識をシンプルだが実際のアプリケーションに適用してみましょう。

MVCの仕組み

Model-View-Controllerのアーキテクチャパターンは、アプリケーションをモデル、ビュー、コントローラーの3つの主要コンポーネントに分割することを意味します。 :)これらの各コンポーネントは、そのタスクを担当します。 一般的に言えば：

• モデルは基本的に、アプリケーションのビジネスロジック全体です。 これには、データ（エンティティ）を処理し、それらを操作し、データベースに書き込み、そこから読み取るクラスと、エンティティ間の相互作用を行うクラスが含まれています。 アプリケーションが小さい場合、おそらくここにいて、データを処理します。 プロジェクトが大きく、多くのロジックが含まれている場合は、ロジックを取り出して、個別のプロジェクト（アセンブリ）でデータを操作することをお勧めします。 また、非常に大きなアプリケーションに遭遇した場合、他のサーバー（アプリケーションサーバー）に物理的に転送する必要があります。
• ビューは、ユーザーインタラクション（UI）を担当します。 それを通じて、クライアントにデータを表示し、それらを編集するためのインターフェースを実装します。 しかし、ディスプレイに関連付けられているもののみ。 ロジックなし！
• コントローラは、最初の2つのコンポーネント間のリンクです。 コントローラーはサーバーへのリクエストに関するデータを受信し、何らかの方法でこのデータを処理し（たとえば、送信されたフォームから値を受信し）、それらをモデルに渡します。 データを処理または受信した後、クライアントにデータを表示する正確な方法（目的のビュー）を選択します。

これは私たちに何を役立てますか？ HTML出力を完全に制御できます。 より軽いアプリケーション。 TDD（テスト駆動開発）の支持者は喜んでいます。MVCでは、このアプローチを最大限に活用して、ほぼすべてをテストできます。 また、データの表示からロジックを完全に分離します。 誰かが単に「最終的にはすべてが人々のためです」と言うだけで、誰かがボタンをクリックするハンドラでデータを操作するためのコードを書かないようにそれを訓練します。 ところで、ハンドラーについて言及しましたか？ 忘れて これはもうありません。 フォームごとにイベントハンドラー、ViewState、Drag'n'Dropコントロールはありません。 はい、手でさらにハードコーディングする必要があります。誰かがそれを実際にどのように学び、見つけることもできます。 同時に、MVCの概念と単純に矛盾する機能を失っても、主要な機能を失いませんでした。 自由に使えるのは、MasterPages、UserControls、Membershipです。 一般的に、すべてが一見すると思われるほど悪くはありません。 MVCはWebFormを置き換えますか？ いいえ、WebFormsも存続し、進化します。 MVCは、アプリケーションを異なる方法で作成することを可能にします。 大量のデータを操作したり、GridViewで編集したりするためのアプリケーションがある場合、WebFormsは引き続き適切なソリューションです。 MVCを使用しても、URL書き換えの問題はすべて忘れてしまいます。もちろん、これはWebFormsの問題ではないかもしれませんが、MVCの場合はネイティブ機能です。

理論から実践へ？

先日、私は良い友人からプロジェクトに出会いました。 ポータブルエレクトロニクスサービスセンターの新しいWebサイトが必要です。 古いですが、少しイライラします。 実際、複雑なものはありません。5つの情報ページ、価格と1Cとの統合を備えた手頃な価格のアクセサリーのカタログです。 後者のために、疑問が生じました。 データベース全体は1Cで維持されます。クライアントがウェブサイトにアクセスして領収書の番号を入力し、修理のステータスを確認できるようにしたいと考えています。準備ができていないか、すべてが保証の下で修理されるか、何かに追加料金を支払う必要があります

仕事の準備

まず、 Microsoft Visual Studio 2008 （私が間違っていなければExpressエディションも適しているはずです） 、. NET Framework 3.5 、およびASP.NET MVC自体をインストールする必要があります （執筆時点ではプレビュー3が利用可能です）。 すべての商品が正常にインストールされたら、プロジェクトを作成します。 [ファイル]-> [新規]-> [プロジェクト...]開いたウィンドウで、[プロジェクトの種類]で記述している言語とWebプロジェクトの種類を選択します。提案されたテンプレートの中で、ASP.NET MVC Webアプリケーションが必要です。 私のプロジェクトは「ITService」と呼ばれます。







次に、アプリケーションの単体テストプロジェクトを作成するよう求められますが、単体テストプロジェクトは作成せずに作成します。

その結果、次の形式のクリーンなプロジェクトが得られました。







すでにおなじみのディレクトリとともに、私たちにはなじみのないものが現れました。 順番に行きましょう：

/プロパティ -Webアプリケーションの標準ディレクトリ。プロジェクト設定が含まれます。

/参照 -他のアセンブリ、プロジェクトなどへのリンク

/ App_Data-データを保存するための特別なディレクトリ

/コンテンツ -このディレクトリには、画像、スタイルなどを保存します。 一般に、サイトのすべての静的コンテンツ

/コントローラー -コントローラーコンポーネントを担当するクラス

/モデル -ロジックを持つクラス

/ビュー -アプリケーションのUIを直接。 各コントローラーのディレクトリは、このディレクトリに作成されます（この例では/ Views / Home）。 そして、コントローラの各メソッドのaspxページに既にあります。

/ View / Shared -MasterPagesやUserControlsなど、すべてのコントローラーに役立つものが含まれています。



さて、実行してみてください？ 出来上がり！ 結果を得ました：







トップメニューのリンクをクリックし、デフォルトでMVCでURLがどのように整理されているかを確認します。 [About]ページには、 localhostアドレス55515 / Home / Aboutがあります（ポートは異なる場合があります）。 mysite {controller} / {action}のような構造になっていることがわかりました 。 まあ、それはかなり良いです。

何が必要ですか

先ほど言ったように、いくつかの情報ページ、アクセサリのカタログ、1Cからデータを送受信する特別なページを備えたサイトが必要です。 OK、まず静的ページを実装し、MasterPageをレイアウトし、必要なスタイルを記述して、それらを機能させるようにします。 もちろん、より複雑なアプリケーションでは、ビジネスロジックの開発から始めて、データの保存方法を考え、これをすべて書き、それからインターフェースを続行する必要があります。 しかし、この場合、プロジェクトは小さいため、このシーケンスは無視できます。

コードを書くときの生活を楽にする

Site.masterを見ると、たとえばcssへのパスがそこに相対的であることがわかります。 ../../Content/Site.css。 ページの入れ子が異なり、リンクが失われるため、これは私たちには適していません。ルートからのパスで修正する必要があります。 CSSの場合、もちろんペンで登録することも可能ですが、今後はサイトにも写真があります。 かなり長い道のりを書くのがつまらないときはいつでも、私たちはヘルパーを作ります。 Helpersフォルダーを作成し、次のコードでAppHelperクラスを追加します。

System.Web を使用 。



パブリック スタティック クラス AppHelper

{

パブリック 静的 文字列 ContentRoot

{

得る

{

string contentVirtualRoot = "〜/ Content" ;

return VirtualPathUtility.ToAbsolute（contentVirtualRoot）;

}

}



パブリック 静的 文字列 ImageRoot

{

get { return string .Format（ "{0} / {1}" 、ContentRoot、 "Images" ）; }

}



パブリック 静的 文字列 CssRoot

{

get { return string .Format（ "{0} / {1}" 、ContentRoot、 "Css" ）; }

}



public static string ImageUrl（ string imageFile）

{

string result = string .Format（ "{0} / {1}" 、ImageRoot、imageFile）;

結果を返す ;

}



パブリック 静的 文字列 CssUrl（ string cssFile）

{

string result = string .Format（ "{0} / {1}" 、CssRoot、cssFile）;

結果を返す ;

}

}

その中で、静的プロパティContentRootを宣言しました-コンテンツへのパス、画像とcssファイルのあるディレクトリへのパス、および2つの静的メソッドImageUrlとCssUrlは、ファイル名を取得し、アプリケーションでそれに対応するパスを返します。 クラスを使用するために、Site.Masterのスタイルを接続するリンクタグを次のように変更します。

< link href = "<％= AppHelper.CssUrl（" Site。css "）％>" rel = "stylesheet" type = "text / css" />

そして、Site.cssを作成されたディレクトリ/ Content / Cssに移動することを忘れないでください。静的コンテンツをそのタイプ別に分けます。 プロジェクトを再コンパイルすると、パスが正しく書き込まれます。

< link href = "/ Content / css / Site.css" rel = "stylesheet" type = "text / css" />

この段階で、画像とスタイルシートへの正しいパスを規定するヘルパーを作成しました。 次に、一般にHTMLをどのように使用できるか、および何をするように招待されているかを見ていきます。

HTMLワーク

マイクロソフトは、コード記述を容易にするためにHtmlHelperを提供しています。 これは、必要なHTMLタグをレンダリングできる静的メソッドのセットを持つクラスです。 たとえば、画像を表示するには、単に書く

<％ = Html.Image（ "image.png" 、 "Alt text" ） ％>

ページでは次のようになります

< img src = "logo.png" alt = "Altテキスト" />

AppHelperを使用して画像へのパスを計算する場合、次のように記述します。

<％ = Html.Image（AppHelper.ImageUrl（ "logo.png" ）、 "Alt text" ） ％>

このコードはすでに正しい画像を生成し、目的のパスを記述します。

< img src = "/ Content / Images / logo.png" alt = "Altテキスト" />

もう1つの興味深いメソッドは、Html.ActionLinkです。

<％ = Html.ActionLink（ "About Us" 、 "About" 、 "Home" ） ％>

このメソッドは、「About us」というテキストを含む「Nome」コントローラーの「About」メソッドへのリンクを生成します

Lambda Expressionsを使用して、より「モダン」な手段を使用して同じコードを記述できます。

<％ = Html.ActionLink <ITService.Controllers.HomeController>（x => x.About（）、 "About Us" ） ％>

ここで何が起こっているかは、構文から明らかです。

小さなヒント：ITService.Controllers名前空間を毎回書き込まないために、 < system.web > < pages > < namespaces >セクションのweb.configに書き込みます 。

< 名前空間の 追加 = "ITService.Controllers" />

現在、これらのリンクは短く書くことができます。

<％ = Html.ActionLink <HomeController>（x => x.About（）、 "About Us" ） ％>

それとは別に、フォームに言及する価値があります。 明示的に十分に作業する必要があります（ポストバックはありません、覚えていますか？）。 最も単純なフォームは次のようになります。

<％ using （Html.Form <HomeController>（x => x.Index（）））{ ％>

<％ = Html.TextBox（ "name" ） ％>

<％ = Html.SubmitButton（ "cmdSend" 、 "Submit" ） ％>

<％ } ％>

fromタグを使用するには、usingディレクティブを使用して、スコープ内のすべてのフォームフィールドを登録する必要があります。 これにより、終了タグが提供されます。 Html.Form宣言（x => x.Index（））は、フォームがHomeControllerのIndexメソッドに送信されることも示しています。 彼らはかなりうまくやってきたと思う。 最初に、コードのHTMLとサーバーの部分のこの混合を見たとき、私はぞっとしました、誰もが来たと思います。 こんにちは、この春雨がいっぱいだったクラシックASP。 しかし、まだそんなに怖くない。 彼と仕事を始めたとき、これは一見すると思われるものではありません。 これらのツールはすべて非常に強力です。

ASP.NETルーティング

ルーターとは何ですか？ ルーターを使用すると、サーバー上の物理ファイルを指し示していないURLを処理できますが、代わりに、パスはアプリケーションで既に使用されているパラメーターに解析されます。 パスの特定の部分を特定のコントローラーとそのメソッドにマッピングすることもできます。 このようなモデルはデフォルトで使用されますが、便利な対応を設定できます。 一方で、これは古くからあるURL書き換えに似ています。これは既に記事で詳細に記述されていますが、これは一方でのみです。 これらは実際には2つの異なるものです。 UrlRewritingを使用する場合、mysite.com/products/product1の形式のクエリは、実行時にmysite.com/products.aspx?id=product1に変換されます 。 本来、URL書き換えルールに準拠したURLを生成することはできません。 したがって、どこかでロジックを変更し、アドレスパターンを変更した場合、これらのURLがペンで生成されるすべての場所を編集する必要があります。 MVCでは、渡されるパスを問題なく解析するため、変換は発生しません。



MVCのルーターでのすべての作業は、Global.asax.csに整理されています。 私たちのプロジェクトを見て、以下を見てみましょう：

routes.MapRoute（

"Default" 、 //ルート名

"{controller} / {action} / {id}" 、 //パラメータ付きのURL

new {controller = "Home" 、action = "Index" 、id = "" } //パラメータのデフォルト

）;

ご覧のとおり、アプリケーションが動作するルーターのコレクションに独自のものを追加しています。 Defaultという名前で、URLマスクを規定し、デフォルトパラメータを規定する匿名タイプを作成します。 実装に直接進むときに、ここで変更を行います。 同時に、アドレスを生成するためのこのようなスキームに満足している場合、なぜそうではありませんか？ そのままにしておけば、機能します。

始まりの終わり

さて、これは序論であり、ASP.NET MVCプラットフォームに関する最も基本的な概念を明らかにしようとしました。 どうやって手に入れたのか、あなたが判断する。 私自身はこの分野の専門家ではありません。自分にとって興味深いものになりましたが、RuNetにはこのトピックに関する情報がほとんどないため、人々と共有することにしました。



私はすべてについてのあなたの意見が私にとって重要であることに注意したいので、どんなフィードバックでも道になります。 批判なら、それは建設的なものになると確信しています;）



次の記事では、想定されるアプリケーションの実装に直接進みます。 より多くのコードがあるでしょう。 そして、habrのように、そのようなフォーマットで私を喜ばせません:)



*記事内のすべてのコードは、 ソースコードハイライターを使用して、可能な限り強調表示されました。