ASP.NET Core MVC の概要Overview of ASP.NET Core MVC

作成者: Steve SmithBy Steve Smith

ASP.NET Core MVC は、モデル ビュー コントローラー デザイン パターンを使用して、Web アプリと API をビルドするための豊富なフレームワークです。ASP.NET Core MVC is a rich framework for building web apps and APIs using the Model-View-Controller design pattern.

MVC パターンとは何ですか?What is the MVC pattern?

モデル ビュー コントローラー (MVC) アーキテクチャ パターンでは、アプリケーションをモデル、ビュー、コントローラーという 3 つの主要なコンポーネントのグループに分けます。The Model-View-Controller (MVC) architectural pattern separates an application into three main groups of components: Models, Views, and Controllers. このパターンは、関心の分離を実現するのに役立ちます。This pattern helps to achieve separation of concerns. このパターンを使用すると、ユーザーの要求が、ユーザーの操作を実行したり、クエリの結果を取得したりするためにモデルを操作する役割がある、コントローラーにルーティングされます。Using this pattern, user requests are routed to a Controller which is responsible for working with the Model to perform user actions and/or retrieve results of queries. コントローラーでは、ユーザーに表示するビューを選び、必要なモデル データと共に提供します。The Controller chooses the View to display to the user, and provides it with any Model data it requires.

次の図は、3 つの主要なコンポーネントと、どのコンポーネントがどのコンポーネントを参照するかを示しています。The following diagram shows the three main components and which ones reference the others:

MVC パターン

この責任の概念は、複雑さの観点からアプリケーションを計るために役立ちます。それは、単一のジョブを持つ (また、単一責任の原則に従う) もの (モデル、ビュー、コントローラー) をコーディング、デバッグ、およびテストする方が簡単なためです。This delineation of responsibilities helps you scale the application in terms of complexity because it's easier to code, debug, and test something (model, view, or controller) that has a single job (and follows the Single Responsibility Principle). これらの 3 つの領域の 2 つ以上に依存関係が広がるコードを更新、テスト、デバッグする方が難しいです。It's more difficult to update, test, and debug code that has dependencies spread across two or more of these three areas. たとえば、ユーザー インターフェイス ロジックは、ビジネス ロジックよりも頻繁に変更される傾向があります。For example, user interface logic tends to change more frequently than business logic. プレゼンテーション コードとビジネス ロジックが 1 つのオブジェクトに結合されている場合は、ユーザー インターフェイスを変更するたびに、ビジネス ロジックを含むオブジェクトは変更されます。If presentation code and business logic are combined in a single object, an object containing business logic must be modified every time the user interface is changed. これにより、エラーが発生することが多く、最小限のユーザー インターフェイスの変更後に毎回ビジネス ロジックのテストを再実行する必要があります。This often introduces errors and requires the retesting of business logic after every minimal user interface change.

注意

ビューとコントローラーは両方ともモデルに依存します。Both the view and the controller depend on the model. ただし、モデルはビューにもコントローラーにも依存しません。However, the model depends on neither the view nor the controller. これは、分離の主な利点の 1 つです。This is one of the key benefits of the separation. この分離によって、モデルをビルドし、視覚表示の独立をテストすることができます。This separation allows the model to be built and tested independent of the visual presentation.

モデルの責任Model Responsibilities

MVC アプリケーションのモデルは、アプリケーションの状態、およびアプリケーションによって実行されるビジネス ロジックや操作を表します。The Model in an MVC application represents the state of the application and any business logic or operations that should be performed by it. ビジネス ロジックは、アプリケーションの状態を保持するための実装ロジックと共に、モデルにカプセル化される必要があります。Business logic should be encapsulated in the model, along with any implementation logic for persisting the state of the application. 通常、厳密に型指定されたビューでは、そのビューに表示するデータを含めるようにデザインされた ViewModel 型を使用します。Strongly-typed views typically use ViewModel types designed to contain the data to display on that view. コントローラーは、モデルからこれらの ViewModel インスタンスを作成します。The controller creates and populates these ViewModel instances from the model.

注意

MVC アーキテクチャ パターンを使用するアプリでモデルを整理する方法は、数多くあります。There are many ways to organize the model in an app that uses the MVC architectural pattern. 詳細については、さまざまな種類のモデルの型に関するページを参照してください。Learn more about some different kinds of model types.

