Partager via

Personnalisation du comportement Site-Wide pour les sites pages Web ASP.NET (Razor)

  • Article

par Tom FitzMacken

Cet article explique comment créer des paramètres côté site pour les pages d’un site web pages Web ASP.NET (Razor).

Ce que vous allez apprendre :

  • Comment exécuter du code qui vous permet de définir des valeurs (valeurs globales ou paramètres d’assistance) pour toutes les pages d’un site.
  • Comment exécuter du code qui vous permet de définir des valeurs pour toutes les pages d’un dossier.
  • Comment exécuter du code avant et après le chargement d’une page.
  • Comment envoyer des erreurs à une page d’erreur centrale.
  • Comment ajouter l’authentification à toutes les pages d’un dossier.

Versions logicielles utilisées dans le tutoriel

  • pages Web ASP.NET (Razor) 2
  • WebMatrix 3
  • bibliothèque ASP.NET Web Helpers (package NuGet)

Ce tutoriel fonctionne également avec pages Web ASP.NET 3 et Visual Studio 2013 (ou Visual Studio Express 2013 pour le web), sauf que vous ne pouvez pas utiliser la bibliothèque ASP.NET Web Helpers.

Ajout du code de démarrage du site web pour pages Web ASP.NET

Pour une grande partie du code que vous écrivez dans pages Web ASP.NET, une page individuelle peut contenir tout le code requis pour cette page. Par exemple, si une page envoie un e-mail, il est possible de placer tout le code de cette opération dans une seule page. Cela peut inclure le code permettant d’initialiser les paramètres d’envoi d’e-mails (c’est-à-dire, pour le serveur SMTP) et d’envoi du message électronique.

Toutefois, dans certaines situations, vous pouvez exécuter du code avant qu’une page du site ne s’exécute. Cela est utile pour définir des valeurs qui peuvent être utilisées n’importe où dans le site ( appelées valeurs globales).) Par exemple, certaines assistances vous obligent à fournir des valeurs telles que des paramètres de messagerie ou des clés de compte. Il peut être pratique de conserver ces paramètres dans des valeurs globales.

Pour ce faire, créez une page nommée _AppStart.cshtml à la racine du site. Si cette page existe, elle s’exécute la première fois qu’une page du site est demandée. Par conséquent, c’est un bon endroit pour exécuter du code pour définir des valeurs globales. (Étant donné que _AppStart.cshtml a un préfixe de trait de soulignement, ASP.NET n’enverra pas la page à un navigateur même si les utilisateurs la demandent directement.)

Le diagramme suivant montre le fonctionnement de la page _AppStart.cshtml . Lorsqu’une demande est envoyée pour une page, et s’il s’agit de la première demande pour une page du site, ASP.NET vérifie d’abord si une page _AppStart.cshtml existe. Si c’est le cas, tout code de la page _AppStart.cshtml s’exécute, puis la page demandée s’exécute.

[Image montrant comment app star dot CSHTML fonctionne.]

Définition de valeurs globales pour votre site web

  1. Dans le dossier racine d’un site web WebMatrix, créez un fichier nommé _AppStart.cshtml. Le fichier doit se trouver à la racine du site.

  2. Remplacez le contenu existant par ce qui suit :

    @{
  AppState["customAppName"] = "Application Name";
}

    Ce code stocke une valeur dans le AppState dictionnaire, qui est automatiquement disponible pour toutes les pages du site. Notez que le fichier _AppStart.cshtml ne contient aucun balisage. La page exécute le code, puis redirige vers la page qui a été demandée à l’origine.

    Notes

    Soyez prudent lorsque vous placez du code dans le fichier _AppStart.cshtml . Si des erreurs se produisent dans le code du fichier _AppStart.cshtml , le site web ne démarre pas.

  3. Dans le dossier racine, créez une page nommée AppName.cshtml.

  4. Remplacez le balisage et le code par défaut par les éléments suivants :

    <!DOCTYPE html>
<html>
    <head>
        <title>Show Application Name</title>
    </head>
    <body>
        <h1>@AppState["customAppName"]</h1>
    </body>
</html>

    Ce code extrait la valeur de l’objet AppState que vous définissez dans la page _AppStart.cshtml .

  5. Exécutez la page AppName.cshtml dans un navigateur. (Vérifiez que la page est sélectionnée dans l’espace de travail Fichiers avant de l’exécuter.) La page affiche la valeur globale.

    [Capture d’écran montrant la page affichant la valeur globale.]

Définition de valeurs pour les helpers

