User Login And Logout - Learn JBStrap

User login

Users need to be logged in; this process is explained in this section. You will learn how to create a login page, and how to check their username and password.

Identifying the user, checking passwords

In order to determine if the user can log into the application and what their roles are, you must use a directory such as AD / LDAP. This could be a database table, or an AD or LDAP service. You will also need a method, that can decide if the given username and password are correct, and if so, what data it will need to create the user object. The authentication implementer method must be implemented in a separate class, which must also implement the AuthenticationInterface. This interface requires a method to be specified, the initUser method. This method has two parameters, one of which is the user’s name and the other one is the password. The method must return a CurrentUser class (or a class that extend from the CurrentUser). If the method returns with this class, the authentication is considered successful, if it returns with null, it is unsuccessful.

  Identifying a user. In this example, a mock user is logged in, that has ‘admin’ as its username and password. In this case, there is no need for a user registry, since both the username and password is directly in the code. Please note that this example is for testing purposes only, do not use it on live applications:  
        
import com.jbstrap.core.CurrentUser;
import com.jbstrap.core.authorization.Role;
import com.jbstrap.core.interfaces.AuthenticationInterface;

public class LoginImpl implements AuthenticationInterface {

	@Override
	public CurrentUser initUser(final String username, final String password) {
		if ("admin".equals(username) && "admin".equals(password)) {
			final Role admin = new Role("ADMIN").setName("System administrator");
			return new CurrentUser().setUuid("1")
					.setUserName(username)
					.setName("Administrator")
					.addRole(admin)
					.setCurrentRole(admin);
		}
		return null;
	}
}

This newly created class must be set to the JBStrap AUTHENTICATION parameter, so the framework could use it later.

  Setting the authentication method to the framework:  
        
JBStrap.setParam(JBStrapParamType.AUTHENTICATION, new LoginImpl());

Creating a login page

Creating a login page is one of the first steps in managing users. This page must let the user type in their username and password, so that they can log in. First, you must create a public page, which is placed on a public UI. The page and UI must be public, so the user can access it without logging in. The login page must extend from the BaseLoginPage class. This class provides two methods, that must be used:

checkUser : The method checks the username and password. The authentication method specified in the JBStrap AUTHENTICATION parameter is used.
loginUser : The method registers the logged in user to the framework

You must place a TextItem and PasswordItem component, which are responsible for allowing the user to input their username and password respectively. You will also need a Button component, that will allow the user to begin the login process. If the user clicks on it, the checkUser method should check if the login details are correct. If they are, the checkUser method will return with a CurrentUser class. If they are incorrect, it will return with null. In this case, the user should be informed that they have inputted the wrong username/password.

If the user was successfully identified, the loginUser method should log the user in, and navigate them to the correct landing page.

  Example login page:  
        
import com.jbstrap.core.CurrentUser;
import com.jbstrap.ui.BaseLoginPage;
import com.jbstrap.ui.Icon;
import com.jbstrap.ui.bootstrap.ButtonType;
import com.jbstrap.ui.components.button.Button;
import com.jbstrap.ui.components.enums.NotificationType;
import com.jbstrap.ui.components.form.items.PasswordItem;
import com.jbstrap.ui.components.form.items.TextItem;

public class LoginPage extends BaseLoginPage {

	private TextItem username;
	private PasswordItem password;
	private Button loginBtn;

	@Override
	public void build() {
		username = new TextItem("username", "Username")
				.setPlaceholder("Username");
		password = new PasswordItem("password", "Password")
				.setPlaceholder("Password");
		loginBtn = new Button(Icon.SIGN_IN, "Login", ButtonType.PRIMARY)
				.addClickHandler(event -> processLogin());
		addComponents(username, password, loginBtn);
	}

	private void processLogin() {
		if (username.getValue() == null || username.getValue().isEmpty()) {
			showNotification(NotificationType.WARNING, "The username is required");
			username.setFocus();
		}
		if (password.getValue() == null || password.getValue().isEmpty()) {
			showNotification(NotificationType.WARNING, "The password is required");
			password.setFocus();
		}
		final CurrentUser user = checkUser(username.getValue(), password.getValue());
		if (user == null) {
			showNotification(NotificationType.ERROR, "Incorrect username or password");
		} else {
			loginUser(user);
			getClient().navigateTo("mainPage");
		}
	}
}

The implemented page allows the user to log in to the application. It the login was successful, the user will be navigated to the page, that was assigned the mainPage pageId.

For the framework to know which page must log the user in, the login page must be registered. If you did this, the user, will be directed to the login page if they want to open a page that requires a certain role, or requires them to be logged in.

  Assigning the login page to the loginPage pageId:  
        
JBStrap.addPage("loginPage", PublicUI.class, LoginPage.class);
//Registering the login page to the framework:
JBStrap.setParam(JBStrapParamType.LOGIN_PAGE, "loginPage");

Current user cookie

The JBStrap framework offers user cookies, which help identifying the user. This cookie is enabled by default, with a timeout of 30 minutes. This gives the user plenty of time to return to the application without logging in again, even if they close the browser, as the framework will automatically identify them, if they are within 30 minutes.

The user cookie can be customized using two JBStrap parameters. The first is the USER_COOKIE_TIMEOUT, which sets the timeout. You can specify a different timeout, using minutes. The other parameter is USE_USER_COOKIE, which enables or disables the user cookies. The parameter accepts Boolean values.

  Modifying the User cookie timeout to one day:  
        
JBStrap.setParam(JBStrapParamType.USER_COOKIE_TIMEOUT,1440L);

  Disabling user cookies:  
        
JBStrap.setParam(JBStrapParamType.USE_USER_COOKIE,false);

User logout

The framework provides a built-in method that you can use if you need to log out a previously logged in user. This method can be called anywhere. When called, the user will be logged out, and they can only access public pages, until they log back in. After the logout, the user will be navigated to the page that was specified in the ENTRY_POINT JBStrap parameter.

  Logging out a user who is currently logged in the client:  
        
JBStrap.logoutUser(client);