You are on page 1of 12

Building Secure Applications With Membership and Role Management Using Microsoft Visual Studio 2005 and ASP.NET 2.0

Table of Contents

Building Secure Applications With Membership and Role Management Using Microsoft Visual Studio 2005 and ASP.NET 2.0 .........................................................................................

1

Exercise 1 Add a Login Page.........................................................................................................................................2 Exercise 2 Apply Authentication and Authorization Settings

4

Exercise 3 Add Navigation Links to the Master Page

6

Exercise 4 Enable Role-based Security

9

Building Secure Applications With Membership and Role Management Using Microsoft Visual Studio 2005 and ASP.NET 2.0

Building Secure Applications With Membership and Role Management Using Microsoft Visual Studio 2005 and ASP.NET

2.0

After completing this lab, you will be better able to:

Objectives

Scenario

Add a login page

Apply authentication and authorization settings

Add navigation links to the master page

Enable role-based security

Forms authentication is a popular means of securing Internet applications. In ASP.NET’s brand of forms authentication, you designate a login page for logging in unauthenticated users and use URL directives to specify which pages require logins and which ones do not. When an anonymous (that is, unauthenticated) user attempts to access a page that’s only available to authenticated users, ASP.NET automatically redirects them to the login page.

ASP.NET 1.x simplified forms authentication by introducing declarative means for designating login pages and specifying authorization rules. ASP.NET 2.0 further simplifies forms authentication by providing the following facilities:

A membership service for managing users and user credentials

Login controls for logging in users, creating new users, and more

A role management service for enacting role-based security

In this lab, you’ll use all three to build a secure administrative interface for the MyComics application. You’ll begin by creating a login page. Then you’ll secure the admin page had been created in a previous lab so that only authenticated users can access it, and add links to the master page for navigating to the admin page and logging in. Finally, you’ll use role-based security to tighten permissions on the admin page so that only administrators can access it.

Estimated Time to Complete This Lab

60 Minutes

Page 1 of 10

Building Secure Applications With Membership and Role Management Using Microsoft Visual Studio 2005 and ASP.NET 2.0

Exercise 1 Add a Login Page

Scenario

In this exercise, you’ll create a login page that includes a Login control for logging in existing users.

Tasks

Detailed Steps

 
  • 1. Start the lab

 
  • a. Click Start | Run.

  • b. In the Open textbox, type cmd, and then click OK.

  • c. At the command line prompt, type C:\HOL\Web\LabFiles\Database\CacheSetup.cmd and then press ENTER.

  • d. Once the file finishes running and you see the command prompt again, type Exit and press ENTER.

 
  • 2. Open the Web site

 
  • a. Click Start | All Programs | Microsoft Visual Studio 2005 Beta 2 | Microsoft Visual Studio 2005 Beta 2 to launch Microsoft Visual

 

Studio.2005.

  • b. Click File | Open | Web Site.

  • c. You may do this lab using either the C# or Visual Basic. If you wish to work in C#, in the Open Web Site dialog, expand the CS folder, and then under the CS folder, select the Lab4 folder, and click Open.

  • d. If you wish to work in Visual Basic, in the Open Web Site dialog, make sure the VB folder is expanded, and then under the VB folder, select the Lab4 folder, and click Open.

  • 3. Add a page to the

 
  • a. In the Solution Explorer window, right-click C:\

\Lab4

and select Add

Web site

New Item.

  • b. In the Add New Item dialog, in the Templates list, select Web Form.

 
  • c. In the Name box, type Login.aspx.

  • d. If the Language dialog does not show the language you selected at the beginning of the exercise, click the Language dropdown and select that language.

 
  • e. Check the Place code in separate file checkbox.

  • f. Check the Select master page checkbox.

  • g. Click Add.

  • h. In the Select a Master Page dialog, select Site.master and click OK.

 
  • i. The new Web form will open in the source view. Find the following text on the first line of the source view:

Title="Untitled Page"

  • j. Highlight the text and in its place type

Title="MyComics Login"

 
  • k. Place the cursor at the beginning of the following line of text:

 

</asp:Content>

 

Page 2 of 10

Building Secure Applications With Membership and Role Management Using Microsoft Visual Studio 2005 and ASP.NET 2.0

