FrontPage 2003 Tutorial

HOW TO: Create a Password-Protected Web Page by Using Microsoft Office FrontPage 2003, Active Server Pages (ASP), and a Microsoft Access database

This step-by-step article describes how to create a simple password-protected Web page solution by using FrontPage 2003, Active Server Pages (ASP), and a Microsoft Access database.

FrontPage 2003 Support

For a Microsoft FrontPage 2002 version of this article, see 321439.

IN THIS TASK

Use the ASP Features in FrontPage 2003
- Create a New Web Site in FrontPage 2003
- Create a Database
- Import the Database
- Create the ASP Pages
  Important
  - The sample code in this article is not designed as a replacement for the FrontPage 2003
    built-in security functionality. The samples are designed to provide a simple security
    mechanism only for users who are browsing to your Web site. As such, FrontPage 2003
    security does not integrate with the user names and the passwords that are added to the
    Microsoft Access database.
  - The user names and passwords that are typed in are transmitted across the Internet in
    plain text. To help increase security, Microsoft recommends that you use a Web server
    that can use Secure Sockets Layer (SSL) encryption. For more information, contact your
    Web site administrator or your Internet Service Provider (ISP).
  Use the ASP Features in FrontPage 2003
  
  Before you can use the ASP features in FrontPage 2003, you must have access to a Web
  server or a disk-based Web that supports ASP.
  
  Create a New Web Site in FrontPage 2003
  
  Note The example information assumes that you name your Web site logon, and that you
  create it as a subweb off the root of your Web site. If you use a name other than logon, or
  create the Web site in an alternative location, you must modify the steps throughout this
  article accordingly.
  
  To create a new Web site in FrontPage 2003, follow these steps:
  1. Start FrontPage 2003.
  2. On the File menu, click New.
  3. In the task pane, click More Web site templates, and then click Empty Web Site.
  4. Under Options, type the location where you want to store the new Web site
    in the following format:
    http://servername/logon
    
    Where servername is the name of your ASP-enabled Web server.
  5. Click OK.
  The new empty Web site that is named logon is opened in FrontPage 2003.
  
  back to the top
  
  Create a Database
  
  Create a database to store user names and passwords by using a database program such
  as Microsoft Office Access 2003.
  
  Note If you use a program other than Access 2003 to create the database,
  modify these steps accordingly.
  
  To create a database, follow these steps:
  1. Start Access 2003.
  2. On the File menu, click New.
  3. In the task pane, click Blank database.
  4. Type logon.mdb for the file name, and then click Create.
  5. In the Objects pane, click Tables, and then click New.
  6. Click Design View, and then click OK.
  7. In the first row of the Field Name column, type UID.
  8. In the corresponding Data Type column, click Text, and then click the Primary Key
    button on the toolbar (appears as a key symbol).
  9. In the second row of the Field Name column, type PWD, and then click Text in the
    second row in the Data Type column.
  10. On the File menu, click Save.
  11. In the Table Name box, type tblUsers, and then click OK.
  12. On the View menu, click Datasheet View.
  13. In the UID column, type testuser.
    
    In the PWD column, type password.
  14. On the File menu, click Close, and then quit Access 2003.
  back to the top
  
  Import the Database
  
  Import the user name and the password database that you created into FrontPage 2003.
  To do so, follow these steps:
  1. In FrontPage 2003 with your logon Web site open, click Import on the File menu.
  2. Click Add File, locate and then click the logon.mdb file that you created.
    
    Click Open.
  3. Click Modify, type _private/logon.mdb in the File location within your web box,
    and then click OK.
    
    Note There is an underscore character (_) in front of "private" in the path of the file.
  4. Click OK to import the database file.
  5. If you are prompted to create a database connection for this imported file, click No.
  back to the top
  
  Create the ASP Pages
  
  You must create several files to work with this sample. First, create a home page for your Web site,
  a "nonsecure" page and a password-protected page for testing, and then the logon Web page and
  the logon include file.
  
  Create the Home Page
  
  This page serves as the default page for your site and includes links to the nonsecure page
  and the password-protected Web page that you create. To create a home page, follow these steps:
  1. In FrontPage 2003, click the Create a new normal page button.
  2. At the footer area of the document window, click Code to show code view.
  3. Select and then remove all the HTML code in the Web page.
  4. Type or paste the following HTML code in the Web page.
```
<% @language="vbscript" %>
<html>
<head><title>Home Page</title></head>
<body>
<h3>Home Page</h3>
<p>You are logged on as: 
<%
  If Len(Session("UID")) = 0 Then
    Response.Write "<b>You are not logged on.</b>"
  Else
    Response.Write "<b>" & Session("UID") & "</b>"
  End If
%>
</p>
<ul>
<li><a href="passwordprotect.asp">Password-Protected Page</li>
<li><a href="nonsecure.asp">Nonsecure Page</li>
</ul>
</body>
</html>
```
  5. Right-click the new_page_1.htm tab, and then click Save.
    
    Save the page as default.asp in the root folder of your Web site.
  6. On the File menu, click Close to close the default.asp Web page.
  back to the top
  
  Create the Nonsecure Page
  
  Create a typical ASP page that everyone can view. To create a nonsecure page, follow these steps:
  1. In FrontPage 2003, click the Create a new normal page button.
  2. At the footer area of the document window, click Code to show code view.
  3. Select and then remove all the HTML code in the Web page.
  4. Type or paste the following HTML code in the Web page.
