Comprendre les modèles, vues et contrôleurs

Cet article est la traduction la plus fidèle possible de l’article original : Understanding Models, Views, and Controllers

Ce tutoriel vous propose une présentation succincte des modèles, vues et contrôleurs ASP.Net MVC. En d’autres mots, il explique la signification des lettres M, V et C de l’acronyme MVC.

Après avoir lu ce tutoriel, vous devriez comprendre comment les différentes parties d’une application MVC marchent ensemble. Vous devriez aussi comprendre comment l’architecture d’une application MVC diffère d’une application Web Forms.

Le template par défaut pour créer une application ASP.Net MVC inclut une application d’exemple extrêmement simple qui peut être utilisée pour comprendre les différentes parties d’une application MVC. Nous allons tirer avantage de cet exemple au sein de cet article.

Vous créez une nouvelle application MVC avec le template MVC en lançant Visual Studio 2008, en sélectionnant le menu Fichier > Nouveau projet. Dans la fenêtre de nouveau projet, choisissez Application ASP.Net MVC. Cliquez alors sur le bouton OK.

Lorsque vous créez une nouvelle application ASP.Net MVC, la fenêtre de dialogue de création d’un projet de Test unitaire apparait. La fenêtre vous permet de créer un projet séparé dans votre solution, vous permettant de tester votre application ASP.Net MVC. Choisissez l’option « Non, ne pas créer de projet de test unitaire » et cliquez sur OK.

Après que la nouvelle application ASP.Net MVC soit créée, vous allez voir plus dossiers et fichiers dans la fenêtre Explorateur de Solution. En particulier, vous allez voir trois dossiers nommés Models, Views et Controllers. Comme vous pouvez le deviner de par leurs noms, ces dossiers vont contenir nos modèles, nos vues et nos contrôleurs.

Si vous dépliez le dossier Controllers, vous devriez voir un fichier nommé AccountController.cs et un fichier nommé HomeController.cs. Si vous dépliez le dossier Views, vous devriez voir trois sous-dossiers nommés Account, Home et Shared. Dans le dossier Home, vous devriez notamment trouver deux fichiers additionnels nommés About.aspx et Index.aspx. Ces fichiers représentent l’application d’exemple incluse avec le template ASP.Net MVC par défaut.

Vous pouvez lancer l’application en cliquant sur le menu Debug => Commencer le débogage ou alors en cliquant sur la touche F5.

Lorsque vous lancez une application MVC pour la première fois, la fenêtre de dialogue suivante apparait, vous recommandant d’activer le mode debug. Cliquez alors sur OK pour voir l’application se lancer.

Lorsque vous lancez une application ASP.Net MVC, Visual Studio lance l’application dans votre navigateur Web. L’application d’exemple consiste en deux pages : la page Index et la page About. Lorsque l’application démarre pour la première fois, la page Index apparait. Vous pouvez naviguer vers la page About en cliquant sur le lien en haut à droit de la page.

Notez les URL dans la barre d’adresse de votre navigateur. Par exemple, lorsque vous cliquez sur le lien About, l’URL change pour devenir /Home/About.

Si vous fermez la fenêtre du navigateur et retournez sous Visual Studio, vous ne trouverez aucun fichier avec le chemin Home/About. Comment cela est-il possible ?

Lorsque vous construisez une application traditionnelle ASP.Net (Web Forms), il y a une correspondance un-un entre une URL et une page. Si vous demandez la page SomePage.aspx au serveur, alors il doit forcément exister une page sur le disque qui soit nommée SomePage.aspx. Si la page n’existe pas alors vous obtenez une magnifique erreur 404 – Page Not Found.

Au contraire donc, sur une application MVC, une URL correspondre à une action contrôleur (en lieu et place d’une page sur le disque), il n’y a donc aucune correspondance entre l’URL que vous saisissez dans votre navigateur Web et les fichiers que vous trouvez dans votre application.

Dans une application traditionnelle ASP.Net, les requêtes navigateur sont mappées vers des pages. Au contraire, dans une application MVC, les requêtes sont mappées à des actions de contrôleur. Ainsi, une application ASP.Net est dite « centrée sur le contenu » (content-centric) alors qu’une application MVC est dite « centrée logiquement » (logic centric).

Une requête navigateur est liée à une action contrôleur à travers une fonctionnalité du framework ASP.Net nommé le routage ASP.Net. Le routage ASP.Net est utilisé par le framework MVC pour router les requêtes vers les actions des contrôleurs.

Le routage ASP.Net utilise une table de routage pour gérer les requêtes entrantes. La table de route est créée lorsque votre application démarre pour la première fois. Cette table est configurée dans le fichier Global.asax. Voici le contenu du Global.asax par défaut.

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using System.Web.Routing;

namespace MvcApplication1
{
    // Note: For instructions on enabling IIS6 or IIS7 classic mode, 
    // visit http://go.microsoft.com/?LinkId=9394801

    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);
        }
    }
}

Lorsqu’une application MVC démarre pour la première fois, la méthode Application_Start() est appelée. Cette méthode appelle alors la méthode RegisterRoutes() qui crée la table de routage.

La table de routage par défaut consiste en une seule et unique route. Cette route par défaut découpe toutes les requêtes entrantes en trois segments (un segment URL est tout ce qui se trouve entre les slashs). Le premier segment est mappé sur le nom du contrôleur, le second sur le nom de l’action et le segment final est mappé sur un paramètre passé à l’action et nommé Id.

