大人しい独り言 : ASP.NET MVC

[ASP.NET MVC] Hello, World

mikion — Thu, 04 Sep 2008 17:26:45 GMT

昨日は ASP.NET MVC のインストール方法について簡単にご紹介しましたので、今後何回かに渡って ASP.NET MVC のプログラミングについてご紹介していきたいと思います。
# 不定期になるとは思いますが。。
まずはじめは、やはり Hello, World から、ということで。

ではさっそく ASP.NET MVC の Hello, World アプリケーションを作っていきたいと思います。
なお、ASP.NET MVC は現時点での最新 CTP 版である Preview 5 を使用していますが、前 CTP バージョンの Preview 4 でも同じコードで動作します。

Visual Studio で "ASP.NET MVC Web Application" プロジェクトテンプレートを選択し、新規プロジェクトを作成します。
# ここでは言語は C# を使用しますが、もちろん Visual Basic .NET でも OK です。

プロジェクト名はとりあえず "HelloMvc" としておきます。

プロジェクトができますと、最初からいろいろとフォルダやファイルが作られています。

Controllers、Models、Views フォルダは、それぞれ MVC パターンのController/Model/View に対応するソースコードを格納する場所になります。
プロジェクトの雛型ではあらかじめサンプルとなる実装コードがいくつか作らてた状態になっていますので、今回の実装で不要なフォルダ・ファイルを削除しておきます。

削除するのは、以下のフォルダ・ファイルです。

Controllers フォルダ内のファイル
AccountController.cs と HomeController.cs
Views フォルダ内にあるフォルダ
Accout、Home、および Shared

削除した後は以下のようなプロジェクト構成になっています。

これで Hello, World のプログラミングを始められる状態になりました。

ここからが本番です。
まずは MVC の C に相当する Controller を実装します。

Controllers フォルダを右クリックして、新しい項目画面を表示します。

そしてテンプレートで "MVC Controller Class" を選択します。

ここでは Controller クラス名を "HelloContorller" とします。(ファイル名は HelloController.cs)
Controller クラスは必ず接尾子(Post-fix)を "Controller" とする必要があります。
ですので、ここでは "Hello" という名前の Controller を作りたいので、Controller クラス名は "HelloController" としました。

生成された HelloController.cs を開くと、以下のようなコードが記述されています。

HelloController.cs

namespace HelloMvc.Controllers {

	public class HelloController : Controller {

		public ActionResult Index() {
			// Add action logic here
			throw new NotImplementedException();
		}

	} // End of class

} // End of namespace

Controller クラスのメソッドは "アクションメソッド" と呼ばれ、アプリケーションがこのアクションメソッドに該当するリクエスト (アクション) を受けたときに呼び出されます。
# 上記コードでは Index メソッドがアクションメソッドに相当します。
ASP.NET MVC のデフォルト設定では、例えばアプリケーションを http://hoge.net/ でホストしているとすると、http://hoge.net/Hello/World というアドレスでアクセスされた場合に、HelloController クラスの World メソッドが呼び出されることになります。

アクションメソッドの中では、対応するビジネスロジックの呼び出しや View (画面) に引き渡す Model (データ) の生成・取得処理を行い、表示する View の決定を行います。
また、アクションメソッドの戻り値は通常 ActionResult 型を返すようにします。
# ちなみに、のちのちご紹介することになると思いますが、ActionResult 型以外の値を返すことも可能ではあります。

さて、ここでは http://ホスト/Hello/World というリクエストを受けて "Hello, ASP.NET MVC !" というメッセージを返す画面を表示させるようにしたいと思いますので、World という名前のアクションメソッドを実装します。

HelloController.cs

namespace HelloMvc.Controllers {

	public class HelloController : Controller {

		public ActionResult World() {
			return View( "World" ); // "World" という名前の View を表示する
		}

	} // End of class

} // End of namespace

World メソッドの中では View() メソッドを呼び出しています。このメソッドは View を表示される際に使用するメソッドであり、引数で表示したい View 名を指定しています。
なお、View() メソッドで View 名の指定を省略した場合はアクションメソッドと同じ名前の View を表示させることになりますので、上記の World メソッドは、

public ActionResult World() {
	return View(); // "World" という名前の View を表示する
}

と、引数を省略することができます。

次にせっかくなので Model を使って View にデータを渡してみたいと思います。
View には "Hello, ASP.NET MVC !" とともに現在の時刻を表示するようにしましょう。

