From FMWebschool Reference

Contents 1 Chapter 14. Login Systems – Account Based and Table Based 1.1 Accounts Based Login System 1.2 Table Based Login Systems 1.3 Creating a Logout Link 2 See Also

Chapter 14. Login Systems – Account Based and Table Based

With FMStudio you can create advanced login systems with very little effort. There are two main types of login systems. Account based logins and table based logins. The purpose of a login system is to protect any number of pages on your website. This assures that only the people with the correct credentials can access these pages.

Before delving into Login Systems, make sure that you have the companion database fotoroma.fp7 open.

Accounts Based Login System

The first type of login system that we will be creating is an accounts based login.

Accounts and Privileges are based on the accounts under File > Manage > Accounts and Privileges.

Image 14 – 1: Open FileMaker and select File > Manage > Accounts and Privileges

The account based logins are based on FileMaker user accounts and privilege sets. They are defined by you and can restrict the data that is seen by the accounts. The restrictions of the privilege set can limit data to the logged in account and any searches will only search within their restricted dataset.

One very important thing to note is that in order for certain privilege sets to be accessible online, the ‘fmxml’ Extended Privileges must be enabled when using FX.php and the ‘fmphp’ Extended Privileges enabled if you are using the FileMaker API for PHP.

Image 14 – 2: Click ‘Edit’ to manage privilege sets, or ‘New’ to create a new privilege set.

If the privilege sets are not set up, you can simply create them by clicking the ‘New’ button at the bottom of the ‘Manage Accounts and Privileges’ window, or edit the existing values by choosing the ‘Edit’ button.

If the privileges are not properly set up, users will not be able to login. This is a simple example of account based logins. Don’t worry; we will set them up in FMStudio in just a bit. Before we do that however, let’s discuss the requirements for table based login systems.

A table based login will base the login on database records. It is a search within a specific layout based on two fields that you specify. For example the email field could be the username field and the password field of course would be the password field. If there is a record that exactly matches the search criteria it will be found, and the login will be accepted. If no account is found, it is not considered a valid user. One of the advantages of using table based logins is that they are easier to manage, and the list of users can be dynamically changed with ease. Many times developers will create a table in FileMaker that is strictly a username / password table.

Let’s start by developing an account based login system with FMStudio. The account based system will log-in a user ‘a photographer’ based on a real account and then find all of their photos in the database. Later in this chapter we will learn how to create a logout system as well.

1. Create a new page and name it ‘account_photographer.php’.
2. Next we need to define the database, login connection. Navigate to the Database tab, click the ‘+’ button, and specify ‘FileMaker Connection with User Login’.

Image 14 – 3: Under the Databases tab, select the ‘+’ button and then select ‘FileMaker Connection with User Login’.

The ‘FileMaker Connection with User Login’ dialogue window will open. This is the connection that is based on the accounts.

1. Name the Connection Name ‘Photos_accounts’.
2. Add your FileMaker server address. Ex. 192.168.1.4
3. The username and password for a user based login is still required. This is the username and password for any valid user that can access the database from the web. Dreamweaver needs this in order to give you the database information from this connection. It will not actually be used on the web. This is not the account the user name and password that users will use to login on the website. This is information required by Dreamweaver to access the database. Enter webuser and webpass. These are the username and passwords set up to work with the sample database.
4. Next, select the fotorama database from the list.

Image 14 – 4: Select the fotorama database to work with the examples in this book

1. The completed FileMaker Connection should look like this.

Image 14 – 5: Completed FileMaker Connection with User Login

1. The ‘Photos_account’ Database Connection should now show up under the Databases tab.

Image 14 – 6: Photos_account database connection displayed under the Databases tab.

Now that the connection is in place, I’ll describe how the pages are protected. FMStudio automates the page protection for you. However there is one very important thing to keep in mind, FMStudio protects a page if it uses a login based connection. So, if you have a recordset, a query or anything else that actually requires information from that connection – and it is a login based connection that page becomes protected. This is true for both account and table based login systems.

Even though FMStudio creates a login.php page for you, which you can decorate with your login instructions, do not ever link directly to login.php. Always link to the protected page and if the user is not authorized, FMStudio will take care of it, and take them to the login page automatically.

So now, we will protect this page, ‘account_photographer.php’ with an account based login. Remember the first step is creating a search, so that means, you guessed it, a recordset.

1. Start by creating a new recordset. So what should we find? Let’s find the currently logged in user and display some information about them. Name the new recordset ‘photographer’.
2. Select the protected connection, which in this case is ‘Photos_account’.
3. Select the layout ‘photographers’.