Tasks

 

Detailed Steps

 
   
  • l. Press ENTER to create a new blank link and place the cursor on that line.

  • m. Click Design to switch to the design view. Click in the empty portion of the Content control to start adding content.

  • n. Click the Layout menu and select Insert Table.

  • o. In the Insert Table dialog, select the Template radio button.

  • p. Click the Template dropdown and select Vertical split.

  • q. Click OK.

  • r. In the table you just added to the Content control, right-click the left table cell and select Insert | Cell to the Right.

  • s. Click inside the cell you just added (the center cell) to select it.

  • t. Click Properties to open the Properties window.

  • u. In the Properties window, click the Width field and type 1.

  • v. Click the BgColor field and type gray.

  • w. In the Content control, in the table, click the leftmost cell to select it.

  • x. Click Properties to open the Properties window.

  • y. In the Properties window, click the Width field and type 50%.

  • z. Click the VAlign field and from the dropdown menu select Top.

aa. In the Content control, in the table, click the rightmost cell to select it. bb. In the Properties window, click the VAlign field and from the dropdown menu select Top.

4.

Add a Login control

 
  • a. Click the Toolbox to expand it.

 
  • b. In the Toolbox window, if the Login section is not expanded, click Login to expand that section.

  • c. In the Login section, click and drag a Login control into the leftmost table cell.

  • d. Click the Debug menu and select Start Without Debugging.

Examine the Web page you just created. If you want to polish its appearance, use the Auto Format command in the CreateUserWizard Tasks menu.

 
  • e. Click File | Close to close the Web browser.

Page 3 of 10

Building Secure Applications With Membership and Role Management Using Microsoft Visual Studio 2005 and ASP.NET 2.0

Exercise 2 Apply Authentication and Authorization Settings

Scenario

In this exercise, you’ll turn on forms authentication and configure the admin page so that it’s accessible only to authenticated users. You’ll also configure the application to use ASP.NET’s SQL Server membership provider and create a database for the provider to use.

Tasks

 

Detailed Steps

 
  • 1. Move the admin

 
  • a. In the Solution Explorer window, right-click C:\

\Lab4

and select Add

page

Folder | Regular Folder.

  • b. Type Secure and press ENTER to rename the new folder.

 
  • c. Click and drag Admin.aspx over the Secure folder and drop it to move it into the Secure folder.

 
  • 2. Run the Security

 
  • a. Click the Website menu and select ASP.NET Configuration.

 

Setup Wizard

  • b. Click the Security link.

  • c. Click Use the security Setup Wizard to configure security step by step.

 
  • d. Once the wizard loads, click Next.

  • e. Select the From the internet radio button and click Next.

 
  • f. Click Next twice.

  • g. In the User Name textbox, type joe.

  • h. In the Password textbox, type P@ssw0rd.

  • i. In the Confirm Password textbox, type P@ssw0rd.

 
  • j. In the E-mail textbox, type joe@contoso.com.

  • k. In the Security Question textbox, type What is your pet's name.

 
  • l. In the Security Answer textbox, type fido.

  • m. Click Create User.

  • n. Click Next.

  • o. Click the plus (+) sign to expand the Lab4 folder.

  • p. Click the Secure folder to select it.

  • q. Click the Anonymous User radio button. Notice that the Deny radio button is already selected.

 
  • r. Click Add this rule.

  • s. Click Next.

  • t. Click Finish.

  • u. Minimize the Web browser.

  • v. In Microsoft Visual Studio, in the Solution Explorer, double-click Web.Config.

 

Can you identify the changes that were made when you ran the Security Setup Wizard?

  • w. In the Solution Explorer, right-click the Secure folder and select Add Existing Item.

  • x. In the Add Existing Item dialog, double-click Secure.

 

Page 4 of 10

Building Secure Applications With Membership and Role Management Using Microsoft Visual Studio 2005 and ASP.NET 2.0

