HowTo: Implementation of Login in Demo2

Introduction

In this HowTo we will implement

  • a loginform
  • Display of loginform / current user depending on userstatus
  • The possibility to log out

Used files

These files could be modified with a nomral texteditor (for ex. the Windows editor) INSTALLATIONSDIR\webroot\demo2\includes\top.ijsp

Login HTML-Form

We want to implement the loginform at the place where there is currently the username. With the method core.getUserName() we can determine the current user:

top.ijsp line 100:

<td class="greybox">
  <!-- content-->
  <%=core.getUserName()%>
  <!-- End content -->
</td>

top.ijsp line 100:

<td class="greybox">
  <!-- content-->
  <%=core.getUserName()%>
  <form method="post">
    Name:<br>
    <input name="Login_username"><br>
    Password:<br>
    <input type="password" name="Login_userauth"><br>
    <input type="submit" name="Login_createEntry" value="Einloggen">
  </form>
  <!-- End content -->
</td>

The names of the inputfields could be found in the Core-Implementationdocumentation.

Login

The form doesn't contain functionality by itself - so we have to implement it in the JSP. First we have to initialize the login module:

top.ijsp line 1:

<%
  Login login = new Login(core);
%>
<html>  
  <head>

Then we call the function createEntry of the module login. This function logs-in a user:

top.ijsp line 1:

<%
  Login login = new Login(core);
  login.createEntry();
%>
<html>  
  <head>

Now it is possible to log-in with a valid username.

When the username is shown, one can see that the login was successful.

Don't show the login-form anymore

Although logged in, the login form is still visible. Furthermore the display of the guestusername is not very beautiful. To make certain HTML invisible - depending on the userstatus (logged in / not logged in) we use the function core.isLoggedOn():

top.ijsp line 103:

<td class="greybox">
<!-- content-->
<%
  if (core.isLoggedOn())
  {
    out.print (core.getUserName());
  }
  else
  {
%>
<form method="post">
  Name:<br>
  <input name="Login_username"><br>
  Password:<br>
  <input type="password" name="Login_userauth"><br>
  <input type="submit" name="Login_createEntry" value="Einloggen">
</form>
<%
  }
%>
<!-- End content -->
</td>

With the same technique we could also change the header:

Logout

Another important function is - logout. The easiest method is to build a link around the username:

top.ijsp line 106:

<%
  if (core.isLoggedOn())
  {
    out.print ("< a href='?Login_deleteEntry=true'>"+core.getUserName()+"</a>");
  }
  else

Of course we have to call the corresponding function of the login module:

top.ijsp line 1:

<%
  Login login = new Login(core);
  login.createEntry();
  login.deleteEntry();
%>

Now the logout works. But after that it isn't possible to login again. The reason for this lies in how the loginform and the link work together: On one page the URL is still:

on the other page the logindate is sent via POST. This means that the login module receives the login and logoutcommand at the same time. For this problem there exist 3 solutions

Exchange functions

top.ijsp line 1:

<%
  Login login = new Login(core);
  login.deleteEntry();
  login.createEntry();
%>

Now the deleteEntry function will be called and the user will be logout (which won't be a problem for a guest) - the login is done afterwards. Now we don't have any conflicts, even if both functions are called. This is the simplest and nicest solution.

Change the login-form to get

top.ijsp line 111:

  else
  {
%>
<form method="get">
  Name:<br>

This solution is not recommendable, because username and password are visible in the adressline.

Creation of a login-form with post

top.ijsp line 105:

<!-- content-->
<%
  if (core.isLoggedOn())
  {
%>
  <form method="post" name="logoutform">  
    <input type="hidden" name="Login_deleteEntry">
;     <a href="JavaScript:logoutform.submit()"><%=core.getUserName()%></a>
  </form>
<%
  }
  else

This method works, but is in any case more complicated than method 1.

The changed parts of the final top.ijsp

line 1:

<%
  Login login = new Login(core);
  login.deleteEntry();
  login.createEntry();
%>
<html>  
  <head>

line 100:

<td class="greybox">
<!-- content-->
<%
  if (core.isLoggedOn())
  {
    out.print (core.getUserName());
  }
  else
  {
%>
<form method="post">
  Name:<br>
  <input name="Login_username"><br>
  Password:<br>
  <input type="password" name="Login_userauth"><br>
  <input type="submit" name="Login_createEntry" value="Einloggen">
</form>
<%
  }
%>
<!-- End content -->
</td>

Attachments