```
<% @language="vbscript" %>
<html>
<head><title>Nonsecure Page</title></head>
<body>
<h3>Nonsecure Page</h3>
<p>You are logged on as: 
<%
  If Len(Session("UID")) = 0 Then
    Response.Write "<b>You are not logged on.</b>"
  Else
    Response.Write "<b>" & Session("UID") & "</b>"
  End If
%>
</p>
<p><a href="default.asp">Back to default</a>
</body>
</html>
```
  5. Right-click the new_page_1.htm tab, and then click Save.
    
    Save the page as nonsecure.asp in the root folder of your Web site.
  6. On the File menu, click Close to close the nonsecure.asp Web page.
  back to the top
  
  Create the Password-Protected Page
  
  The page in this step is the same as the nonsecure Web page that you created previously,
  except that you must add the following line of code near the top of the page:
```

```
  When you add this line of code to an ASP Web page, that page becomes password-protected
  by the logon.inc file that you create. To create a password-protected Web page, follow these steps:
  1. In FrontPage 2003, click the Create a new normal page button.
  2. At the footer area of the document window, click Code to show code view.
  3. Select and then remove all the HTML code in the Web page.
  4. Type or paste the following HTML code in the Web page.
```
<% @language="vbscript" %>

<html>
<head><title>Password-Protected Page</title></head>
<body>
<h3>Password-Protected Page</h3>
<p>You are logged on as: 
<%
  If Len(Session("UID")) = 0 Then
    Response.Write "<b>You are not logged on.</b>"
  Else
    Response.Write "<b>" & Session("UID") & "</b>"
  End If
%>
</p>
<p><a href="default.asp">Back to default</a>
</body>
</html>
```
  5. Right-click the new_page_1.htm tab, and then click Save.
    
    Save the page as passwordprotect.asp in the root folder of your Web site.
  6. On the File menu, click Close to close the passwordprotect.asp Web page.
  back to the top
  
  Create the Logon Page
  
  Create a logon page that looks similar to a typical Windows logon dialog box. Users who try
  to access the password-protected Web page are sent to this page to type their user name and
  password. To create a logon page, follow these steps:
  1. In FrontPage 2003, click the Create a new normal page button.
  2. At the footer area of the document window, click Code to show code view.
  3. Select and then remove all the HTML code in the Web page.
  4. Type or paste the following HTML code in the Web page.
```
<% @language="vbscript" %>

<%
  ' Was this page posted to?
  If UCase(Request.ServerVariables("HTTP_METHOD")) = "POST" Then
    ' If so, check the username/password that was entered.
    If ComparePassword(Request("UID"),Request("PWD")) Then
      ' If comparison was good, store the user name...
      Session("UID") = Request("UID")
      ' ...and redirect back to the original page.
      Response.Redirect Session("REFERRER")
    End If
  End If
%>
<html>
<head><title>Logon Page</title>
<style>
body  { font-family: arial, helvetica }
table { background-color: #cccccc; font-size: 9pt; padding: 3px }
td    { color: #000000; background-color: #cccccc; border-width: 0px }
th    { color: #ffffff; background-color: #0000cc; border-width: 0px }
</style>
</head>
<body bgcolor="#000000" text="#ffffff">
<h3 align="center">&#xa0;</h3>
<div align="center"><center>
<form action="<%=LOGON_PAGE%>" method="POST">
<table border="2" cellpadding="2" cellspacing="2">
  <tr>
    <th colspan="4" align="left">Enter User Name and Password</th>
  </tr>
  <tr>
    <td>&#xa0;</td>
    <td colspan="2" align="left">
     Please type your user name and password.</td>
    <td>&#xa0;</td>
  </tr>
  <tr>
    <td>&#xa0;</td>
    <td align="left">Site</td>
    <td align="left">
    <%=Request.ServerVariables("SERVER_NAME")%> &#xa0;</td>
    <td>&#xa0;</td>
  </tr>
  <tr>
    <td>&#xa0;</td>
    <td align="left">User Name</td>
    <td align="left"><input name="UID" type="text" size="20"></td>
    <td>&#xa0;</td>
  </tr>
  <tr>
    <td>&#xa0;</td>
    <td align="left">Password</td>
    <td align="left">
    <input name="PWD" type="password" size="20"></td>
    <td>&#xa0;</td>
  </tr>
  <tr>
    <td>&#xa0;</td>
    <td colspan="2" align="center">
    <input type="submit" value="LOGON"></td>
    <td>&#xa0;</td>
  </tr>
</table>
</form>
</center></div>
</body>
</html>
```
  5. Right-click the new_page_1.htm tab, and then click Save.
    
    Save the page as logon.asp in the root folder of your Web site.
  6. On the File menu, click Close to close the logon.asp Web page.
  back to the top
  
  Create the Logon Include File
  
  The include file provides the user name and password functionality and is used by both the
  password-protected Web page and the logon Web page. To create the logon include file,
  follow these steps:
  1. In FrontPage 2003, click the Create a new normal page button.
  2. At the footer area of the document window, click Code to show code view.
  3. Select and then remove all the HTML code in the Web page.
  4. Type or paste the following HTML code in the Web page.