Une bonne utilisation du fichier _AppStart.cshtml consiste à définir des valeurs pour les helpers que vous utilisez dans votre site et qui doivent être initialisés. Par exemple, les paramètres d’e-mail pour l’assistance WebMail et les clés privées et publiques de l’assistance ReCaptcha . Dans de tels cas, vous pouvez définir les valeurs une fois dans le _AppStart.cshtml , puis elles sont déjà définies pour toutes les pages de votre site.

Cette procédure vous montre comment définir WebMail des paramètres globalement. (Pour plus d’informations sur l’utilisation de l’assistanceWebMail, consultez Ajout de Email à un site pages Web ASP.NET.)

  1. Ajoutez la bibliothèque ASP.NET Web Helpers à votre site web, comme décrit dans Installation d’assistances dans un site pages Web ASP.NET, si vous ne l’avez pas déjà ajoutée.

  2. Si vous n’avez pas encore de fichier _AppStart.cshtml , dans le dossier racine d’un site web, créez un fichier nommé _AppStart.cshtml.

  3. Ajoutez les paramètres suivants WebMail au fichier _AppStart.cshtml :

    @{
     // Initialize WebMail helper
     WebMail.SmtpServer = "your-SMTP-host";
     WebMail.SmtpPort = 25;
     WebMail.UserName = "your-user-name-here";
     WebMail.Password = "your-account-password";
     WebMail.From = "your-email-address-here";
}

    Modifiez les paramètres suivants liés à l’e-mail dans le code :

  4. Enregistrez le fichier _AppStart.cshtml et fermez-le.

  5. Dans le dossier racine d’un site web, créez une page nommée TestEmail.cshtml.

  6. Remplacez le contenu existant par ce qui suit :

    @{
    var message = "";
    try{
        if(IsPost){
            WebMail.Send(
                to: Request.Form["emailAddress"],
                subject: Request.Form["emailSubject"],
                body:Request.Form["emailBody"]
           );
           message = "Email sent!";
        }
    }
    catch(Exception ex){
        message = "Email could not be sent!";
    }
}
<!DOCTYPE html>
<html lang="en">
  <head>
     <meta charset="utf-8" />
     <title>Test Email</title>
  </head>
  <body>
    <h1>Test Email</h1>
    <form method="post">
      <p>
        <label for="emailAddress">Email address:</label>
        <input type="text" name="emailAddress" />
      </p>
      <p>
        <label for="emailSubject">Subject:</label>
        <input type="text" name="emailSubject" />
      </p>
      <p>
        <label for="emailBody">Text to send:</label><br/>
        <textarea name="emailBody" rows="6"></textarea>
      </p>
    <p><input type="submit" value="Send!" /></p>
    @if(IsPost){
        <p>@message</p>
    }
    </form>
  </body>
</html>

  7. Exécutez la page TestEmail.cshtml dans un navigateur.

  8. Renseignez les champs pour vous envoyer un e-mail, puis cliquez sur Envoyer.

  9. Vérifiez votre courrier électronique pour vous assurer que vous avez bien reçu le message.

La partie importante de cet exemple est que les paramètres que vous ne modifiez généralement pas, comme le nom de votre serveur SMTP et vos informations d’identification de messagerie, sont définis dans le fichier _AppStart.cshtml . De cette façon, vous n’avez pas besoin de les définir à nouveau dans chaque page où vous envoyez un e-mail. (Bien que si, pour une raison quelconque, vous devez modifier ces paramètres, vous pouvez les définir individuellement dans une page.) Dans la page, vous définissez uniquement les valeurs qui changent généralement à chaque fois, comme le destinataire et le corps du message électronique.

Exécution de fichiers avant et après l’exécution de code dans un dossier

Tout comme vous pouvez utiliser _AppStart.cshtml pour écrire du code avant l’exécution des pages du site, vous pouvez écrire du code qui s’exécute avant (et après) une page dans un dossier particulier. Cela est utile pour définir la même page de mise en page pour toutes les pages d’un dossier ou pour vérifier qu’un utilisateur est connecté avant d’exécuter une page dans le dossier.

Pour les pages de dossiers particuliers, vous pouvez créer du code dans un fichier nommé _PageStart.cshtml. Le diagramme suivant montre le fonctionnement de la page _PageStart.cshtml . Lorsqu’une demande est envoyée pour une page, ASP.NET recherche d’abord une page _AppStart.cshtml et l’exécute. Ensuite, ASP.NET vérifie s’il existe une page _PageStart.cshtml et, si c’est le cas, exécute cette page. Il exécute ensuite la page demandée.