ビューの責任View Responsibilities

ビューは、ユーザー インターフェイスを介してコンテンツを表示する役割があります。Views are responsible for presenting content through the user interface. ビューでは Razor ビュー エンジン を使用して、HTML マークアップに .NET コードを埋め込みます。They use the Razor view engine to embed .NET code in HTML markup. ビュー内のロジックは最小限にする必要があり、そこに含まれるロジックはすべて、コンテンツの表示に関連する必要があります。There should be minimal logic within views, and any logic in them should relate to presenting content. 複雑なモデルからデータを表示するために、ビュー ファイルで多くのロジックを実行する必要がある場合、ビューを簡略化するために、ビューのコンポーネント、ViewModel、テンプレートの表示を使用することを検討してください。If you find the need to perform a great deal of logic in view files in order to display data from a complex model, consider using a View Component, ViewModel, or view template to simplify the view.

コントローラーの責任Controller Responsibilities

コントローラーは、ユーザーの操作を処理し、モデルを操作し、最終的にレンダリングするビューを選択するコンポーネントです。Controllers are the components that handle user interaction, work with the model, and ultimately select a view to render. MVC アプリケーションでは、ビューは情報のみを表示し、コントローラーがユーザーの入力と操作を処理して応答します。In an MVC application, the view only displays information; the controller handles and responds to user input and interaction. MVC パターンでは、コントローラーは最初のエントリ ポイントであり、処理するモデルの型およびレンダリングするビューを選択する役割があります (そのため、このような名前で呼ばれており、アプリが指定した要求に応答する方法を制御します)。In the MVC pattern, the controller is the initial entry point, and is responsible for selecting which model types to work with and which view to render (hence its name - it controls how the app responds to a given request).

注意

コントローラーは責任が非常に多いので、過度に複雑にしないでください。Controllers shouldn't be overly complicated by too many responsibilities. コントローラー ロジックが過度に複雑にならないように、単一責任の原則を使って、ビジネス ロジックをコントローラーから排除し、ドメイン モデルに含めます。To keep controller logic from becoming overly complex, use the Single Responsibility Principle to push business logic out of the controller and into the domain model.

ヒント

コントローラーのアクションで、頻繁に同じ種類のアクションを実行することがわかった場合、これらの一般的なアクションをフィルターに移動して、DRY 原則に従うことができます。If you find that your controller actions frequently perform the same kinds of actions, you can follow the Don't Repeat Yourself principle by moving these common actions into filters.

ASP.NET Core MVC とは何ですか?What is ASP.NET Core MVC

ASP.NET Core MVC フレームワークは、ASP.NET Core と共に使用するために最適化された、ライトウェイトかつオープン ソースのテストしやすいプレゼンテーション フレームワークです。The ASP.NET Core MVC framework is a lightweight, open source, highly testable presentation framework optimized for use with ASP.NET Core.

ASP.NET Core MVC では、明確な関心の分離を可能にする動的な Web サイトをビルドするためのパターン ベースの方法を提供します。ASP.NET Core MVC provides a patterns-based way to build dynamic websites that enables a clean separation of concerns. ここでは、マークアップのフル コントロールが提供され、TDD 向けの開発をサポートし、最新の Web 標準を使用することができます。It gives you full control over markup, supports TDD-friendly development and uses the latest web standards.

フィーチャーFeatures

ASP.NET Core MVC には、以下が含まれます。ASP.NET Core MVC includes the following:

ルーティングRouting

ASP.NET Core MVC は、ASP.NET Core のルーティングの上にビルドされます。このルーティングは強力な URL マッピング コンポーネントで、わかりやすく検索可能な URL のアプリケーションをビルドできます。ASP.NET Core MVC is built on top of ASP.NET Core's routing, a powerful URL-mapping component that lets you build applications that have comprehensible and searchable URLs. これにより、Web サーバー上のファイルを整理する方法に関係なく、検索エンジンの最適化 (SEO) およびリンクの作成に適しているアプリケーションの URL の名前付けパターンを定義できます。This enables you to define your application's URL naming patterns that work well for search engine optimization (SEO) and for link generation, without regard for how the files on your web server are organized. ルート値制約、既定値、省略可能な値をサポートする、便利なルート テンプレートの構文を使用して、ルートを定義できます。You can define your routes using a convenient route template syntax that supports route value constraints, defaults and optional values.

