Designing a Membership Sign-Up and Login Page in ASP.NET

Introduction

Web site developed nowadays contains dynamic content such as news, events, newsletters, polls, forum posts, and more. It is a content based site, where parts of the site can be easily changed or updated by privileged users. Any content based site that wants to be successful must build a great community of users. If you have a lot of loyal users, you can be sure that the site will increase its user base, and thus its size, its popularity. You want to encourage users to register for a free account on the site so you can enable them to customize their view or participate in the forum. Once they obtain a free account they will be a member of the site. Membership is a form of empowerment. They will feel special because they are a member. In order to track members, it is necessary to have some sort of identity to describe and distinguish them from other members and, more important, against anonymous users who have not logged in. This will explain how to design user membership and registration.

Main

A membership is a system that handles the following operation and features:
• Users must be able to create new accounts by filling out an online registration form.
• Users must be able to later login and change their own acount, or recover them if they forget them.

Here I will cover the designing part of it in ASP.NET. As you know, designing a module for handling user membership and profiling is not easy. You must create some database tables for storing the required data and an API that allows the developer to request, create, and modify this data. For some time ago, the developer was completely responsible for all the work of writing the login and registration pages. But now with a lot of improvement in ASP.NET, it is easier to insert membership control from toolbox.

The Membership and MembershipUser Classes
The principal class of the ASP.NET 2.0's security framework is System.Web.Security.Membership, which exposes a number of static methods to create, delete, update, and retrieve registered users. The following lists which I retrieve from other source describes the most important methods.

CreateUser: Creates a new user account.
DeleteUser: Deletes the specified user.
FindUsersByName: Returns an array of users with the specified name.
GetAllUsers: Returns an array with all the registered users.
GetNumberOfUsersOnline: Returns an integer value indicating how many registered users are currently online.
UpdateUser: Updates a user
etc

Some of these methods (CreateUser, GetAllUser, FindUsersByName, and UpdateUser) accept or return instances of the System.Web.Security.MembershipUser class, which represents a single user, and provides quite a lot of details about it. The following lists describes the instance properties and methods exposed by this class.

Comment: A comment (typically entered by the administrator) associated with a given user
CreationDate: The date when the user registered
Email: The user's e-mail address
IsApproved: Indicates whether the account is enabled, and whether the user can log in
LastActivityDate: The date when the user logged-in or was last authenticated.
LastLoginDate: The date of the last login
UserName: The user's username
etc

When you change a user property, the new value is not immediately changed to the data store. You have to call the UpdateUser method of the Membership class for that.

By using these two classes together, you can completely manage the accounts data in a very easy way. I can show you a few examples about their usage in practice. For more details about it maybe can refer to MSDN. Following is some code for registering a new account and handling the exception that may be occurred if an acount with the specified username or e-mail address already exists: 

       string msg = "User created successfully!";
        try
        {
            MembershipUser newUser = Membership.CreateUser(
               "Candra", "secret", "hanscandra@gmail.com");
        }
        catch (MembershipCreateUserException exc)
        {
            msg = "Unable to create the user. ";
            switch (exc.StatusCode)
            {
                case MembershipCreateStatus.DuplicateEmail:
                    msg += "An account with the specified e-mail already exists.";
                    break;
                case MembershipCreateStatus.DuplicateUserName:
                    msg += "An account with the specified username already exists.";
                    break;
                case MembershipCreateStatus.InvalidEmail:
                    msg += "The specified e-mail is not valid.";
                    break;
                case MembershipCreateStatus.InvalidPassword:
                    msg += "The specified password is not valid.";
                    break;
                default:
                    msg += exc.Message;
                    break;
            }
        }
        lblResult.Text = msg;

If you want to change some of the user's information, you first retrieve a MembershipUser instance that represents that user, change some properties as desired, and then update the user, as shown below:

        MembershipUser user = Membership.GetUser("Candra");
        if (DateTime.Now.Subtract(user.LastActivityDate).TotalHours < 2)
            user.Comment = "very knowledgeable user; strong forum participation!";
        Membership.UpdateUser(user);

Validating user credentials from a custom login form requires only a single line of code:

bool isValid = Membership.ValidateUser("Candra", "secret");

The Graphical Login Controls

As you saw earlier, creating, validating, and managing users requires only a few lines of programming code. But we can do it with no coding by using the new Login controls introduced with ASP.NET 2.0. These controls provide a user interface for the membership such as creating a new account, logging in and out, retrieving or resetting a forgotten password. In Visual Studio 2008 you can find it in the toolbox login control. It also shows a CreateUserWizard control.