Dans la page _PageStart.cshtml , vous pouvez spécifier où, pendant le traitement, vous souhaitez que la page demandée s’exécute en incluant une RunPage méthode . Cela vous permet d’exécuter du code avant l’exécution de la page demandée, puis de nouveau après celle-ci. Si vous n’incluez RunPagepas , tout le code dans _PageStart.cshtml s’exécute, puis la page demandée s’exécute automatiquement.

[Image montrant comment la page demandée s’exécutera automatiquement.]

ASP.NET vous permet de créer une hiérarchie de fichiers _PageStart.cshtml . Vous pouvez placer un fichier _PageStart.cshtml à la racine du site et dans n’importe quel sous-dossier. Lorsqu’une page est demandée, le fichier _PageStart.cshtml au niveau supérieur (le plus proche de la racine du site) s’exécute, suivi du fichier _PageStart.cshtml dans le sous-dossier suivant, et ainsi de suite de la structure du sous-dossier jusqu’à ce que la requête atteigne le dossier qui contient la page demandée. Une fois tous les fichiers _PageStart.cshtml applicables exécutés , la page demandée s’exécute.

Par exemple, vous pouvez avoir la combinaison suivante de fichiers _PageStart.cshtml et de fichier Default.cshtml :

@* ~/_PageStart.cshtml *@
@{
  PageData["Color1"] = "Red";
  PageData["Color2"] = "Blue";
}

@* ~/myfolder/_PageStart.cshtml *@
@{
  PageData["Color2"] = "Yellow";
  PageData["Color3"] = "Green";
}

@* ~/myfolder/default.cshtml *@
@PageData["Color1"]
<br/>
@PageData["Color2"]
<br/>
@PageData["Color3"]

Lorsque vous exécutez /myfolder/default.cshtml, les éléments suivants s’affichent :

Red

Yellow

Green

Exécution du code d’initialisation pour toutes les pages d’un dossier

Une bonne utilisation pour les fichiers _PageStart.cshtml consiste à initialiser la même page de disposition pour tous les fichiers d’un seul dossier.

  1. Dans le dossier racine, créez un dossier nommé InitPages.

  2. Dans le dossier InitPages de votre site web, créez un fichier nommé _PageStart.cshtml et remplacez le balisage et le code par défaut par les éléments suivants :

    @{
    // Sets the layout page for all pages in the folder.
    Layout = "~/Shared/_Layout1.cshtml";

    // Sets a variable available to all pages in the folder.
    PageData["MyBackground"] = "Yellow";
}

  3. À la racine du site web, créez un dossier nommé Shared.

  4. Dans le dossier Partagé , créez un fichier nommé _Layout1.cshtml et remplacez le balisage et le code par défaut par les éléments suivants :

    @{
  var backgroundColor = PageData["MyBackground"];
}
<!DOCTYPE html>
<html>
<head>
  <title>Page Title</title>
  <link type="text/css" href="/Styles/Site.css" rel="stylesheet" />
</head>
<body>
  <div id="header">
    Using the _PageStart.cshtml file
  </div>
  <div id="main" style="background-color:@backgroundColor">
    @RenderBody()
  </div>
<div id="footer">
  &copy; 2012 Contoso. All rights reserved
</div>
</body>
</html>

  5. Dans le dossier InitPages , créez un fichier nommé Content1.cshtml et remplacez le contenu existant par ce qui suit :

    <p>This is content page 1.</p>

  6. Dans le dossier InitPages , créez un autre fichier nommé Content2.cshtml et remplacez le balisage par défaut par ce qui suit :

    <p>This is content page 2.</p>

  7. Exécutez Content1.cshtml dans un navigateur.

    [Image montrant l’exécution de Content 1 point CSHTML dans un navigateur.]

    Lorsque la page Content1.cshtml s’exécute, le fichier _PageStart.cshtml définit Layout et définit PageData["MyBackground"] également une couleur. Dans Content1.cshtml, la disposition et la couleur sont appliquées.

  8. Afficher Content2.cshtml dans un navigateur.

    La disposition est identique, car les deux pages utilisent la même page de mise en page et la même couleur que celles initialisées dans _PageStart.cshtml.

Utilisation de _PageStart.cshtml pour gérer les erreurs