ASP.NET MVC では Model にはさまざまなタイプのオブジェクトを使用することができます。
# LINQ to SQL のエンティティ、ADO.NET Entity Framework のエンティティ、DataSet、あるいは POCO(=Plain Old CLR Object：ノーマルな.NET オブジェクトのことです) などなど ...
また、Controller から View に対して Model を渡す際には、"型付けされた (Typed)"形式と"型付けされていない (Untyped)"形式の 2 つの形式を使用することができるのですが、今回は"型付けされていない"形式を使用したいと思います。
この"型付けされていない"形式を使用して Controller から View に対して Model を渡すには、ViewData というそのまんまな名前の汎用の"入れ物"を使用します。

HomeController.cs

public class HelloController : Controller {

	public ActionResult World() {
		ViewData["Time"] = DateTime.Now;
		return View(); // "World" という名前の View を表示する
	}

} // End of class

ViewData は辞書形式のコレクションですので、キーを指定して値をセットします。

以上で Controller が実装できましたので、次に View を作りたいと思います。

ASP.NET MVC の View は ASP.NET の通常の WebForm と同じ .aspx 拡張子をもったファイルとコードビハインドファイル (.aspx.cs) によって実装していきますが、微妙に通常の WebForm とは異なります。
また、ASP.NET MVC では View のディレクトリ階層がルール化されており、Views フォルダ以下に Controller 名と同じフォルダを作成し、その中に View を配置していく必要があります。

今回の例では Controller 名は "Hello" (HelloController から Controller を除いたもの) になりますので、Views フォルダの中に Hello フォルダを作成します。

つづいて、作った Hello フォルダの中に ASP.NET MVC の View を追加します。
Hello フォルダを右クリックして新しい項目の追加画面を表示し、テンプレートは "MVC View Page" を選択します。

そして、ファイル名は "World.aspx" にします。

World.aspx には "Hello, ASP.NET MVC !" というメッセージと、Controller で ViewData に入れられた現在時刻値を表示させますので、コメント以下の1行を追加します。

World.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="World.aspx.cs" Inherits="HelloMvc.Views.Hello.World" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title></title>
</head>
<body>
	<!-- ここにWelcomeメッセージと現在時刻を表示 -->
	Hello, ASP.NET MVC !<br />Now: <%= ViewData["Time"] %>
</body>
</html>

<%= %> コードブロックを使用し、その中で ViewData の値を取得しています。

以上で View の実装は終了です。

最後に URL ルーティングのルールを少し調整します。
URL ルーティングの設定がある Global.asax.cs (Global.asax のコードビハインド) を開きます。

Global.asax.cs の中では、MvcApplication クラスの RegisterRoutes メソッドの中で URL ルーティングのルールの登録処理を行っています。
ですので、URL のルーティングを調整したい場合にはこの RegisterRoutes メソッドの中を修正していくことになります。

Global.asax.cs

	public class MvcApplication : System.Web.HttpApplication {

		public static void RegisterRoutes( RouteCollection routes ) {
			routes.IgnoreRoute( "{resource}.axd/{*pathInfo}" );

			routes.MapRoute(
					"Default",                                              // Route name
					"{controller}/{action}/{id}",                           // URL with parameters
					new { controller = "Home", action = "Index", id = "" }  // Parameter defaults
			);

		}

		protected void Application_Start() {
			RegisterRoutes( RouteTable.Routes );
		}

	} // End of class

URL ルーティングの詳細につきましては追々ご紹介していきたいと思いますが、ポイントだけ簡単に。
このコードでは、routes.MapRoute() メソッドを使用して URL のルーティングルールを追加しています。
1番目の引数の "Default" は登録する URL ルーティングルールの名前です。
2番目の引数が URL ルーティングルールそのもので、このデフォルト設定では http://ホスト/Controller名/アクション名/ID というパターンで Controller ならびにそのアクションメソッドを呼び出す、というルールが設定されています。
# なお、最後の ID はアクションメソッド側で明示的に受け取るようになっていない場合は省略可能です。
そして3番目の引数がデフォルト、つまり http://ホスト/ という、Controller名やアクション名を省略したリクエストが来た場合の設定であり、匿名クラスを使用してURL ルーティングルールに必要なパラメータの値を設定しています。ここでは Controller 名が "Home" でアクション名が "Index" となっています。

ここでは、URL ルーティングルール自体はこのまま使用したいと思いますが、デフォルトで呼び出される Controller名とアクション名はそれぞれ "Hello" と "World" に変更しておきたいと思います。