Next, we need to decide how to find this particular photographer. FMStudio provides 2 bindings or fields that you can use with a login. This is the username and the password. If the supplied username and password appears in one of the tables, you can use it in a search. In this case, we will find the photographer using an exact match for their email address, which is also their username in the database.

1. Under Add Criterion – select ‘email’ from the drop down list and then click the ‘Add’ button.
2. The Variable Selector dialogue window will open. Under Type, select ‘User Login (Photos_account)

Image 14 – 7: Use the User Login (Photos_account) for the Type

1. Next, select User Name from the next drop down menu.
2. Make it an exact search by selecting the double equal ‘= =’ operation and by disabling wildcards.

Image 14 – 8: Completed Variable Selector Dialogue Window

Now with that in place, the recordset is ready.

Image 14 – 9: Completed photographer Recordset

Now, Let’s set up a single record table to display the results.

1. Select Server Behaviors > Wizards > Single Record Table. The Single Record dialogue window will appear
2. Name the table ‘results’ use the ‘photographer’ recordset, and leave the table attributes to their default values.
3. In the field section, click the ‘+’ button beside the word ‘Add’ to add all of the fields. Click on ‘photoPrice’ and press the ‘-‘button to delete this field and the ‘photographer_Photo’ field as well.

Image 14 – 10: Single Record Table with all of the fields added. Press the ‘-‘ delete key to delete ‘photographer_Photo’ and ‘photoPrice’.

1. Next, click just above the single record table and type the words ‘Photographer Profile –‘
2. Select Bindings > User Login (photos_account) select the ‘User Name binding, and drag it beside the text ‘Photographer Profile – ‘and make it part of the header. Select the text and the binding and add a style of heading 1.

Image 14 – 11: Drag and Drop the User Name beside the ‘Photographer Profile-‘ text.

Image 14 – 12: Apply a style heading of 1 to the ‘Photographer Profile’ text and the ‘Login(Photos_account).user binding.

1. As you can see from the screenshot, the login binding is not part of the actual recordset but it dynamically contains the currently logged in user name, in your system.
2. To make sure this page is working correctly, save it, and then preview it in your browser.
3. When you preview the page, you should automatically be redirected to the login page.

Image 14 – 13: Login Page awaiting your credentials

So users must login with a valid account from the ‘fotorama.fp7’ database in order to enter the website

.

1. Use ‘rmitchell@itakephotos.com’ as the username and the password of Ryan1234 as these are valid accounts already set up in the photorama.fp7 database.

Image 14 – 14: Use ‘rmitchell@itakephotos.com’ and ‘1234Ryan’ as the credentials.

1. Once the correct credentials are entered, we are immediately taken to Ryan’s record.

Image 14 – 15: Ryan Mitchell’s Record Detail

This is the single record profile in our recordset. That is how easy it is to create an account based login.

Let’s review the three steps.

1. Create the accounts in your database and assign the web extended privileges to them.
2. Create a database connection with a user based login
3. Use that database connection inside of a database or query on a page, and the page will be automatically protected by code created by FMStudio. Ah life couldn’t be any easier. Moving on to Table based login systems.

Table Based Login Systems

Next, let’s take a look at table based login systems. Table based logins work on the principle of selecting a layout and two fields for the login. In this example, using the ‘photorama.fp7’ database, choose the name and the password field to log the user in. Note that these are not real FileMaker accounts; they are just records in the database. An exact search will determine if the user is valid or not.

Image 14 – 16: Use the Name and Password fields and the login credentials

1. Start by creating a new page named ‘table_photographer.php’. Save this page.
2. Since this page will be protected by a table based login, we need to select ‘FileMaker Connection with Table Based Login’ from the Databases tab.

Image 14 – 17: Select Databases > ‘+’ FileMaker Connection with Table Based Login

The FileMaker Connection with Table Based Login dialogue window will appear.

1. Name the connection ‘Photos_table’ and enter the FileMaker server address.
2. With table based logins you do not need an actual FileMaker account. The ‘webuser’ account is used to connect to the database and permit a search within the users table.
3. Add the username and password and then select the database ‘photorama.fp7’

Image 14 – 18: Select the fotorama database from the list

1. Once the database is selected, at the bottom of the dialogue window you should see a list of layouts and fields from the database. Select the layout that contains all of the users. In this case it is the ‘photographers’ layout.
2. Next select the field that represents the username. In this case, it is the ‘name’ field.
3. Next, select the field for the password.

Image 14 – 19: Competed FileMaker Connection Table

Now that the database connection is set up, we need to find the photographer and then display their information. To do this we will need to create a recordset.

