Create a Standalone Login Screen

Web User Authentication presents a log-in screen before an end-user can access protected DataPages.  Sometimes you may want to provide separate log-in screen on a web page without any DataPages, such as your home page.  This article explains how you can create a detached log-in DataPage which, upon successful log-in, directs end-users to another URL automatically.

Steps to create a standalone log-in DataPage:

1. Create an HTML DataPage in your authenticated folder

In the Caspio Bridge Explorer window proceed to the DataPage view, open the folder that contains your password-protected DataPages.  Create a new HTML DataPage in this folder by clicking the New DataPage button and selecting Custom, HTML Page type.

2. Use JavaScript to redirect the end-user

The HTML DataPage wizard only has one step.  After choosing HTML Page the next screen contains an empty panel where you can enter HTML.  Add the following JavaScript code (you can copy and paste the code from the area at the end of this article).  Replace the “URL” portion (in red) with your desired URL destination.  Once your end-user passes the log-in screen, this code will automatically redirect them to the URL of your choosing.  In this example we are directing the end-user to a member's area web page.

3. Deploy the HTML DataPage

Now you can deploy the HTML DataPage to your web page.  Keep in mind that after a user has logged in, they will no longer be able to view the original web page.  They will be redirected immediately to the specified destination URL.  It is a good idea to duplicate access to unprotected functionality on the destination web page.