Global.asax.cs

		public static void RegisterRoutes( RouteCollection routes ) {
			routes.IgnoreRoute( "{resource}.axd/{*pathInfo}" );

			routes.MapRoute(
					"Default",                                              // Route name
					"{controller}/{action}/{id}",                           // URL with parameters
					new { controller = "Hello", action = "World", id = "" }  // Parameter defaults
			);

		}

以上ですべての実装が終わりです。

さっそく実行してみましょう。
Visual Studio で [F5] キーを押下し、デバッグ実行を開始します。

なお、デバッグ実行した際には、こんなメッセージ

や、こんなメッセージ

が表示されることがありますが、それぞれのデバッグを有効にする場合にはメッセージに従ってデバッグが有効になるよう設定してください。

実行した結果がこちらです。ちゃんとメッセージと時間が表示されています。

先ほど URL ルーティングのデフォルト設定を変更しましたので、ルートパス http://localhost:54369/ の呼び出して HelloController の World アクションメソッドが実行されています。
当然ですが、URL を http://localhost:54369/Hello/World とタイプして実行しますと、同じくHelloController の World アクションメソッドが実行された結果が表示されます。

以上が ASP.NET MVC の Hello, World アプリケーションでした。

次回以降はもう少し細かいところに踏み入った話ができればと思っています。

ASP.NET MVC Preview 5 のインストール

mikion — Wed, 03 Sep 2008 12:05:09 GMT

ASP.NET MVC の最新 CTP (Community Technology Preview) である Preview 5 が公開されていますので、早速インストールしてみました。

ASP.NET MVC はまだ英語版環境での使用しか考慮されていないようで、日本語環境でちゃんと使えるようにするには、インストール後に若干作業が必要になります。
ですので、簡単にインストール手順をまとめておきます。

Visual Studio 2008 もしくは Visual Web Developer 2008 Express Edition をインストール。
なお、Visual Studio 2008 を使用される場合は SP1 が別途提供されていますので、できれば SP1 もインストールされることをお勧めします。

Visual Studio 2008 SP1 (iso イメージ)
ASP.NET MVC Preview 5 をダウンロード。
以下の CodePlex サイトからダウンロードします。

ASP.NET MVC CodePlex Preview 5 Installer + Source
ASP.NET MVC Preview 5 をインストール。
2. でダウンロードした AspNetMVCPreview5-setup.msi を実行します。