Une autre bonne utilisation du fichier _PageStart.cshtml consiste à créer un moyen de gérer les erreurs de programmation (exceptions) qui peuvent se produire dans n’importe quelle page .cshtml d’un dossier. Cet exemple vous montre une façon de procéder.

  1. Dans le dossier racine, créez un dossier nommé InitCatch.

  2. Dans le dossier InitCatch de votre site web, créez un fichier nommé _PageStart.cshtml et remplacez le balisage et le code existants par les éléments suivants :

    @{
    try
    {
        RunPage();
    }
    catch (Exception ex)
    {
        Response.Redirect("~/Error.cshtml?source=" +
            HttpUtility.UrlEncode(Request.AppRelativeCurrentExecutionFilePath));
    }
}

    Dans ce code, vous essayez d’exécuter explicitement la page demandée en appelant la RunPage méthode à l’intérieur d’un try bloc. Si des erreurs de programmation se produisent dans la page demandée, le code à l’intérieur du bloc s’exécute catch . Dans ce cas, le code redirige vers une page (Error.cshtml) et transmet le nom du fichier qui a rencontré l’erreur dans le cadre de l’URL. (Vous allez créer la page sous peu.)

  3. Dans le dossier InitCatch de votre site web, créez un fichier nommé Exception.cshtml et remplacez le balisage et le code existants par les éléments suivants :

    @{
    var db = Database.Open("invalidDatabaseFile");
}

    Pour les besoins de cet exemple, ce que vous faites dans cette page est de créer délibérément une erreur en essayant d’ouvrir un fichier de base de données qui n’existe pas.

  4. Dans le dossier racine, créez un fichier nommé Error.cshtml et remplacez le balisage et le code existants par les éléments suivants :

    <!DOCTYPE html>
<html>
    <head>
        <title>Error Page</title>
    </head>
    <body>
<h1>Error report</h1>
<p>An error occurred while running the following file: @Request["source"]</p>
    </body>
</html>

    Dans cette page, l’expression @Request["source"] obtient la valeur de l’URL et l’affiche.

  5. Dans la barre d’outils, cliquez sur Enregistrer.

  6. Exécutez Exception.cshtml dans un navigateur.

    [Capture d’écran montrant l’exécution du point d’exception CSHTML dans un navigateur.]

    Étant donné qu’une erreur se produit dans Exception.cshtml, la page _PageStart.cshtml redirige vers le fichier Error.cshtml , qui affiche le message.

    Pour plus d’informations sur les exceptions, consultez Présentation de la programmation pages Web ASP.NET à l’aide de la syntaxe Razor.

Utilisation de _PageStart.cshtml pour restreindre l’accès aux dossiers

Vous pouvez également utiliser le fichier _PageStart.cshtml pour restreindre l’accès à tous les fichiers d’un dossier.

  1. Dans WebMatrix, créez un site web à l’aide de l’option Site à partir du modèle .

  2. Dans les modèles disponibles, sélectionnez Site de démarrage.

  3. Dans le dossier racine, créez un dossier nommé AuthenticatedContent.

  4. Dans le dossier AuthenticatedContent , créez un fichier nommé _PageStart.cshtml et remplacez le balisage et le code existants par les éléments suivants :

    @{
    Response.CacheControl = "no-cache";
    if (!WebSecurity.IsAuthenticated) {
        var returnUrl = "~/Account/Login?ReturnUrl=" + Request.Url.LocalPath;
        Response.Redirect(returnUrl);
    }
}

    Le code commence par empêcher tous les fichiers du dossier d’être mis en cache. (Cela est obligatoire pour les scénarios tels que les ordinateurs publics, où vous ne souhaitez pas que les pages mises en cache d’un utilisateur soient disponibles pour l’utilisateur suivant.) Ensuite, le code détermine si l’utilisateur s’est connecté au site avant de pouvoir afficher l’une des pages du dossier. Si l’utilisateur n’est pas connecté, le code redirige vers la page de connexion. La page de connexion peut renvoyer l’utilisateur à la page qui a été demandée à l’origine si vous incluez une valeur de chaîne de requête nommée ReturnUrl.

  5. Créez une page dans le dossier AuthenticatedContent nommé Page.cshtml.

  6. Remplacez le balisage par défaut par les éléments suivants :

    @{
    Layout = "~/_SiteLayout.cshtml";
    Page.Title = "Authenticated Content";
}
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
  </head>
  <body>
    Thank you for authenticating!
  </body>
</html>

  7. Exécutez Page.cshtml dans un navigateur. Le code vous redirige vers une page de connexion. Vous devez vous inscrire avant de vous connecter. Une fois que vous vous êtes inscrit et connecté, vous pouvez accéder à la page et afficher son contenu.

Ressources supplémentaires

Présentation de la programmation pages Web ASP.NET à l’aide de la syntaxe Razor