Présentation des modèles, des vues et des contrôleurs (VB)

2023-07-13

Vous ne connaissez pas les modèles, les vues et les contrôleurs ? Dans ce tutoriel, Stephen Walther vous présente les différentes parties d’une application ASP.NET MVC.

Ce tutoriel vous fournit une vue d’ensemble générale des modèles, vues et contrôleurs MVC ASP.NET. En d’autres termes, il explique les M', V' et C’dans ASP.NET MVC.

Après avoir lu ce tutoriel, vous devez comprendre comment les différentes parties d’une application ASP.NET MVC fonctionnent ensemble. Vous devez également comprendre en quoi l’architecture d’une application ASP.NET MVC diffère d’une application ASP.NET Web Forms ou d’une application Active Server Pages.

Exemple d’application MVC ASP.NET

Le modèle Visual Studio par défaut pour la création d’applications web ASP.NET MVC comprend un exemple d’application extrêmement simple qui peut être utilisé pour comprendre les différentes parties d’une application MVC ASP.NET. Nous tirerons parti de cette application simple dans ce tutoriel.

Vous créez une application ASP.NET MVC avec le modèle MVC en lançant Visual Studio 2008 et en sélectionnant l’option de menu Fichier, Nouveau projet (voir figure 1). Dans la boîte de dialogue Nouveau projet, sélectionnez votre langage de programmation favori sous Types de projets (Visual Basic ou C#), puis sélectionnez ASP.NET application web MVC sous Modèles. Cliquez sur le bouton OK.

Figure 01 : Boîte de dialogue Nouveau projet (cliquer pour afficher l’image en taille réelle)

Lorsque vous créez une application ASP.NET MVC, la boîte de dialogue Créer un projet de test unitaire s’affiche (voir la figure 2). Cette boîte de dialogue vous permet de créer un projet distinct dans votre solution pour tester votre application ASP.NET MVC. Sélectionnez l’option Non, ne créez pas de projet de test unitaire , puis cliquez sur le bouton OK .

Figure 02 : Boîte de dialogue Créer un test unitaire (cliquer pour afficher l’image en taille réelle)

Après la création de la nouvelle ASP.NET application MVC. Plusieurs dossiers et fichiers s’affichent dans la fenêtre Explorateur de solutions. En particulier, vous verrez trois dossiers nommés Modèles, Vues et Contrôleurs. Comme vous pouvez le deviner à partir des noms de dossiers, ces dossiers contiennent les fichiers permettant d’implémenter des modèles, des vues et des contrôleurs.

Si vous développez le dossier Controllers, vous devez voir un fichier nommé AccountController.vb et un fichier nommé HomeController.vb. Si vous développez le dossier Vues, vous devez voir trois sous-dossiers nommés Compte, Accueil et Partagé. Si vous développez le dossier Accueil, vous verrez deux fichiers supplémentaires nommés About.aspx et Index.aspx (voir la figure 3). Ces fichiers constituent l’exemple d’application inclus avec le modèle MVC ASP.NET par défaut.

Figure 03 : Fenêtre Explorateur de solutions (Cliquer pour afficher l’image en taille réelle)

Vous pouvez exécuter l’exemple d’application en sélectionnant l’option de menu Déboguer, Démarrer le débogage. Vous pouvez également appuyer sur la touche F5.

Lorsque vous exécutez une application ASP.NET pour la première fois, la boîte de dialogue de la figure 4 vous recommande d’activer le mode débogage. Cliquez sur le bouton OK pour que l’application s’exécute.

Figure 04 : Boîte de dialogue Débogage non activé (cliquer pour afficher l’image en taille réelle)

Lorsque vous exécutez une application ASP.NET MVC, Visual Studio lance l’application dans votre navigateur web. L’exemple d’application se compose uniquement de deux pages : la page Index et la page À propos de. Lorsque l’application démarre pour la première fois, la page Index s’affiche (voir la figure 5). Vous pouvez accéder à la page À propos en cliquant sur le lien de menu en haut à droite de l’application.

Figure 05 : Page d’index (cliquer pour afficher l’image en taille réelle)

Notez les URL dans la barre d’adresse de votre navigateur. Par exemple, lorsque vous cliquez sur le lien du menu À propos de, l’URL dans la barre d’adresse du navigateur devient /Home/About.

Si vous fermez la fenêtre du navigateur et revenez à Visual Studio, vous ne pourrez pas trouver de fichier avec le chemin d’accès Accueil/À propos de. Les fichiers n’existent pas. Comment est-ce possible ?

Une URL n’est pas égale à une page

Lorsque vous créez une application ASP.NET Web Forms traditionnelle ou une application Active Server Pages, il existe une correspondance un-à-un entre une URL et une page. Si vous demandez une page nommée SomePage.aspx à partir du serveur, il était préférable d’avoir une page sur le disque nommée SomePage.aspx. Si le fichier SomePage.aspx n’existe pas, vous obtenez une erreur 404 - Page introuvable .

Lors de la création d’une application ASP.NET MVC, en revanche, il n’existe aucune correspondance entre l’URL que vous tapez dans la barre d’adresse de votre navigateur et les fichiers que vous trouvez dans votre application. Dans une application ASP.NET MVC, une URL correspond à une action de contrôleur au lieu d’une page sur le disque.

Dans une application ASP.NET ou ASP traditionnelle, les demandes de navigateur sont mappées aux pages. Dans une application ASP.NET MVC, en revanche, les demandes de navigateur sont mappées aux actions du contrôleur. Une application ASP.NET Web Forms est centrée sur le contenu. Une application ASP.NET MVC, en revanche, est centrée sur la logique de l’application.

Présentation du routage ASP.NET

Une requête de navigateur est mappée à une action de contrôleur via une fonctionnalité de l’infrastructure ASP.NET appelée routage ASP.NET. ASP.NET routage est utilisé par l’infrastructure MVC ASP.NET pour acheminer les requêtes entrantes vers les actions du contrôleur.

ASP.NET Routage utilise une table de routage pour gérer les demandes entrantes. Cette table de routage est créée lors du premier démarrage de votre application web. La table de routage est configurée dans le fichier Global.asax. Le fichier MVC Global.asax par défaut se trouve dans listing 1.

Listing 1 - Global.asax

' Note: For instructions on enabling IIS6 or IIS7 classic mode, 
' visit https://go.microsoft.com/?LinkId=9394802

Public Class MvcApplication
    Inherits System.Web.HttpApplication

    Shared Sub RegisterRoutes(ByVal routes As RouteCollection)
        routes.IgnoreRoute("{resource}.axd/{*pathInfo}")

        ' MapRoute takes the following parameters, in order:
        ' (1) Route name
        ' (2) URL with parameters
        ' (3) Parameter defaults
        routes.MapRoute( _
            "Default", _
            "{controller}/{action}/{id}", _
            New With {.controller = "Home", .action = "Index", .id = ""} _
        )

    End Sub

    Sub Application_Start()
        RegisterRoutes(RouteTable.Routes)
    End Sub
End Class

Lorsqu’une application ASP.NET démarre pour la première fois, la méthode Application_Start() est appelée. Dans la liste 1, cette méthode appelle la méthode RegisterRoutes() et la méthode RegisterRoutes() crée la table de routage par défaut.

La table de routage par défaut se compose d’un itinéraire. Cet itinéraire par défaut divise toutes les requêtes entrantes en trois segments (un segment d’URL est n’importe quel élément entre les barres obliques). Le premier segment est mappé à un nom de contrôleur, le deuxième segment est mappé à un nom d’action et le dernier segment est mappé à un paramètre passé à l’action nommée Id.

Considérez par exemple l’URL suivante :

/Product/Details/3

Cette URL est analysée en trois paramètres comme suit :

Contrôleur = Produit

Action = Détails

Id = 3

L’itinéraire par défaut défini dans le fichier Global.asax inclut des valeurs par défaut pour les trois paramètres. Le contrôleur par défaut est Accueil, l’action par défaut est Index et l’ID par défaut est une chaîne vide. Avec ces valeurs par défaut à l’esprit, tenez compte de la façon dont l’URL suivante est analysée :

/Employee

Cette URL est analysée en trois paramètres comme suit :

Contrôleur = Employé

Action = Index

Id =

Enfin, si vous ouvrez une application ASP.NET MVC sans fournir d’URL (par exemple, http://localhost), l’URL est analysée comme suit :

Contrôleur = Accueil

Action = Index

Id =

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

Présentation des contrôleurs

Un contrôleur est chargé 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 d’une application MVC ASP.NET. Un contrôleur détermine la réponse à renvoyer à un utilisateur lorsqu’un utilisateur effectue une demande de navigateur.

Un contrôleur n’est qu’une classe (par exemple, une classe Visual Basic ou C#). L’exemple ASP.NET application MVC inclut un contrôleur nommé HomeController.vb situé dans le dossier Controllers. Le contenu du fichier HomeController.vb est reproduit dans la liste 2.

Listing 2 - HomeController.cs

<HandleError()> _
Public Class HomeController
    Inherits System.Web.Mvc.Controller

    Function Index()
        ViewData("Title") = "Home Page"
        ViewData("Message") = "Welcome to ASP.NET MVC!"

        Return View()
    End Function

    Function About()
        ViewData("Title") = "About Page"

        Return View()
    End Function
End Class

Notez que HomeController 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 appelle la méthode HomeController.Index() et l’URL /Home/About appelle la méthode HomeController.About().

Toute méthode publique dans un contrôleur est exposée en tant qu’action de contrôleur. Vous devez être prudent à ce sujet. Cela signifie que toute méthode publique contenue dans un contrôleur peut être appelée par toute personne ayant accès à Internet en entrant l’URL appropriée dans un navigateur.

Présentation des vues

Les deux actions de contrôleur exposées par la classe HomeController, Index() et About(), retournent toutes deux une vue. Une vue contient le balisage HTML et le contenu qui est envoyé au navigateur. Une vue est l’équivalent d’une page lorsque vous utilisez une application MVC ASP.NET.

Vous devez créer vos vues au bon emplacement. L’action HomeController.Index() retourne une vue située au chemin suivant :

\Views\Home\Index.aspx

L’action HomeController.About() retourne une vue située au chemin suivant :

\Views\Home\About.aspx

En général, si vous souhaitez retourner une vue pour une action de contrôleur, vous devez créer un sous-dossier dans le dossier Vues portant le même nom que votre contrôleur. Dans le sous-dossier, vous devez créer un fichier .aspx portant le même nom que l’action de contrôleur.

Le fichier de la liste 3 contient la vue About.aspx.

Listing 3 - About.aspx

<%@ Page Language="VB" 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 de la liste 3, la plupart du reste de l’affichage est constitué de code HTML standard. Vous pouvez modifier le contenu de l’affichage en entrant n’importe quel code HTML souhaité ici.

Une vue est très similaire à une page dans les pages Active Server ou ASP.NET Web Forms. Une vue peut contenir du contenu et des scripts HTML. Vous pouvez écrire les scripts dans votre langage de programmation .NET favori (par exemple, C# ou Visual Basic .NET). Vous utilisez des scripts pour afficher du contenu dynamique tel que des données de base de données.

Présentation des modèles

Nous avons discuté des contrôleurs et nous avons discuté des vues. Le dernier sujet que nous devons aborder est celui des modèles. Qu’est-ce qu’un modèle MVC ?

Un modèle MVC contient toute la logique de votre application qui n’est pas contenue dans une vue ou un contrôleur. Le modèle doit contenir toute la logique métier 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, vous devez créer vos classes Entity Framework (votre fichier .edmx) dans le dossier Models.

Une vue doit contenir uniquement une logique liée à la génération de l’interface utilisateur. Un contrôleur ne doit contenir que le strict minimum de logique nécessaire pour retourner la vue appropriée ou rediriger l’utilisateur vers une autre action (contrôle de flux). Tout le reste doit être contenu dans le modèle.

En général, vous devez vous efforcer pour les modèles gras et les contrôleurs skinny. Vos méthodes de contrôleur ne doivent contenir que quelques lignes de code. Si une action de contrôleur devient trop grosse, vous devez envisager de déplacer la logique vers une nouvelle classe dans le dossier Models.

Résumé

Ce tutoriel vous a fourni une vue d’ensemble générale des différentes parties d’une application web ASP.NET MVC. Vous avez appris comment le routage ASP.NET mappe les requêtes de navigateur entrantes à des actions de contrôleur particulières. Vous avez appris comment les contrôleurs orchestrent la façon dont les affichages sont retournés au navigateur. Enfin, vous avez appris comment les modèles contiennent une logique d’activité d’application, de validation et d’accès à la base de données.

Partager via