特に指定するパラメータなどはありませんので、さくっとインストールできるかと思います。
ASP.NET MVC の Visual Studio 用項目テンプレート (ItemTemplate) のコピー。
こちらの記事でも言及されている通り、ASP.NET MVC のインストーラでセットアップしただけですと Visual Studio の項目テンプレート (「新規アイテムの追加」ででてくるコードの雛型となる項目) が英語環境用(1033)にしかセットアップされませんので、日本語環境(1041)で ASP.NET MVC の項目テンプレートを使用できるようにするには、各プログラム言語 (C# と Visual Basic .NET) の英語環境用にインストールされた項目テンプレートを日本語環境用にコピーする必要があります。

ASP.NET MVC の各プログラミング言語用の項目テンプレートは以下のディレクトリにインストールされています。

[C#用]
C:\Program Files\Microsoft Visual Studio 9.0\Common7\IDE\ItemTemplates\CSharp\Web\MVC

[Visual Basic .NET 用]
C:\Program Files\Microsoft Visual Studio 9.0\Common7\IDE\ItemTemplates\VisualBasic\Web\MVC

"MVC" フォルダの下にある英語環境用の項目テンプレートが格納されている "1033" フォルダ。

"1033" フォルダの中にある項目テンプレートの ZIP ファイル。

ここから、日本語環境でも ASP.NET MVC の項目テンプレートが使用できるようにするため、項目テンプレートファイルをコピーします。

以下のように"1041"フォルダ (日本語環境用フォルダ) を作成し、その中に "1033" フォルダの中身をコピーします。
# "1033" フォルダを丸ごとコピーして "1041" にリネームしても結構です。

このコピー作業を C# 用と Visual Basic .NET 用の2つのディレクトリともに行います。
コピーした項目テンプレートを Visual Studio に反映 (インストール)
4. でコピーしただけでは Visual Studio では項目テンプレートが認識されませんので、Visual Studio のテンプレートインストールコマンドを実行して、コピーした項目テンプレートを Visual Studio で使えるようにします。

まず、"Visual Studio 2008 コマンドプロンプト" を起動します。Windows Vista で UAC を有効にしている場合は"管理者として実行"するのをお忘れなく。
# Visual Studio 2008 コマンドプロンプトではなく、通常のコマンドプロンプトでも問題ありませんが、devenv.exe (Visual Studio 2008) へのパスが通っている Visual Studio 2008 コマンドプロンプトを使った方が楽なので、ここでは Visual Studio 2008 コマンドプロンプトを使用しています。

コマンドプロンプトを起動したら、

devenv /InstallVSTemplates

とコマンドを実行し、4. でコピーした項目テンプレートを Visual Studio にインストールします。

エラーメッセージが出なければ、項目テンプレートのインストールはバッチリ完了しているはずです。

以上でインストールは終わりです。

これで、Visual Studio 2008 で [ファイル] → [新規作成] → [プロジェクト] を開きますと ...

このように "ASP.NET MVC Web Application" というプロジェクトテンプレートが選択可能になり、作成した ASP.NET MVC のプロジェクトから「新規項目」を追加しようとすると ...

このように ASP.NET MVC 用の各項目テンプレートが選択できるようになります。

ここから実際に ASP.NET MVC のプログラミングを行っていくわけですが、ASP.NET MVC Preview 5 でのプログラミングにつきましては追々こちらでご紹介していきたいと思います。

[TechEd 2008 Yokohama] ASP.NET MVC セッションのデモ

mikion — Tue, 02 Sep 2008 13:36:00 GMT

こちらの Blog に複数ファイルをアタッチする方法がわからなかったため(汗)、デモのサンプルアプリケーションはこちらで公開させて頂きます。
大したサンプルではないですが、ASP.NET MVC における Model-View-Controller の実装とLINQ to SQL と組み合わせた CRUD 処理の実装方法の基本的な部分はおわかり頂けるかと思いますので。。
(本投稿の一番下の"Attachment(s):" にリンクがあります)

[TechEd 2008 Yokohama] ASP.NET MVC のセッションPPT

mikion — Tue, 02 Sep 2008 13:25:00 GMT

大変ご無沙汰しています、マイクロソフトの中原です。

先週の TechEd で「T2-402：ASP.NET MVC Framework 概説～.NET Web アプリケーション開発のパラレルワールド!?～」というタイトルのセッションを担当させて頂きましたので、そちらのセッションスライドをこちらにアップさせていただきます。
(本投稿の一番下の"Attachment(s):" にリンクがあります)
また私のセッションに参加された方におかれましては、デモがうまく動かずすみませんでした。。
この場を借りてお詫びさせて頂きます。
(準備していたときはまったく問題なく動いていたのですが。。日ごろの行いが悪かったんでしょうか。。(^^; )

ASP.NET MVC は、.NET 以外の Web アプリケーション開発においては非常に一般的な開発・設計手法である MVC パターンをベースに Web アプリケーションを開発できるようにする、ASP.NET の新しいサブフレームワークコンポーネントです。
MVC パターンを適用していることで、WebForms に比べてコントローラ (HTML画面の遷移やビジネスロジックの呼び出し) 部分の単体テスト性が高いこと、WebForms のポストバックとは異なり URL をリンク可能なものにしやすい、などの特徴があります。

ASP.NET MVC は現在 ASP.NET のコミュニティサイトならびに CodePlex でモジュールやソースコードが公開されています。なお、先週の TechEd でお話させて頂いた時点では Preview 4 という CTP が最新バージョンでしたが、今日現在では CodePldex で公開されている Preview 5 が最新バージョンになります。

ASP.NET Community - ASP.NET MVC
CodePlex - ASP.NET MVC

セッションスライドの方では日本語の情報リソースについてはまったく言及していませんでしたので、こちらで日本語の記事をいくつか紹介しておきます。

ASP.NET MVC - Web フォームを使用しないで Web アプリケーションを作成する @MSDN Magazine

MSDN マガジンの2008年3月号の記事です。ちょっと古いですが、全体的な雰囲気はわかるかと思われます。

もう一つのASP.NET「ASP.NET MVC」を知る (前編) @CodeZine
もう一つのASP.NET「ASP.NET MVC」を知る (後編) @CodeZine

ASP.NET MVP のナオキさんが最近執筆された記事です。
内容は非常によくまとまっていますし、Preview 4 や Visual Studio へのアイテムテンプレートのインストール方法についても触れていますので必見です。

なお、今後こちらのBlogではASP.NET MVCについてボチボチ書いていくつもりです。
乞うご期待！？