The CreateUserWizard Control
The CreateUserWizard control creates a user interface for a user to register, by providing the username, password, and e-mail address. When the Submit button is clicked, the control calls Membership.CreateUser. The asp.net code is as follows:

<asp:CreateUserWizard id=CreateUserWizard1 runat="server">
   <WIZARDSTEPS>
      <asp:CreateUserWizardStep id=CreateUserWizardStep1 runat="server">
      </asp:CreateUserWizardStep>
      <asp:CompleteWizardStep id=CompleteWizardStep1 runat="server">
      </asp:CompleteWizardStep>
   </WIZARDSTEPS>
</asp:CreateUserWizard>

The source code was automatically updated as follows:

<asp:CreateUserWizard id=CreateUserWizard1 runat="server" 
Font-Size="10pt" Font-Names="Verdana" BorderWidth="1px" 
BorderStyle="Solid" BorderColor="#CCCC99" BackColor="#F7F7DE">
   <WIZARDSTEPS>
      <asp:CreateUserWizardStep id=CreateUserWizardStep1 runat="server">
      </asp:CreateUserWizardStep>
      <asp:CompleteWizardStep id=CompleteWizardStep1 runat="server">
      </asp:CompleteWizardStep>
   </WIZARDSTEPS>
   <SIDEBARSTYLE Font-Size="0.9em" BorderWidth="0px" BackColor="#7C6F57" VerticalAlign="Top" />
   <SIDEBARBUTTONSTYLE Font-Names="Verdana" BorderWidth="0px" 
ForeColor="#FFFFFF" />
   <NAVIGATIONBUTTONSTYLE Font-Names="Verdana" BorderWidth="1px" 
BorderStyle="Solid" BorderColor="#CCCCCC" BackColor="#FFFBFF" ForeColor="#284775" />
   <HEADERSTYLE Font-Size="0.9em" BorderStyle="Solid" 
BackColor="#F7F7DE" ForeColor="#FFFFFF" 
HorizontalAlign="Left" Font-Bold="True" />
   <CREATEUSERBUTTONSTYLE Font-Names="Verdana" BorderWidth="1px" 
BorderStyle="Solid" BorderColor="#CCCCCC" BackColor="#FFFBFF" ForeColor="#284775" />
   <CONTINUEBUTTONSTYLE Font-Names="Verdana" BorderWidth="1px" 
BorderStyle="Solid" BorderColor="#CCCCCC" BackColor="#FFFBFF" ForeColor="#284775" />
   <STEPSTYLE BorderWidth="0px" />
   <TITLETEXTSTYLE BackColor="#6B696B" ForeColor="#FFFFFF" Font-Bold="True" />
</asp:CreateUserWizard>

The Login Control
The Login control allows the user to log in. It provides the user interface for typing the username and password, and choosing whether the login will be saved in session or not. You just need to declare the control as follows:

<asp:Login id=Login1 runat="server"></asp:Login>

this control will call the Membership.ValidateUser method to check whether the provided credentials are found in the data store, and if so, it calls FormsAuthentication.RedirectFormLoginPage to create the encrypted authentication session, saves it into a client cookie, and redirects to the page that the user originally tried to access before being redirected to the login page.

The ChangePassword Control
The ChangePassword control allows users to change their current password, through the user interface. Example was shown below.



The PasswordRecovery Control
The ChangePassword control enables users to recover or reset their password, in case they forgot it. The first step is to provide the username.



The LoginStatus, LoginName, and LoginView Controls
These last three controls are the simplest ones, and are often used together. The LoginName control shows the name of the current user. If the current user is not authenticated, the control shows nothing. The LoginStatus control shows a link to log out or log in, according to whether the current user is or is not authenticated. When the Login link is clicked, it redirects to the login page specified in the web.config file element. When the Logout link is clicked, the control calls FormsAuthentication.SignOut to remove the client's authentication session and redirect to a different page based on LogoutPageUrl properties. The LoginView allows you to show when the user is anonymous or logged in.

Conclusion

There are still plenty of topics we can cover in ASP.NET membership, like user roles, user profiling, user security, and also admin tools for maintain this membership. For more advance details about it maybe can refer to Microsoft Developer Network or other useful online help.

References

All the useful links or references that can help users learn about this tutorial

1. Introduction to Membership
2. How to use Membership in ASP.NET
3. Login Control Overview
4. Login Control in ASP.NET

Other Related and Popular Articles :

Author Profile : Hans Candra

Comments