Par exemple, considérez l’URL suivante :
/Product/Details/3

Cette URL est parsée en trois paramètres comme ceci :
Controller = Product
Action = Details
Id = 3

La route par défaut définie dans le fichier Global.asax inclut des valeurs par défaut pour les trois paramètres. Le contrôleur par défaut est Home, l’action par défaut est Index et la valeur par défaut pour Id est une chaine vide. Avec ces valeurs par défaut, considérez l’URL suivante :
/Employee

Cette URL est parsée en trois paramètres comme ceci :
Controller = Employee
Action = Index
Id = ??

Enfin, si vous ouvrez une application MVC sans fournir aucune URL (par exemple http://localhost) alors l’URL est parsée comme ceci :
Controller = Home
Action = Index
Id = ??

La requête est routée vers l’action Index() de la classe HomeController.

Un contrôleur est responsable de contrôler la façon dont un utilisateur interagit avec une application MVC. Un contrôleur contient la logique de contrôle de flux pour une application MVC. Le contrôleur détermine quelle réponse renvoyer lorsque l’utilisateur fait une requête navigateur.

Un contrôleur est juste une classe (par exemple, une classe Visual Basic ou C#). L’exemple d’application MVC inclut un contrôleur nommé HomeController.cs situé dans le dossier Controllers. Le contenu du fichier HomeController.cs est le suivant :

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;

namespace MvcApplication1.Controllers
{
    [HandleError]
    public class HomeController : Controller
    {
        public ActionResult Index()
        {
            ViewData["Title"] = "Home Page";
            ViewData["Message"] = "Welcome to ASP.NET MVC!";

            return View();
        }

        public ActionResult About()
        {
            ViewData["Title"] = "About Page";

            return View();
        }
    }
}

Notez que le contrôleur a deux méthodes nommées Index() et About(). Ces deux méthodes correspondent aux deux actions exposées par le contrôleur. L’URL /Home/Index invoque la méthode HomeController.Index() et l’URL /Home/About invoque la méthode HomeController.About().

Toute méthode publique d’un contrôleur est automatiquement exposée comme une action du contrôleur. Vous devez faire attention à cela. Cela signifie que toute méthode publique d’un contrôleur peut être invoquée directement par n’importe qui ayant accès à Internet et entrant la bonne URL dans son navigateur.

Les deux actions du contrôleur exposées par la classe HomeController, Index() et About(), retournent toutes les deux une vue. Une vue contient les balises HTML et le contenu, qui est envoyé au navigateur. Une vue est équivalente à une page lorsque l’ont travail dans une application ASP.Net MVC.

Vous devez créer vos vues au bon endroit. L’actionHomeController.Index() retourne une vue située dans le chemin suivant :
\Views\Home\Index.aspx

L’action HomeController.About() retourne une vue située dans le chemin suivant :
\Views\Home\About.aspx

En général, si vous voulez retourner une vue pour une action d’un contrôleur, alors vous devez créer un sous-dossier dans le dossier Views, avec le même nom que le contrôleur. Dans ce sous-dossier, vous devez créer un fichier aspx avec le même nom que l’action du contrôleur.

<%@ Page Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage" %>

<asp:Content ID="aboutContent" ContentPlaceHolderID="MainContent" runat="server">
    <h2>About</h2>
    <p>
        Put content here.
    </p>
</asp:Content>

Si vous ignorez la première ligne du code précédent, la majorité du contenu d’une vue consiste en du simple code HTML. Vous pouvez modifier le contenu d’une vue en saisissant simplement le code HTML que de ce que vous voulez afficher.

Une vue est très similaire à une page ASP.Net Web Forms. Une vue peut contenir du code HTML et des scripts. Vous pouvez écrire les scripts dans votre langage de programmation .Net préféré (par exemple C# ou Visual Basic. Vous utilisez les scripts pour afficher du contenu dynamique tel que des données extraites d’une base.

Nous avons discuté des contrôleurs et des vues. Le dernier sujet dont nous devons parler concerne donc les modèles. Mais qu’est-ce que les modèles MVC?

Un modèle MVC contient toute votre logique applicative qui n’est pas contenue dans une vue ou un contrôleur. Le modèle devrait contenir toute la logique business de votre application, la logique de validation, et la logique d’accès à la base de données. Par exemple, si vous utilisez Microsoft Entity Framework pour accéder à votre base de données, alors vous devriez créer vos classes Entity Framework (fichiers edmx) dans le répertoire Models.

Une vue devrait seulement contenir la logique liée à la génération de l’interface utilisateur. Un contrôleur devrait seulement contenir le strict minimum de logique pour retourner la bonne vue ou rediriger l’utilisateur vers une autre action (contrôle de flux). Tout le reste devrait être contenu dans le modèle. En général, vous devriez en général, vous efforcer d’avoir des gros modèles et des petits contrôleurs. Les méthodes des contrôleurs ne devraient contenir que très peu de lignes de code. Si une action contrôleur devient trop grosse, alors vous devriez considérer à sortir la logique et l’inclure dans une nouvelle classe dans le dossier Models.

Ce tutoriel vous a fourni un survol des différentes parties d’une application Web MVC. Vous avez appris comment le routage ASP.Net, lit les requêtes navigateur entrantes vers des actions particulières. Vous avez appris comment les contrôleurs orchestrent comment les vues sont retournées au navigateur. Enfin, vous avez appris comment les modèles contiennent les logiques business, de validation et de base de données de votre application.