規約に基づくルーティングでは、アプリケーションが受け入れる URL 形式、およびそれらの各形式を指定したコントローラー上の特定のアクション メソッドにマップする方法をグローバルに定義することができます。Convention-based routing enables you to globally define the URL formats that your application accepts and how each of those formats maps to a specific action method on given controller. 受信要求を受け取ると、ルーティング エンジンは URL を解析し、定義された URL 形式のいずれかに合わせて、関連するコントローラーのアクション メソッドを呼び出します。When an incoming request is received, the routing engine parses the URL and matches it to one of the defined URL formats, and then calls the associated controller's action method.

routes.MapRoute(name: "Default", template: "{controller=Home}/{action=Index}/{id?}");

属性のルーティングでは、アプリケーションのルートを定義する属性でコントローラーとアクションを装飾して、ルーティング情報を指定できます。Attribute routing enables you to specify routing information by decorating your controllers and actions with attributes that define your application's routes. つまり、ルート定義は、関連付けられているコントローラーとアクションの横に配置されるということです。This means that your route definitions are placed next to the controller and action with which they're associated.

[Route("api/[controller]")]
public class ProductsController : Controller
{
  [HttpGet("{id}")]
  public IActionResult GetProduct(int id)
  {
    ...
  }
}

モデル バインドModel binding

ASP.NET Core MVC のモデル バインドは、クライアント要求データ (フォームの値、ルート データ、クエリ文字列のパラメーター、HTTP ヘッダー) をコントローラーが処理できるオブジェクトに変換します。ASP.NET Core MVC model binding converts client request data (form values, route data, query string parameters, HTTP headers) into objects that the controller can handle. その結果、コントローラー ロジックは、受信要求データを判断する作業を行う必要はありません。そのアクション メソッドに対するパラメーターとしてデータを持つだけです。As a result, your controller logic doesn't have to do the work of figuring out the incoming request data; it simply has the data as parameters to its action methods.

public async Task<IActionResult> Login(LoginViewModel model, string returnUrl = null) { ... }

モデルの検証Model validation

ASP.NET Core MVC では、データ注釈の検証属性でモデル オブジェクトを装飾することで、検証をサポートします。ASP.NET Core MVC supports validation by decorating your model object with data annotation validation attributes. 検証属性は、値をサーバーにポストする前に、クライアント側でチェックされ、コントローラー アクションが呼び出される前に、サーバー側でチェックされます。The validation attributes are checked on the client side before values are posted to the server, as well as on the server before the controller action is called.

using System.ComponentModel.DataAnnotations;
public class LoginViewModel
{
    [Required]
    [EmailAddress]
    public string Email { get; set; }

    [Required]
    [DataType(DataType.Password)]
    public string Password { get; set; }

    [Display(Name = "Remember me?")]
    public bool RememberMe { get; set; }
}

コントローラー アクション:A controller action:

public async Task<IActionResult> Login(LoginViewModel model, string returnUrl = null)
{
    if (ModelState.IsValid)
    {
      // work with the model
    }
    // At this point, something failed, redisplay form
    return View(model);
}

フレームワークでは、クライアントとサーバーの両方で要求データの検証を処理します。The framework handles validating request data both on the client and on the server. モデルの型に指定された検証ロジックは、控えめな注釈としてレンダリングされたビューに追加され、jQuery Validation を使ってブラウザーに適用されます。Validation logic specified on model types is added to the rendered views as unobtrusive annotations and is enforced in the browser with jQuery Validation.

依存関係の挿入Dependency injection

ASP.NET Core には、依存関係の挿入 (DI) の組み込みのサポートがあります。ASP.NET Core has built-in support for dependency injection (DI). ASP.NET Core MVC では、コントローラーは、明示的な依存関係の原則に従うことを許可して、コンストラクターを介して必要なサービスを要求できます。In ASP.NET Core MVC, controllers can request needed services through their constructors, allowing them to follow the Explicit Dependencies Principle.

また、自分のアプリで、@inject ディレクティブを使用して、ビュー ファイルに依存関係の挿入を使用することもできます。Your app can also use dependency injection in view files, using the @inject directive:

@inject SomeService ServiceName
<!DOCTYPE html>
<html lang="en">
<head>
    <title>@ServiceName.GetTitle</title>
</head>
<body>
    <h1>@ServiceName.GetTitle</h1>
