Remerciez-le!

Remerciez @Admin pour avoir partagé cet document gratuitement, de la manière la plus simple, en partageant sur les réseaux sociaux.

T u t o r i e l 9 . 1 – C r é a t i o n d ’ u n e a p p l i c a t i o n A S P .

T u t o r i e l 9 . 1 – C r é a t i o n d ’ u n e a p p l i c a t i o n A S P . N E T s é c u r i s é e 23. février 2014 Amine ASP.NET, Database, Security, SQL Server (0) L’objectif de ce tutoriel (appliquant le module 9) est d’apprendre à utiliser les fournisseurs SQL fournis par ASP.NET pour la mise en place d’une application sécurisée. E t a p e 1 : C r é a t i o n d e l a b a s e d e d o n n é e s L’objectif de cette étape est de créer la base de données ASPNETDB permettant de réutiliser une base de données dans les tâches quotidiennes d’administration sans avoir à réécrire les fournisseurs.  Lancez l’explorateur de Windows  Allez jusqu’au dossier d’installation du .NET Framework qui est dans le dossier d’installation de Windows  Localisez la dernière version du .NET Framework  Ouvrez le répertoire de la dernière version  Localisez le programme « aspnet_regsql » et lancez-le, un assistant apparaît  Cliquez sur « Suivant »  Cochez « Configurer SQL Server pour les services d’application »  Cliquez sur « suivant »  Entrez le nom du serveur SQL dans lequel sera installée la base  Dans « Base de données », laissez « par défaut » s s  Cliquez sur « Suivant » deux fois  L’assistant devrait s’exécuter sans problèmes  Ouvrez SQL Server Management Studio  Remarquez la présence d’une nouvelle base de données appelée « aspnetdb » E t a p e 2 : P r é p a r a t i o n d e l ’ A p p l i c a t i o n Le but de cette étape est de préparer le cadre de l’application. L’application sera composée de quatre pages : accueil, login et deux autres pages localisées dans deux répertoires : « Secure » et « Admin » où « Admin » est un sous-répertoire de « Admin ». Les règles sont les suivantes : tous les utilisateurs connectés accèderont au contenu du répertoire « Secure » tandis que le répertoire « Admin » ne pourra être accédé que par les utilisateurs appartenant au rôle « Admin ». Le site sera structuré comme suit : un menu en haut contenant les liens des différents sites et un pied en bas contenant le nom de l’utilisateur en cours et un lien pour se connecter / déconnecter.  Ouvrez VS 2012  Créez une nouvelle applications ASP.NET vide appelée « TestComptes »  Dans le projet, créez un répertoire appelé « Secure »  Dans le répertoire «Secure », créez un sous-répertoire appelé « Admin »  Ajoutez une page maître et nommez-la « Main.master »  Ouvrez « Main.master » en mode source  Dans l’attribut classe de la div, entrez « content »  Ajoutez une balise « header » avant la « div »  Ajoutez une balise « footer » dans la div  Ajoutez une balise « ul » dans « header » et une autre balise « ul » dans footer  Ajoutez trois éléments « li » dans la première « ul » et deux balises « li » dans la deuxième « ul »  Ouvrez « Main.master » en mode design  Glissez un composant « HyperLink » dans chacun des éléments de la liste  Dans la deuxième liste « ul », glissez un composant « LoginName » dans la première « li »  Dans la deuxième liste « ul », glissez un composant « LoginStatus » dans la deuxième « li »  Dans le répertoire racine Créez une forme web avec page maître « Main » appelée « Default.aspx »  Dans le répertoire racine, créez une forme web avec page maître « Main » appelée « Login.aspx »  Dans le répertoire « Secure », ajoutez une forme web avec page maître « Main » appelée « Page1.aspx »  Dans le répertoire « Admin », ajoutez une forme web avec page maître « Main » appelée page2  Tapez le texte « Accueil », « Page1 » et « Page2 » dans les pages « Default.aspx », « Page1.aspx » et « Page2.aspx » respectivement  Ouvrez « Main.master » en mode design  Pointez les trois liens sur les pages « default.aspx », « page1.aspx » et « page2.aspx » respectivement. Le code de « Main.master » devra être comme suit : <form id="form1" runat="server"> <header> <ul> <li> <asp:HyperLink ID="HyperLink1" runat="server" NavigateUrl="~/Default.aspx">Accueil</asp:HyperLink> </li> <li> <asp:HyperLink ID="HyperLink2" runat="server" NavigateUrl="~/Secure/Page1.aspx">Page 1</asp:HyperLink> </li> <li> <asp:HyperLink ID="HyperLink3" runat="server" NavigateUrl="~/Secure/Admin/Page2.aspx">Page2</asp:HyperLink> </li> </ul> </header> <div class="content"> <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server"> </asp:ContentPlaceHolder> </div> <footer> <ul> <li> <asp:LoginName ID="LoginName1" runat="server" /> </li> <li> <asp:LoginStatus ID="LoginStatus1" runat="server" /> </li> </ul> </footer> </form>  Ouvrez la page « Login.aspx » en mode design  Glissez un composant « Login » sur la page  Ajoutez une feuille de style appelée « Site.css »  Collez dedans le code CSS suivant : body, form { font-family: 'T rebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif; margin: 0; padding: 0; } header { border-width: 7px; border-color: #F3C972; background-color: #6CB6FF; border-bottom-style: solid; margin: 0; padding: 1em 1em 0em 1em; } header ul, footer ul { margin: 0; padding: 0; list-style: none; } header ul li, footer ul li { display: inline-block; margin-right: 1em; padding: 0.5em; } header ul li:hover { background-color: #F3C972; } header a { color: black; text-decoration: none; } div.content { min-height: 400px; }  Ouvrez « Main.master » en mode design  Glissez « Site.css » sur la page pour appliquer le style  Ouvrez la console de gestion des paquets « Nuget »  En utilisant l’instruction « Install-Package », installez les paquets « JQuery » puis « AspNet.ScriptManager.JQuery »  Exécutez en appuyant sur « F5 » pour voir la structure du site E t a p e 3 : C o n fi g u r a t i o n Le but de cette étape est de configurer l’application de façon à ce qu’elle se base sur la base « aspnetdb » pour l’authentification et l’autorisation  Ouvrez le fichier web.config  Dans la section « configuration », ajoutez une chaîne de connexion pointant sur la base de données « aspnetdb », celle qui est en dessous est un exemple <connectionStrings> <add name="comptesDB" connectionString="Data Source=.;Initial Catalog=aspnetdb;Integrated Security=SSPI;" /> </connectionStrings>  On va configurer l’application de façon à ce qu’elle prenne le mécanisme « Forms » pour l’authentification. Dès que l’application demande à l’utilisateur de s’authentifier, elle le redirige vers la page « Login.aspx »  Dans la section « system.web », ajoutez une section « authentifcation » comme suit : <authentication mode="Forms" > <forms loginUrl="~/Login.aspx"> </forms> </authentication>  On va configurer l’application de façon à ce qu’elle utilise le fournisseur SQL pour identifier et valider les utilisateurs.  Dans la section « system.web », ajoutez une section « membership » comme suit : <membership defaultProvider="SqlProvider" userIsOnlineTimeWindow="15"> <providers> <clear /> <add name="SqlProvider" type="System.Web.Security.SqlMembershipProvider" connectionStringName="comptesDB" applicationName="T estComptes" enablePasswordRetrieval="false" enablePasswordReset="true" requiresQuestionAndAnswer="true" requiresUniqueEmail="true" passwordFormat="Hashed" /> </providers> </membership>  On va maintenant, configurer l’application de façon à ce qu’elle en prenne en charge les rôles  Dans la section « system.web », ajoutez une section « roleManager » comme suit : <roleManager enabled="true" defaultProvider="roleProvider" > <providers> <clear/> <add name="roleProvider" type="System.Web.Security.SqlRoleProvider" connectionStringName="comptesDB" applicationName="T estComptes" /> </providers> </roleManager> E t a p e 4 : C r é a t i o n d e s u t i l i s a t e u r s e t d e s r ô l e s Le but de cette étape est d’utiliser l’outil de configuration ASP.NET pour créer les utilisateurs et les rôles. Nous créerons deux utilisateurs « simple » et « admin ». Les deux appartiennent au rôle « simple » tandis que le rôle « admin » n’inclut que l’utilisateur « admin ».  Dans le menu « projet », cliquez sur « Configuration ASP.NET »  L’application suivante apparaît  Cliquez sur « Sécurité »  Cliquez sur « Créer un utilisateur »  Ajoutez l’utilisateur « simple », mot de passe : « simple$$ », confirmation : « simple$ $ », adresse : « simple@hotmail.com », question : « question » et réponse : « réponse ».  Ajoutez un autre utilisateur « admin », mot de passe : « admin$$ », confirmation : « admin$$ », adresse : « admin@hotmail.com », question : « question », réponse : « réponse »  Cliquez sur l’onglet « Sécurit »  Cliquez sur « Ajouter ou gérer les rôles »  Ajoutez un rôle « simple » puis le rôle « admin »  A droite du rôle « admin », cliquez sur le lien « gérer uploads/s1/ creation-d-x27-une-application-asp.pdf