1. Create a new recordset named ‘photographer’ and use the ‘Photos_table’ connection. This decides which connection manages the login on this page.
2. Choose the ‘photographers’ layout and choose the name field from the ‘Add Criterion’ drop down menu.
3. Click the ‘Add’ button and select ‘Table Login (Photos_table)’ from the Type drop down.

Image 14 – 20: Select Table Login (Photos_table) from the ‘Type’ drop-down list.

1. Select ‘User Name’ from the Name drop down menu. Make sure that it is an exact search by selecting the (= =), and that wildcards are disabled.
2. To make this login even more secure, also search on the password field. This is as simple as selecting ‘password’ from the ‘Add Criterion’ drop down menu. Select ‘Add’ ‘Table Login (Photos_table)’ from the Type drop down.
3. Select ‘Password’ from the Name drop down menu. Make sure that it is an exact search by selecting the (= =) operator, and that wildcards are disabled.

Image 14 – 21: The Find Criterions should be set to the ‘name’ and ‘password’ fields.

1. Once the photographer is found, add a single record table to display their details. Server Behaviors > Wizards > Single Record Table. The Single Record Table dialogue window will appear.
2. Name the table ‘results’ use the ‘photographer’ recordset, and leave the table attributes to their default values.
3. In the field section, click the ‘+’ button beside the word ‘Add’ to add all of the fields. Click on ‘photoPrice’ and press the ‘-‘button to delete this field also repeat this process to delete the ‘photographer_Photo’ field as well.

Image 14 – 22: Single Record Table with all fields added except for: ‘photoPrice’ and ‘photographerPhoto’.

1. Next, click just above the single record table and type the words ‘Photographer Profile –‘Make sure that the text is added inside the grey outline.
2. Select Bindings > Table Login(Photos_table) drag the ‘User Name’ binding beside the ‘Photographer Profile –‘ text.

Image 14 – 23: Select Table Login (Photos_table) and then click on the User Name binding.

1. Select the binding and the text and apply a style of heading 1. The page should look like the screenshot below.

Image 14 – 24: Drag and Drop the ‘Login(photos_Table).user binding beside the ‘Photographer Profile –‘ text’ and apply a style heading of 1.

1. Make sure this page is functioning correctly, by saving the page and then previewing it in your browser.

1. The new page should have two fields requesting a User Name and a Password.

Image 14 – 25: Table based login requesting a User Name and a Password

1. Since this is an exact search, for the username, enter the full name of the photographer, the way it is displayed in the field in FileMaker.
2. Once the correct username and password are entered you should be taken to the ‘table_photographer.php’ page and Ryan Mitchell’s record. When Ryan Mitchell’s record displays, you will have successfully logged in.

Image 14 – 26: Detail record for photographer Ryan Mitchell

Now that we have successfully logged in, the last thing that needs to be covered is logging out. This is a very easy process with FMStudio. FMStudio conveniently provides a Server Behavior called ‘Logout Link’.

Creating a Logout Link

1. In Dreamweaver, return to ‘table_photographer.php’ and underneath the table, press the enter key a couple times. This will give you enough space to type the word ‘Logout’ under the table.
2. Next, hi-light the text and go to Server Behaviors > Links > Logout Link. The Logout Link dialogue window will open. The Logout Link Connection asks you what link to logout.
3. In this case it is the ‘Photos_table’ connection. You can also choose to redirect the visitor to the site to another page once they logout. This is done by simply adding a page such as ‘thankyou.php’. In this example we will leave this blank.

Image 14 – 27: Logout Link Dialogue Window

1. Now that the logout link is in place, test the page out in your browser. Before launching the page however, make sure the page is saved so all changes will take effect.

Image 14 – 28: Click the Logout link to logout

Since we did not include a redirect page, we will be automatically taken back to the login page. Even if your visitor tries to be sneaky and type ‘table_photographer.php’ in the address bar to get back to the site without logging in, they will automatically be redirected back to the login page.

This is a quick but powerful way to add customization and access control to your databases.

There are a few finishing notes that we would like to add to this chapter. The first deals with using multiple login connections on the same page.

We highly discourage using multiple login connection schemes on the same page. This is true even if the databases use the same information, and have the same usernames and passwords. If you use more than one login scheme on one of your pages, it will require the user to go through the login process multiple times, until the username for all of those logins are satisfied.

Another question that comes up often refers to using a separate database connection for the login, while you have your data in a different database file. The easiest way to protect a single database with a login, is to keep it all within 1 FileMaker file. If you do have multiple database files simply include the users table into that file as an external table occurrence and then create a layout with the users inside of the file that you want to protect. That way you are concentrating everything into a single file.

See Also

• FMStudio Complete Guide Table of Contents