Introduction

---

The ASP.NET login controls are a very good way to secure your website without the need of any programming. The login controls integrate with ASP.NET membership and forms authentication to help automate user authentication for a Web site. It provides you with a ready-to-use user interface that queries the user name and password from the user and offers a Log In button for login.  The login controls also validate user credentials against the membership API and encapsulate the basic forms authentication functionality like redirecting the user to a requested page in a restricted area of you application after a successful login.

The Login control provides a user interface that contains TextBoxes for user name and password entry along with a check box allowing the user to store their identity on the server using ASP.NET membership. By selecting this option, once identified the user will automatically be authenticated with each subsequent visit to the site.

The Login control has facilities to allow you to custom the display and messages. It also allows you to provide links to other pages where a user can change or recover their password. The control can be used as a stand-alone control on a main page or can be used on a dedicated login page.

If the Login control is used with ASP.NET membership, their is no need to write code to perform authentication. If you want to create your own authentication logic, you can handle the Login control's Authenticate event and create custom authentication code.

Using A Login Control

 

---

 

The first thing we want to do is to create a new WebForm to hold our login control. To do this right click on the project and select add then "New Item". From the Add New Item dialog box select Web Form. I will call mine login.aspx:

The next step is to add a login control to the new page. Open the page in design mode the from the tool box go to the login category and select the login control:

Drag it on to the login page. It should look something like this:

Whenever a user hits the Log In button, the control automatically validates the user name and password using the membership API function ValidateUse(). This in turn calls FormAuthentication.redirectFromLoginPage() if the validation was successful. Depending on the options selected on the LoginControl the values passed to these methods will be different. For Example, if you click the "Remember me next time" check box, a value of true is passed to the createPresistentCookie parameter of the RedirectFromLoginPage() method. Therefore, the FormAuthenticateModule creates a persistent cookie.

Administer Web Site

 

---

By selecting the arrow button in the top right of the control you can AutoFormat the control. This works just like the GridView format where it gives you several pre created styles to choose from. You can also choose convert to template which gives you control over how to style the control.

 

At this time we are interested in Administer web site. When you select this it will open a web page that looks like this:

Pressing the continue button will take you back to the new account creation screen.

By selecting the Security link you can add new users to your web site:

At this point you can select create user to create a new user. This will bring up the sign up for a new user account:

I am going to create an account with the following:

User Name: public

Password: password123

And the selct the "Create User"  button. This will give you the account created successfully screen:

This will take you back to the create use main screen. You can at this point create more user accounts if you wish. The other thing is that you can go back to the home screen and create roles for the user. Since this is a simple web site there isn't much need for it. So, at this point I think we should see if we can get the login screen to work.

Web.config Modifications

---

 

In order to get this to work you have to make modifications to your web.config. The first thing you need to do is make sure that your application is using forms authentication. The second thing is that you need to setup an authorization section to deny users. You should have entries in your web.config that look like this:

 

You have three choices for deny users.

1. A comma separated list of users you want to deny
2. * - All users are denied.
3. ? - Anonymous users are denied

Since this is a web page the access from the Internet is from the anonymous account. In most cases you are simply going use the ? to restrict the anonymous account from accessing restricted areas.

Important Points

 

---

 

1. One thing that hasn't been discussed is how to setup where the page is redirected to when the user is authenticated. You can specify this in the DestinationPageUrl property of the login control. In this case I want the login to redirect to default.aspx:

2. The second thing is that the login control is going to act on whatever folder you put it in. In this example I put it into the root folder of the web page. When every you navigate to web site the login page is going to show up.

Try It Out

---

Select the image below to see the Login control running

 

Introduction

---

 

The CreateUserWizard control provides the user interface for the MembershipProvider object that communicates with your Web site's user data store to create new user accounts in the data store. The CreateUserWizard relies on the MembershipProvider to create the user and disable them if necessary.

CreateUseWizardSteps -

• CreateUserWizardStep: Pre-defined wizard step with the create user display and logic added. 
• CompleteWizardStep: Pre-defined wizard step that shows the successful completion of the wizard. 
• Collection of WizardSteps: Each WizardStep contains a discrete piece of content to be displayed to the user. Only one WizardStep will be displayed at a time. 
• Navigation Buttons: The navigation area below each WizardStep that contains the navigation buttons to go the next and pervious steps in the CreateUserWizard. 
• SideBar: An optional element that contains a list of all WizardSteps and provides a means to skip around the WizardSteps in a random order. 
• Header: An optional element to provide consistent information at the top of the WizardStep.

CreateUserWizard control properties represented by text boxes, such as UserName, are accessible during all phases of the page life cycle. The control will pick up any changes made by the end user by means of the TextChanged event raised by the text boxes.

The CreateUserWizard control can optionally send e-mail messages to new users if you have configured an SMTP mail server to send e-mail. For more information, see the MailDefinition property.

By default, the CreateUserWizard control will accept a user name and password from the Web site visitor. Based on the requirements of the site's MembershipProvider object, the CreateUserWizard control will optionally accept an e-mail address, represented by the Email property, and a password recovery confirmation question and answer, represented by Question and Answer.

Creating a Registration Page

---

To create a registration page simply add a new web form or web form using master page depending on if you are using a master page or not. In this example I am going to add a new Web Form called Registration.aspx. I am adding a CreateUserWizard Control from the Login section of the too box to the registration.aspx page.  Here is what the page looks lilke:

If you notice a lot of the work has already been done for you. There is validation to make sure the password and confirmation match. You can also customize this. The Auto Format has the same features as many other controls. I am going to change the style to professional.

At this point you can start using the wizard to create users for your web site.

Adding a Link

---

To use ths wizard we probably are going to want to link to the page from the login. This will provide a place for the user to go register if they are not members. To accomplish this I am going to add a hyperlink control to the top of the login form. I am going to set the NavigationUrl to point to Registration.aspx. The page now looks like this:

 

A Problem?

---

At this point there is a Hyperlink control that is on the page that doesn't allow you to navigate to the registration page. This is because there is a Login Control in the same folder as the registration page which does not allow unauthorized access. All pages within that folder are governed by Login control. Actually, I should say they are governed by the entry in the web.config file that denies any anonymous users.

The Fix

---

There are two ways to solve the problem. One is to put everything that needs to be password protected into a separate folder and add a child web.config file in that folder which specifies the permissions. The second way is to add an entry into the web.config to allow the registration page to run. Here is the addition to the web.config to allow Registration.aspx to run:

The * says allow all users to access the page Register.aspx.

Now when you select the link the registration page will appear:

Now you can simply create an account:

Once you have filled out the form you can select the Create User button and you will get a success screen that looks like this:

What you should note is that the Continue buttin doesn't do anything. It might be best to place a Response.Redirect("Login.aspx"); inside the buttons click event to take the user back to the login screen.

Customizing The Wizard

---

You may be saying that this is fine and dandy but what if I want different fields or want to remove fields from the default. The answer is that you are good at writing markup you can create a custom template. The wizard works in steps, the first being the CreateUserWizardStep. This is where you would change the fields. Here I am going to display a template in this section:

 

Id's For Templates

---

You can use html to layout the template any way you want but in order for the CreateUserWizard to function properly, you must use the following id's for you TextBoxes:

ID=UserName

ID=Password

ID=Email

ID=ConfirmPassword

ID=Question

ID=Answer

ID=ErrorMessage