</body>
</html>

フィルターFilters

フィルターは、開発者が例外処理や承認など、横断的関心事をカプセル化するのに役立ちます。Filters help developers encapsulate cross-cutting concerns, like exception handling or authorization. フィルターでは、アクション メソッドの前処理と後処理ロジックを実行できるようにします。また、指定した要求の実行パイプライン内のある時点で実行するように構成することもできます。Filters enable running custom pre- and post-processing logic for action methods, and can be configured to run at certain points within the execution pipeline for a given request. フィルターは、属性としてコントローラーまたはアクションに適用できます (または、グローバルに実行できます)。Filters can be applied to controllers or actions as attributes (or can be run globally). いくつかのフィルター (Authorize など) は、フレームワークに含まれます。Several filters (such as Authorize) are included in the framework.

[Authorize]
   public class AccountController : Controller
   {

AreasAreas

区分は、大きな ASP.NET Core MVC Web アプリを小さな機能グループに分割するための方法を提供します。Areas provide a way to partition a large ASP.NET Core MVC Web app into smaller functional groupings. 区分は、アプリケーション内の MVC 構造体となります。An area is an MVC structure inside an application. MVC プロジェクトでは、モデル、コント ローラー、ビューなどの論理コンポーネントが異なるフォルダーに保持され、MVC では名前付け規則を使用して、これらのコンポーネントの関係を作成します。In an MVC project, logical components like Model, Controller, and View are kept in different folders, and MVC uses naming conventions to create the relationship between these components. 大きなアプリでは、アプリを機能の個別の高レベル区分に分割すると便利な場合があります。For a large app, it may be advantageous to partition the app into separate high level areas of functionality. たとえば、チェックアウト、請求、検索などの複数のビジネス ユニットを持つ e コマース アプリの場合です。これらのユニットにはそれぞれ独自の論理コンポーネント ビュー、コントローラー、およびモデルがあります。For instance, an e-commerce app with multiple business units, such as checkout, billing, and search etc. Each of these units have their own logical component views, controllers, and models.

Web APIWeb APIs

Web サイトのビルドに最適なプラットフォームというだけでなく、ASP.NET Core MVC には Web API のビルドに適したサポートがあります。In addition to being a great platform for building web sites, ASP.NET Core MVC has great support for building Web APIs. ブラウザーやモバイル デバイスなど、さまざまなクライアントに提供されるサービスをビルドできます。You can build services that reach a broad range of clients including browsers and mobile devices.

フレームワークには、JSON または XML として 書式のデータの組み込みサポートと共に、HTTP コンテンツ ネゴシエーションのサポートが含まれます。The framework includes support for HTTP content-negotiation with built-in support to format data as JSON or XML. カスタム フォーマッタを作成して、独自の書式のサポートを追加します。Write custom formatters to add support for your own formats.

リンクの生成を使って、ハイパーメディアのサポートを有効にします。Use link generation to enable support for hypermedia. 自分の Web API を複数の Web アプリケーションで共有できるように、クロス オリジン リソース共有 (CORS) のサポートを簡単に有効にできます。Easily enable support for cross-origin resource sharing (CORS) so that your Web APIs can be shared across multiple Web applications.

テストの容易性Testability

フレームワークでインターフェイスと依存関係の挿入を使用して、単体テストに適するようにします。また、フレームワークには、統合テストもすばやく簡単にする機能 (Entity Framework の TestHost と InMemory プロバイダーなど) が含まれます。The framework's use of interfaces and dependency injection make it well-suited to unit testing, and the framework includes features (like a TestHost and InMemory provider for Entity Framework) that make integration tests quick and easy as well. 詳細については、コントローラー ロジックのテスト方法に関するページを参照してください。Learn more about how to test controller logic.

Razor ビュー エンジンRazor view engine

ASP.NET Core MVC ビューでは、Razor ビュー エンジンを使用してビューをレンダリングします。ASP.NET Core MVC views use the Razor view engine to render views. Razor は、埋め込みの C# コードを使用してビューを定義するためのコンパクトで豊富な表現かつ流動的なテンプレートのマークアップ言語です。Razor is a compact, expressive and fluid template markup language for defining views using embedded C# code. Razor は、サーバーに Web コンテンツを動的に作成するために使用されます。Razor is used to dynamically generate web content on the server. サーバー コードを、クライアント側のコンテンツとコードにクリーンに混在させることができます。You can cleanly mix server code with client side content and code.

<ul>
  @for (int i = 0; i < 5; i++) {
    <li>List item @i</li>
  }
</ul>

Razor ビュー エンジンを使用して、レイアウト部分ビュー、置き換え可能なセクションを定義できます。Using the Razor view engine you can define layouts, partial views and replaceable sections.

厳密に型指定されたビューStrongly typed views

MVC の Razor ビューは、モデルを基にして厳密に型指定できます。Razor views in MVC can be strongly typed based on your model. コントローラーは、ビューの型チェックと IntelliSense サポートを有効にして、厳密に型指定されたモデルをビューに渡すことができます。Controllers can pass a strongly typed model to views enabling your views to have type checking and IntelliSense support.

たとえば、次のビューでは、モデルの型 IEnumerable<Product> をレンダリングします。For example, the following view renders a model of type IEnumerable<Product>:

@model IEnumerable<Product>
<ul>
    @foreach (Product p in Model)
    {
        <li>@p.Name</li>
    }
</ul>

タグ ヘルパーTag Helpers

タグ ヘルパーを使うと、Razor ファイルでの HTML 要素の作成とレンダリングに、サーバー側コードを組み込むことができます。Tag Helpers enable server side code to participate in creating and rendering HTML elements in Razor files. タグ ヘルパーを使って、カスタム タグ (例: <environment>) を定義したり、既存のタグ (例: <label>) の動作を変更したりすることができます。You can use tag helpers to define custom tags (for example, <environment>) or to modify the behavior of existing tags (for example, <label>). タグ ヘルパーは、要素名とその属性に基づいて特定の要素をバインドします。Tag Helpers bind to specific elements based on the element name and its attributes. タグ ヘルパーでは、HTML の編集操作を保持しながら、サーバー側のレンダリングの利点を提供します。They provide the benefits of server-side rendering while still preserving an HTML editing experience.

フォームやリンクの作成、資産の読み込みなど、一般的なタスクに対する組み込みのタグ ヘルパーは数多く存在します。パブリック GitHub リポジトリで NuGet パッケージとして使用することもできます。There are many built-in Tag Helpers for common tasks - such as creating forms, links, loading assets and more - and even more available in public GitHub repositories and as NuGet packages. タグ ヘルパーは C# で作成され、要素名、属性名、または親タグに基づく HTML 要素をターゲットとします。Tag Helpers are authored in C#, and they target HTML elements based on element name, attribute name, or parent tag. たとえば、組み込みの LinkTagHelper を使用して、AccountsControllerLogin へのリンクを作成することができます。For example, the built-in LinkTagHelper can be used to create a link to the Login action of the AccountsController:

<p>
    Thank you for confirming your email.
    Please <a asp-controller="Account" asp-action="Login">Click here to Log in</a>.
</p>

EnvironmentTagHelper を使用して、開発、ステージング、運用など、ランタイム環境に基づいて、ビュー (未加工、縮小など) にさまざまなスクリプトを含めることができます。The EnvironmentTagHelper can be used to include different scripts in your views (for example, raw or minified) based on the runtime environment, such as Development, Staging, or Production:

<environment names="Development">
    <script src="~/lib/jquery/dist/jquery.js"></script>
</environment>
<environment names="Staging,Production">
    <script src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-2.1.4.min.js"
            asp-fallback-src="~/lib/jquery/dist/jquery.min.js"
            asp-fallback-test="window.jQuery">
    </script>
</environment>

タグ ヘルパーでは、HTML に適した開発機能、および HTML および Razor マークアップを作成するための豊富な IntelliSense 環境を提供します。Tag Helpers provide an HTML-friendly development experience and a rich IntelliSense environment for creating HTML and Razor markup. 組み込みのタグ ヘルパーのほとんどは、既存の HTML 要素をターゲットとし、要素に対してサーバー側の属性を提供します。Most of the built-in Tag Helpers target existing HTML elements and provide server-side attributes for the element.

ビュー コンポーネントView Components

ビュー コンポーネントを使用すると、レンダリング ロジックをパッケージ化し、アプリケーション全体で再利用することができます。View Components allow you to package rendering logic and reuse it throughout the application. これは部分ビューと似ていますが、関連するロジックを含みます。They're similar to partial views, but with associated logic.