```
<%
  ' Do not cache this page.
  Response.CacheControl = "no-cache"

  ' Define the name of the users table.
  Const USERS_TABLE  = "tblUsers"
  ' Define the path to the logon page.
  Const LOGON_PAGE   = "/logon/logon.asp"
  ' Define the path to the logon database.
  Const MDB_URL      = "/logon/_private/logon.mdb"

  ' Check to see whether you have a current user name.
  If Len(Session("UID")) = 0 Then
    ' Are you currently on the logon page?
    If LCase(LOGON_PAGE) <> LCase(Request.ServerVariables("URL")) Then
      ' If not, set a session variable for the page 
      ' that made the request...
      Session("REFERRER") = Request.ServerVariables("URL")
      ' ...and redirect to the logon page.
      Response.Redirect LOGON_PAGE
    End If
  End If

  ' This function checks for a username/password combination.
  Function ComparePassword(UID,PWD)
    ' Define your variables.
    Dim strSQL, objCN, objRS
    ' Set up your SQL string.
    strSQL = "SELECT * FROM " & USERS_TABLE & " WHERE 
    (UID='" & UID & "' AND PWD='" & PWD & "');"
    ' Create a database connection object.
    Set objCN = Server.CreateObject("ADODB.Connection")
    ' Open the database connection object.
    ' The & _ is to continue the connection object onto 
    ' another line instead of it being on one long line
    ' You must also precede it by a quote " mark
    ' and begin the next line of the connection object
    ' with a quote " mark as normally these quote marks
    ' are not needed if it were all on one line
     objCN.Open "driver={Microsoft Access Driver (*.mdb)};" & _
    "dbq=" & Server.MapPath(MDB_URL) & "; uid=admin; pwd="
    ' Run the database query.
    Set objRS = objCN.Execute(strSQL)
    ' Set the status to true/false for the database lookup.
    ComparePassword = Not(objRS.EOF)
    ' Close your database objects.
    Set objRS = Nothing
    Set objCN = Nothing
  End Function
%>
```
  back to the top
  
  Test the Logon Web Site
  
  To do this, follow these steps:
  
  In FrontPage 2003, in the Folder List pane, right-click Default.asp, and then
  click Preview in Browser.
  
  The Web browser loads the sample home page and shows that you are not logged on.
  
  Click the Nonsecure page link.
  
  The page loads and shows that you are not logged on. Click the Back to default
  link to return to the default page.
  
  Click the Password-Protected page link.
  
  The logon.asp page loads instead of the password-protected page.
  
  In the User Name box, type testuser, type password in the Password box,
  and then click LOGON.
  
  The password-protected page appears and shows that you are logged on as testuser.
  Click the Back to default link to return to the default page. The home page loads and
  shows that you are logged on as testuser.
  
  Click the Nonsecure page link.
  
  The page loads and shows that you are logged on as testuser.
  
  back to the top
  
  Customize the Logon Web Site
  
  You can customize the logon example Web site in the following ways:
  
  Add user names and passwords: You can open the database. To do so, double-click the database in FrontPage 2003, and then add users to the tblUsers table.
  
  Password-protect other Web pages: To password-protect another Web page in your
  Web site, you must save the file with an ASP file name extension, for example, Mypage.asp, and then add the following two lines to the very top of the file:
  <% @language="vbscript" %> 
  
  The first line specifies that you are using Microsoft Visual Basic Scripting Edition
  (VBScript) for your scripting language, and the second line includes the user name
  and the password functionality from the logon include file that you created earlier.
  
  back to the top
  REFERENCES
  
  For additional information about how to integrate Active Server Pages (ASP) with databases, click the following article numbers to view the articles in the Microsoft Knowledge Base:
  
  299987 HOW TO: Use Database and ASP Sessions to Implement ASP Security
  
  300382 HOW TO: Create a Database Connection from an ASP Page in IIS
  
  318287 FP2002: What You Need to Use Active Server Pages (ASP) in FrontPage 2002
  back to the top
  
  The information in this article applies to:
  
  Microsoft Office FrontPage 2003
  
  Microsoft Knowledge Base Article - 825498

Support Center
- Glossary of Terms
- Free Support Details

Web Hosting » Support

HOW TO: Create a Password-Protected Web Page by Using Microsoft Office FrontPage 2003, Active Server Pages (ASP), and a Microsoft Access database

The information in this article applies to: