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
- login1.png (2.3 kB) - added by niko 3 years ago.
- login2.png (4.4 kB) - added by niko 3 years ago.
- login3.png (3.6 kB) - added by niko 3 years ago.
- login4.png (1.5 kB) - added by niko 3 years ago.
- login5.png (3.3 kB) - added by niko 3 years ago.
- login6.png (1.5 kB) - added by niko 3 years ago.
- login7.png (1.7 kB) - added by niko 3 years ago.
- login8.png (2.3 kB) - added by niko 3 years ago.








