| After you create a registration page to register users to your site, you need to create a login page where registered users can log in to the site or to a members-only section of it. Building a login page includes adding an HTML form in which members will enter a user name and password, adding a Log In User server behavior to check that the user name and password are valid, and adding a Log Out User server behavior to allow users to log out of the site. You also need to create three additional pages: a page that opens when the login is successful (for example, the home page of the members section of your site), a page that lets the user know when a login is not successful, and a page that lets the user know when he or she has logged out. When you insert a Log In User server behavior on your login page, Dreamweaver automatically adds the code to create a session variable. A session variable stores information about an individual user's current session. The session begins when the user logs in to the site and ends when the user logs off or is inactive for a specific period of time, determined by the site administrator. Without session variables, users would have to log in again each time they went to a different page in a restricted area of the site. Session variables can also be used to store user preferences, such as text size. In the exercises in this section, we use PHP and the users table of the Login database to define a recordset, add an HTML form for user login, and add Log In User and Log Out User server behaviors. To define a recordset for the login page: 1. | Open a new PHP page in Dreamweaver (File > New > Dynamic page > PHP). Save the page as login.php.
| 2. | In the Application panel group, click the Bindings tab to access the Bindings panel.
| 3. | Click the plus (+) button and choose Recordset (Query) to add a recordset (Figure 13.16).
Figure 13.16. Choose Recordset (Query) from the Bindings panel menu. 
The Recordset dialog appears.
| 4. | In the Name field, enter a name for the recordset. Choose a name that will help you to identify the recordset later.
For this exercise we're defining a recordset for a login page, so we named our recordset login (Figure 13.17).
Figure 13.17. Use the Recordset dialog to create a new recordset. 
| 5. | From the Connection drop-down list, select the name for your connection to the Login database. Our connection is named connLogin.
| 6. | From the Table drop-down list, choose users.
| 7. | In the Columns section, choose the Selected radio button. From the list of field names in the Columns box, select the userName and the Password fields.
You've now added the userName and Password fields from the users table to the recordset.
| 8. | Click the Test button to preview the recordset.
The Test SQL Statement window appears (Figure 13.18).
Figure 13.18. View the recordset data in the Test SQL Statement window. 
| 9. | Click OK to close the Test SQL Statement window, and then click OK in the Recordset dialog to close it and save the recordset.
| 10. | Save the page.
You've created a recordset that includes the data from the userName and Password fields in the users table. This recordset will be used with the Log In User server behavior to verify the userName and Password information that is submitted with the login form. (You'll create the login form in the next exercise.)
|
To create a login form: 1. | Open the login.php page from the preceding exercise.
| 2. | From the Insert menu, select Form > Form to add a form to your page (Figure 13.19).
Figure 13.19. Use the Insert menu to add a form to your page. 
| 3. | In Design view, select the form.
If the form boundaries aren't visible, choose View > Visual Aids > Invisible Elements.
| 4. | In the Property inspector, type login in the Form Name box (Figure 13.20)
Figure 13.20. In the Form Name box in the Property inspector, type a name for the form. 
Leave the Action and Method fields blank. They'll be filled in automatically when you add the Log In User server behavior in the following exercise.
| 5. | From the Insert menu, select Form > Text Field to add a text field to the form.
| 6. | In Design view, select the text field.
| 7. | In the Property inspector, type userName in the TextField name box (Figure 13.21). In the Char Width and the Max Chars fields, type 50. In the Type section, select the Single Line radio button.
Figure 13.21. Use the Property inspector to set properties for the userName text field. 
You've now inserted a 50-character text field named userName in the login form. This field will be used to collect the visitor's user name.
| 8. | Repeat Steps 5 and 6. In the Property inspector, type Password in the TextField name box (Figure 13.22). In the Char Width and Max Chars fields, type 8. In the Type section, select the Password radio button.
Figure 13.22. In the Property inspector, type Password in the TextField Name box, select the Password radio button, and type 8 in the Char Width and Max Chars fields. 
You just inserted an 8-character text field named Password in the login form. You've also selected the Password type for this field, which means that when the user enters text in this field, it's shown as asterisks or bullets to hide it from onlookers. However, this information is not encrypted when it is submitted to the server.
| 9. | From the Insert menu, select Form > Button to add a button to the form.
| 10. | In Design view, select the button. In the Property inspector, type submit in the Button Name box (Figure 13.23). In the Value field, type Submit. In the Action section, select the Submit Form radio button.
Figure 13.23. Set properties for a submit button in the Property inspector. 
| 11. | Save the page.
You've created a login form with a text field for the user name and a password field for the password. In the following exercise, you'll add a Log In User server behavior, which compares the submitted data with the information in the login recordset.
|
To add a server behavior to check the user name and password: 1. | Open the login.php page from the preceding task.
| 2. | In the Application panel group, click the Server Behaviors tab to access the Server Behaviors panel.
| 3. | Click the plus (+) button and choose User Authentication > Log In User from the Server Behaviors menu (Figure 13.24).
Figure 13.24. Choose Log In User from the User Authentication submenu in the Server Behaviors menu. 
The Log In User dialog appears.
| 4. | From the Get Input From Form dropdown list, select login (Figure 13.25). From the Username Field drop-down list, select userName, and from the Password Field drop-down list, select Password.
Figure 13.25. Use the Log In User dialog to set properties for the Log In User server behavior. 
| 5. | In the same dialog, from the Validate Using Connection drop-down list, select your connection to the Login database (Figure 13.26). Our connection is named connLogin.
Figure 13.26. Select your connection to the Login database. 
| 6. | From the Table drop-down list, select users. From the Username Column dropdown list, select userName, and from the Password Column drop-down list, select Password.
| 7. | In the If Login Succeeds, Go To field, type a name for the page to open if the login is successful (Figure 13.27). Our page is named members.php.
Figure 13.27. Enter filenames for pages to open based on whether or not the login is successful. You'll need to create these pages. 
If you want users who were sent to the login page after attempting to access a restricted page to be sent back to that restricted page after they log in, check the "Go to previous URL (if it exists)" box.
| 8. | In the If Login Fails, Go To field, type a name for the page to open if the login is not successful. Our page is named tryAgain.php.
| 9. | In the Restrict Access Based On section, select the Username, Password, and Access Level radio button (Figure 13.28). From the Get Level From dropdown list, select Access.
Figure 13.28. Choose a means of restricting access: by user name and password only, or by user name, password, and access level, as shown here. 
If you aren't using access levels in your site, select the Username and Password radio button.
| 10. | Click OK to close the dialog and insert the server behavior on your page.
| 11. | Save the page.
| 12. | Open a new PHP page (File > New > Dynamic page > PHP) and save it as members.php.
| 13. | Add a message to the page to let the user know that the login was successful (Figure 13.29).
Figure 13.29. Add a message that will appear when login is successful. 
| 14. | Open another new PHP page and save it as tryAgain.php.
| 15. | Add a message to the page to let the user know that the login was not successful. Include a link to the login page so that the user can attempt to log in again (Figure 13.30).
Figure 13.30. Add a message that will appear when login is not successful. 
You've now added a Log In User server behavior to your login page. This behavior compares the values submitted in the login form with the values in the login recordset, and then directs the user to the appropriate page based on the values you entered in the Log In User dialog.
|
To test the login page: 1. | Open the login.php page. Choose File > Preview in Browser.
| 2. | Type values for a current member in the User Name and Password fields (Figure 13.31).
Figure 13.31. Test the login page by previewing it in a browser, entering values in the form fields, and clicking the Submit button. 
| 3. | Click the Submit button. The members.php page opens (Figure 13.29).
| 4. | Use the browser Back button to return to the login.php page. This time, use invalid values for the User Name and/or Password fields.
The tryAgain.php page opens (Figure 13.30).
| 5. | If the appropriate pages don't open when you test the login page, click the Server Behaviors tab in the Application panel group to access the Server Behaviors panel. Double-click Log In User in the Server Behaviors menu. The Log In User dialog appears. Edit the information in the dialog, and then click OK to close the dialog and save the new information. Repeat Steps 1 through 4.
|
To log out users: 1. | Open a new PHP page (File > New > Dynamic page > PHP). Save this page as goodbye.php.
| 2. | Add a message to this page to let the user know that he or she has successfully logged out (Figure 13.32). Save the page.
Figure 13.32. Add a message that will appear when users have successfully logged out. 
| 3. | Open the members.php page.
| 4. | In Design view, select text or an image on the page to be used for the link to the Log Out (goodbye) page.
Alternatively, you can enter new text or insert a new image to be used for the link and then select the text or image.
| 5. | In the Application panel group, click the Server Behaviors tab to access the Server Behaviors panel.
| 6. | Click the plus (+) button, and choose User Authentication > Log Out User from the Server Behaviors menu (Figure 13.33).
Figure 13.33. Choose Log Out User from the User Authentication submenu in the Server Behaviors menu. 
The Log Out User dialog appears.
| 7. | In the Log Out When section, select the Link Clicked radio button (Figure 13.34).
Figure 13.34. Choose a link and specify a good-bye page in the Log Out User dialog. 
The text or image you selected on the members.php page displays in the dropdown list.
| 8. | In the When Done, Go To field, type goodbye.php.
The goodbye.php page opens when the user clicks the link on the members.php page.
| 9. | Click OK to close the dialog and insert the Log Out User server behavior on the members.php page.
| 10. | Save the page. Preview the members.php page in a browser (File > Preview in Browser) and click the link to log out. The goodbye.php page should open (Figure 13.32).
You've added a Log Out link and a Log Out User server behavior to the members.php page. When the user clicks the link, the goodbye.php page opens, and the server closes the session.
|
 Tip
|