Tasks Detailed Steps y. Click web.config and then click Add. Even though it didn't appear in
Tasks
Detailed Steps
y.
Click web.config and then click Add.
Even though it didn't appear in the Solution Explorer window, a new Web.config file
was added to the Web site by the Security Setup Wizard. That file is in the Secure
folder, and it contains authorization rules for the Secure director.
z.
In the Solution Explorer under the Secure folder, double-click Web.config.
Examine the <authorization> element. How does this element relate back to the
authorization rule you created in the Security Setup Wizard that denies anonymous
users access to resources in the Secure folder?
aa. If you chose to do the lab in C#, right click C:\
Folder | App_Data Folder.
\Lab4\
and then click Add
bb. In the Solution Explorer, right-click the App_Data folder and select Add
Existing Item.
cc. In the Add Existing Item dialog, in the toolbar, click the Up One Level
button (a folder with a green up arrow on it) and then double-click the
App_Data folder.
dd. Click ASPNETDB.MDF and then click Add.
ee. In the Solution Explorer, right click on ASPNET.MDF database and select
Open. The Server Explorer window will automatically open with the
ASPNETDB.MDF database selected.
ff. In the Server Explorer window, expand Tables.
gg. Right-click the aspnet_Users table and select Show Table Data. Notice that
the database table opens in Visual Studio.
Do you see the user you added? By creating a user through the Web Admin you
created a SQL Server Express database contained within your application.
3.
Test the security
settings
a.
In the Solution Explorer window, select Default.aspx.
b.
Click the Debug menu and select Start Without Debugging. Default.aspx
will open in the Web browser.
a.
Highlight the text in the Address bar, and then type http://localhost:<your
port>/Lab4/secure/admin.aspx and then press ENTER. Be sure to leave the
port name the same.
b.
The login page will appear. In the User Name textbox, type joe.
c.
In the Password textbox, type P@ssw0rd.
d.
Click Log In.
e.
Click the Back button twice.
f.
Highlight the text in the Address bar, and then type http://localhost: <your
port>/Lab4/secure/admin.aspx and then press ENTER. This time you are
directed to the Admin page, because you are already logged in.
g.
Click File | Close to close the Web browser.

Page 5 of 10

Building Secure Applications With Membership and Role Management Using Microsoft Visual Studio 2005 and ASP.NET 2.0

Exercise 3 Add Navigation Links to the Master Page

Scenario

In this exercise, you’ll add links to the master page for navigating to Admin.aspx and for logging in and out. The former link will be a conventional HyperLink control, the latter a LoginStatus control. You’ll also add a public method to the master page enabling the login page to hide these links.

Tasks Detailed Steps 1. Add links to the master page a. In Microsoft Visual Studio, in
Tasks
Detailed Steps
1.
Add links to the
master page
a.
In Microsoft Visual Studio, in the Solution Explorer, double-click
Site.master. The Site.master file will open in Visual Studio in source view.
b.
Look for the following text and highlight it:
<asp:HyperLink ID="HyperLink1"
ImageUrl="~/Images/MyComics.gif"
NavigateUrl="~/Default.aspx"
Runat="server">Hyperlink</asp:HyperLink>
c.
Type the following text to replace the text highlighted above: (this text can
also be found in the file C:\HOL\Web\LabFiles\lab4.txt)
<table width="100%" cellpadding="0" cellspacing="0">
<tr>
<td>
<asp:HyperLink ID="HyperLink1"
ImageUrl="~/Images/MyComics.gif"
NavigateUrl="~/Default.aspx" Runat="server" />
</td>
<td align="right" valign="top">
<asp:Panel ID="LinksPanel" Runat="server">
<asp:HyperLink ID="AdminLink" Text="Admin"
NavigateUrl="~/Secure/Admin.aspx" Runat="server"
ForeColor="White"
Font-Names="Verdana" Font-Size="10pt"
EnableTheming="False"
Style="text-decoration: none" />
<span style="font-size: 10pt; color: white; font-family:
Verdana">|</span>
<asp:LoginStatus ID="LoginStatusControl" Runat="server"
ForeColor="White"
Font-Names="Verdana" Font-Size="10pt"
EnableTheming="False"
Style="text-decoration: none" />
<span style="font-size: 10pt; color: white; font-family:
Verdana">
&nbsp;
</span>
</asp:Panel>
</td>
</tr>
</table>
This HTML code replaces the original image hyperlink with a hyperlink and a

Page 6 of 10

Building Secure Applications With Membership and Role Management Using Microsoft Visual Studio 2005 and ASP.NET 2.0

Tasks
Tasks
Tasks 2. Hide the links on the login page Detailed Steps LoginStatus control embedded in a
Tasks 2. Hide the links on the login page Detailed Steps LoginStatus control embedded in a
  • 2. Hide the links on the login page

Detailed Steps
Detailed Steps

LoginStatus control embedded in a table. The new controls are in their own cells, so you can position them in the upper right-hand corner of the page banner. The controls are encapsulated in a Panel control so that you can show and hide them later by toggling the Panel's Visible property.

You could also have done this using the Design view. We added the controls this way in order to make the process easier and quicker. Visual Studio fully supports hand- written HTML.

  • f. Click one of the GridView’s Select buttons and verify that you see the details for the item you selected.

  • g. Notice that the Admin and Login links appear in the upper right-hand corner of the page. Clicking either link will take you to the Login page because you are not currently logged in.

  • e. Click the Debug menu and select Start Without Debugging.

  • d. In the Solution Explorer window, select Default.aspx.

  • h. Click File | Close to close the Web browser.

  • b. Double-click the code behind file under Site.master. If you are working Visual Basic, this file will be named Site.master.vb. If you are working in C#, this file will be named Site.master.cs.

  • c. If you are working in Visual Basic, find the line that read Inherits System.Web.UI.MasterPage. Place the cursor at the end of the line and press ENTER to create a new blank line.

public void HideBannerLinks () { LinksPanel.Visible = false; }

Public Sub HideBannerLinks() LinksPanel.Visible = False End Sub

((Site) Master).HideBannerLinks ();

 

CType(Master, Site).HideBannerLinks()

 
  • g. In the Design view, double-click an empty portion of the page outside of the Content control.

  • d. If you are working in C#, find the following text: public parital class Site : System.Web.UI.MasterPage {. Place the cursor after the { and press ENTER to create a new blank line.

  • h. This will open the code behind file for this page and automatically create a Page_Load method.

  • a. In Microsoft Visual Studio, in the Solution Explorer, expand the Site.master by clicking the plus (+) sign next to it.

  • j. In the Solution Explorer window, select Default.aspx.

  • f. In the Solution Explorer, double-click Login.aspx.

  • e. On the new blank line type:

  • i. Type the following text:

VB

VB

C#

C#

Page 7 of 10

Building Secure Applications With Membership and Role Management Using Microsoft Visual Studio 2005 and ASP.NET 2.0

Tasks

 

Detailed Steps

 
   
  • k. Click the Debug menu and select Start Without Debugging.

  • l. In the upper right-hand corner of the page, click Admin.

  • m. When the Login page appears, notice that the Admin and Login links do not appear.

  • n. In the User Name textbox, type joe.

  • o. In the Password textbox type P@ssw0rd.

  • p. Click Log In. Notice that the Logout link appears in the upper right-hand corner of the page instead of the Log In link.

3.

Change the logout

 
  • a. In Admin.aspx, click the Logout button in the upper-right corner.

action

What happens?

 
 
  • b. Click File | Close to close the Web browser.

Rather than return to the login page after clicking Logout, you might prefer to return to the home page (Default.aspx). We will make that change now.

 
  • c. In Microsoft Visual Studio, in the Solution Explorer, double-click Site.master.

  • d. Click the Design button to switch to Design view.

  • e. Click to select the LoginStatus control (the Login link).

  • f. Click Properties to open the Properties window.

  • g. Click the LogoutAction field and from the dropdown menu select Redirect.

  • h. Click the LogoutPageUrl field and type ~/Default.aspx.

  • i. In the Solution Explorer window, select Default.aspx.

  • j. Click the Debug menu and select Start Without Debugging.

  • k. In the upper right-hand corner of the page, click Admin.

  • l. When the Login page appears, notice that the Admin and Login links do not appear.

  • m. In the User Name textbox, type joe.

  • n. In the Password textbox type P@ssw0rd.

  • o. Click Log In.

  • p. Click the MyComics logo. Notice that you are redirected to Default.aspx.

  • q. Click the Admin link.

  • r. Click the Logout link. Notice that you are redirected to Default.aspx.

  • s. Verify that you go back to Default.aspx and that the LoginStatus control reads Login rather than Logout

  • t. Click File | Close to close the Web browser.

Page 8 of 10

Building Secure Applications With Membership and Role Management Using Microsoft Visual Studio 2005 and ASP.NET 2.0

Exercise 4 Enable Role-based Security

Scenario

In this exercise, you’ll enable ASP.NET’s role manager and configure it to use the SQL Server provider. You’ll also create an account named Administrator and a group named Administrators. You will assign the Administrator account to the Administrators group. Then you’ll modify the site’s security settings so that only Administrators can view Admin.aspx.

Tasks

 

Detailed Steps

 
  • 1. Enable the ASP.NET role manager

 
  • a. In Microsoft Visual Studio, click the Website menu and select ASP.NET Configuration.

  • b. Click the Security tab.

  • c. Click Enable Roles.

  • d. Minimize the Web browser.

  • e. If a dialog box appears, click Yes.

  • f. In Microsoft Visual Studio, in the Solution Explorer, double-click Web.config.

Can you spot the changes you just made?

 
  • 2. Create an

 
  • a. Maximize the Web browser.

Administrators group

  • b. In the APS.NET Web Site Administration Tool, click Create or Manage roles.

  • c. In the New role name textbox, type Administrators

  • d. Click the Add Role button.

  • e. In the lower right-hand corner of the page, click Back.

  • 3. Create an

 
  • a. Click Create user.

Administrator

  • b. In the User Name textbox, type administrator.

account

  • c. In the Password textbox, type P@ssw0rd.

  • d. In the Confirm Password textbox, type P@ssw0rd.

  • e. In the E-mail textbox, type administrator@Contoso.com.

  • f. In the Security Question textbox, type What is your cat's name?

  • g. In the Security Answer textbox, type Ilsa.

  • h. Check the Administrator checkbox.

  • i. Click Create User.

  • j. Click Continue

  • k. In the lower right-hand corner of the page, click Back.

  • 4. Make Admin.aspx

 
  • a. Click Manage access rules.

off limits to non-

  • b. Click the Secure folder to select it.

administrators

  • c. Click the Delete link to delete the Deny rule.

  • d. Click Yes.

  • e. Click Add new access rule.

  • f. Select the Allow radio button.

Page 9 of 10

Building Secure Applications With Membership and Role Management Using Microsoft Visual Studio 2005 and ASP.NET 2.0

Tasks

 

Detailed Steps

 
   
  • g. Click OK.

  • h. Click Add new access rule.

  • i. Select the All users radio button.

  • j. Click OK

You have just created rules that allow Administrators access to the Secure folder, but deny access to all other users.

 
  • k. Click Done.

  • l. Minimize the Web browser.

  • m. If you see a dialog box appear, click Yes.

  • n. In Microsoft Visual Studio in the Solution Explorer, double-click Web.config

Can you see the changes that you just made reflected in the Web.config?

 
  • o. In the Solution Explorer window, select Default.aspx.

  • p. Click the Debug menu and select Start Without Debugging.

  • q. Click the Admin link.

  • r. In the User Name textbox, type joe.

  • s. In the Password textbox, type P@ssw0rd.

  • t. Click Log In.

What happens?

 
  • u. In the User Name textbox, type Administrator.

  • v. In the Password textbox, type P@ssw0rd.

  • w. Click Log In. Notice that you can view the Admin page.

  • x. Click File | Close to close the Web browser.

Summary

Here’s a recap of what you learned in this lab:

How to build a login page around Login control

How to use the Web Site Administration Tool to select membership and role providers

How to use the Web Site Administration Tool to enable forms authentication and apply basic security settings

How to programmatically converse with a master page from a content page

How to use LoginStatus controls to display links for logging in and out

How to change the logout action of a LoginStatus control

How to enable the ASP.NET role management service

How to create roles and assign users to roles

How to create role-based access rules for your Web site

Take a moment to review the application in its current form. As you do, here are some questions to ponder:

Did securing the admin page require a significant amount of code?

If you wanted to modify the master page to show login names for authenticated users, how would you go about it? What control would you use to display login names?

If you decided to move the ASP.NET database to a remote server, how would you go about it? Would any code changes be required?

Page 10 of 10