Logging In to the Website with the Login Control

Any site that supports user accounts must include some means for the users to log in to the site. This is typically done through a login page. In the login page, the user is queried for his credentialsin our case, his username and password. Creating a login page in ASP.NET is quite simple thanks to the Login Web control, which renders the typical login user interface. To see this Web control in action, start by creating a new ASP.NET page named Login.aspx, adding the Login control to the page (see Figure 20.12).

Figure 20.12. The Login control provides the standard login user interface.

As Figure 20.12 shows, the Login control contains two TextBox controls to capture the user's credentials. Additionally, there's a Remember Me Next Time check box. If the user logs on to the site without checking the Remember Me Next Time check box, she remains logged on to the site for the duration of her browser session; after she closes her browser and revisits the site, she'll need to log on again. If, however, the user checks this check box when signing on, she'll remain logged on across browser and computer restarts.

Did you Know?

Online banking websites and other security-conscious sites often don't provide a Remember Me Next Time option to help prevent another person using the same computer from logging on to the first user's account. You can dictate whether this Remember Me Next Time check box appears through the Login control's DisplayRememberMe property.

When visiting this page, if a user enters invalid credentials or the credentials for an inactive account, he will be shown an appropriate messageYour login attempt was not successful. Please try again. by default. If he enters valid credentials, he will be logged on to the site and redirected to the URL specified by the Login control's DestinationPageUrl property. (If no value is specified for this property, the user will be sent to Default.aspx.) try out this page on your own in a browser. Go to Login.aspx and observe what happens when you enter invalid credentials, or when you omit the username or password. Also, make sure to see what happens when you provide valid credentials.

By the Way

If the user attempts to visit a page that he does not have access to, he will automatically be redirected back to the login page. For example, earlier in this hour we created a Users folder and configured its access rights to disallow anonymous users. Take a moment to add a Default.aspx page to the Users folder and then, when logged out, try visiting this page. You'll find that you are automatically sent back to the login page, at which point you can enter your credentials. Upon being authenticated, you will be automatically sent back to the Users/Default.aspx page.

Customizing the Login Control

Like the Web controls examined in the preceding hour, the Login control has the usual suite of appearance-related properties. Furthermore, like the CreateUserWizard control, the Login control has propertiesLoginButtonText, PasswordLabelText, UserName, UserNameRequiredErrorMessage, and so onthat can be used to customize the labels, text box content, and error messages. Rather than rehash them, let's focus on the Login control-specific properties.

The Login control properties worth noting include those in the Link and Behavior sections of the Properties window. Table 20.2 contains a listing of the control's more interesting properties, along with a brief description for each.

Table 20.2. Customize the Login Control Using These Properties

Property Name	Description
DestinationPageUrl	Indicates the URL the user is sent to after successfully logging in. Defaults to an empty value, which ends up sending the user to Default.aspx.
DisplayRememberMe	Specifies a Boolean value that indicates whether the Remember Me Next Time check box is present. Defaults to TRue.
RememberMeSet	Indicates a Boolean value that specifies whether the Remember Me Next Time check box is checked by default. Defaults to False.
VisibleWhenLoggedIn	Indicates whether the Login control is rendered when the page is visited by an authenticated user. Defaults to TRue.
Orientation	Has a Vertical orientation, by default, which causes the username text box to be placed above the password text box. You can have the text boxes laid side-by-side by setting this property to Horizontal.
TextLayout	Can be one of two valuesTextOnLeft or TextOnTop. Specifies the position of the labels relative to the text boxes.
CreateUserText CreateUserIconUrl CreateUserUrl	Include a link from the Login control to the create account page by setting the CreateUserUrl and one or both of the CreateUserText and CreateUserIconUrl properties.
HelpPageText HelpPageIconUrl HelpPageUrl	Allow you to add a link to this page if you have created a help page, explaining the login process and policies.
PasswordRecoveryText PasswordRecoveryIconUrl PasswordRecoveryUserUrl	Provide a link to a web page from which the user can reset her password. (We'll examine the PasswordRecovery Web control in the "Recovering a User's Forgotten Password" section later in this hour.)

If you add a Login control to your site's home page, you likely want the control to appear only for unauthenticated users. That is, if a user is already logged in, there's no reason to show the Login control on the home page. To accomplish this, you can set the control's VisibleWhenLoggedIn property to False. Another option, though, is to use the LoginView Web control, which lets you define precisely what content is shown for logged-in users versus that shown for unauthenticated users. We'll discuss this control in more detail later in this hour in the "Displaying Content Based on Authentication Status" section.

Logging Out

While being able to log on to a site is important, it's also equally important to allow users to easily log off. This is usually accomplished through a Logoff link that, when clicked, signs the user out of the site. The LoginStatus Web control provides this functionality. When a user is logged on the site, the LoginStatus control displays a Logoff link; when a user is not logged on, the control renders a Login link.

Add the LoginStatus control to Default.aspx. In the control's smart tag, you'll see that there are two views: Logged In and Logged Out. Toggling between these views shows what visitors to the site will see depending on whether they're authenticated. The LoginText and LogoutText properties specify the text that's displayed for the Login and Logout links. If you would rather have these links displayed as clickable images, you can set the LoginImageUrl and LogoutImageUrl properties to the corresponding login and logout images.

Did you Know?

You'll likely want to have the LoginStatus control appear on all of the pages in your website, thereby enabling users to log on or log off from anywhere on the site. Although this can be accomplished by manually adding a LoginStatus control to each and every page of the site, a better, more maintainable approach is to use master pages, which are the topic of our next hour.

By default, when the user clicks the logout link, he will be logged out but remain on the same page. If you want the person redirected to a specific URL after being logged out, use the LogoutAction and LogoutPageUrl properties. The LogoutAction property specifies what action is taken when the user clicks the Logout link, and can have one of three values:

• Refresh The user is logged out and stays on the same page.

• Redirect The user is logged out and redirected to the URL specified by the LogoutPageUrl property.

• RedirectToLoginPage The user is logged out and redirected to the login page.

When an unauthenticated user visits a page with a LoginStatus control and clicks the Login link, he is taken to the login page with the URL of the page he was on passed along in the querystring. After the user successfully provides his credentials, not only is he logged on, but he is automatically redirected back to the page he came from.

Specifying the Login Page URL

If you scan the list of the LoginStatus control's properties, you'll notice that while there's a LogoutPageUrl property, there's no LoginPageUrl property. That is, there's no explicit way to tell the LoginStatus control where to send the user when she clicks the Login link. By default, the website uses the URL Login.aspx as its login page. If, however, you need to customize this, you can do so through the site's web.config file. Specifically, you need to find the <authentication> element and add a <forms> child element. In the <forms> element, use the loginUrl attribute to specify the URL of the site's login page.

For example, to create a site whose login page was at SignOn.aspx instead of Login.aspx, we'd go to the web.config file and locate the <authentication> element, which should look like this:

<authentication mode="Forms" /> 

We need to add the <forms> element as an inner element of the <authentication> element. Therefore, replace the preceding line with the following:

<authentication mode="Forms">    <forms loginUrl="SignOn.aspx" /> </authentication> 

Did you Know?

To avoid having to muck around in the web.config file, I make sure to name my login page Login.aspx. If you decide to use a login page other than the default Login.aspx, keep in mind that the web.config file is case sensitive. Make sure to enter the <forms> element and loginUrl attribute with the correct casing.