Vaadin 7 - Login Form?

I’m just starting to look at Vaadin 7 (beta 5) with an eye towards migrating my existing programs from v6.8.4. I see that the LoginForm appears to be completely deprecated - is there a replacement in Vaadin 7 that I can use or do I need to construct my own login form?

thanks,

nbc

The problem with LoginForm was that it was basically built on browser bugs; it doesn’t even work properly on modern browsers. So, yes, I recommend that you build your own login either with normal Vaadin components (which isn’t difficult) or by using e.g. JSP and JAAS authentication (which is more difficult, but has the advantage of the user being able to store their credentials. It is also a lot faster to render and won’t initialize Vaadin resources until after succesful login).

This is little bit off the question but creating login form with JSP is not necessary and you can also do programmatic login using Vaadin components.

All you need is to get current http request, which you can access with VaadinService.getCurrentRequest(). This will return you instance of VaadinRequest which in Servlet environment is castable to HttpServletRequest. In the HttpServletRequest there is login(user, pass) method, which will be handled by the backing web container. There you can configure for example proper JAAS login module or use whatever LDAP or file realm of your choice.

After login you can query HttpServletRequest with isUserInRole and getUserPrincipal, which you can then use in your Vaadin application.

Proper way to do login would then be to create own login view with username and password fields and access current HttpServletRequest to handle login process.

  • Peter

The problem LoginForm really tried to handle was that browsers won’t remember/autocomplete fields which are generated with JavaScript. That was the case at least back then when Vaadin 6 was released. I don’t know about current browser behavior in this regard.

Anyone have any ideas about how browsers behave nowadays, or any other alternatives for “remember my password for this application”?

I have developed a login form add-on that works with all major browsers:


https://vaadin.com/directory#addon/loginform

https://vaadin.com/directory#addon/loginform
This form is deprecated (((

The LoginForm class in the Vaadin core is deprecated, only works for Firefox and has other drawbacks.

My LoginForm add-on has nothing to do with that deprecated class.

Hi Stepan Kachan,
Can you post a sample code how to use your LoginForm add on?

Look at the add-on page. There are two simple examples for it.

I am evaluating Vaadin for future use in our companies applications. The fact that there is no out of the box, supported, high quality login form is a bit of a red flag. I am sure that almost everyone using Vaadin would like to have this capability. Are there any plans to build this capability into a future version?

No native login form is one of the best security features vaadin has. Think about it! :wink:

Hi, maybe it helps you further.

login.html:

LoginForm.java:

import org.slf4j.Logger;
import org.slf4j.LoggerFactory;
import com.vaadin.event.ShortcutAction.KeyCode;
import com.vaadin.server.VaadinSession;
import com.vaadin.ui.Button;
import com.vaadin.ui.CustomLayout;
import com.vaadin.ui.JavaScript;
import com.vaadin.ui.NativeButton;
import com.vaadin.ui.Notification;
import com.vaadin.ui.PasswordField;
import com.vaadin.ui.TextField;
import com.vaadin.ui.Button.ClickEvent;
import com.vaadin.ui.Notification.Type;

public class LoginForm extends CustomLayout {

private static final long serialVersionUID = -5616296878045055217L;
private NativeButton button;
private PasswordField password;
private TextField username;

private static final Logger Log = LoggerFactory.getLogger(LoginForm.class);

public LoginForm(String template) {
    setTemplateName("login");
    addComponent(getUsername(), "username");
    addComponent(getPassword(), "password");
    addComponent(getButton(), "button");
}

private TextField getUsername() {
    if (username == null) {
        username = new TextField();
        username.setCaption("Username");
        username.setInputPrompt("Username");
        username.setId("username");
        JavaScript
                .getCurrent()
                .execute(
                        "document.getElementById('username').setAttribute('autocomplete', 'on')");
        JavaScript
                .getCurrent()
                .execute(
                        "document.getElementById('username').setAttribute('name', 'username')");
    }
    return username;

}

private PasswordField getPassword() {
    if (password == null) {
        password = new PasswordField();
        password.setCaption("Password");
        password.setInputPrompt("Password");
        password.setId("password");
        JavaScript
                .getCurrent()
                .execute(
                        "document.getElementById('password').setAttribute('autocomplete', 'on')");
        JavaScript
                .getCurrent()
                .execute(
                        "document.getElementById('password').setAttribute('name', 'password')");
    }
    return password;
}

private Button getButton() {
    if (button == null) {
        button = new NativeButton("Login");
        button.setId("loginbutton");
        button.setClickShortcut(KeyCode.ENTER);
        button.addClickListener(new Button.ClickListener() {

            private static final long serialVersionUID = 4072697856236455023L;

            @Override
            public void buttonClick(ClickEvent event) {
                /*************************************
                 * do login with username and password
                 *************************************/
                try {
                    doLogin(getUsername().getValue(), getPassword().getValue());
                } catch (Exception e) {
                    Log.error("ERROR", e);
                }
            }
        });
        JavaScript
                .getCurrent()
                .execute(
                        "document.getElementById('loginbutton').setAttribute('type', 'submit')");
        JavaScript
                .getCurrent()
                .execute(
                        "document.getElementById('loginbutton').setAttribute('name', 'loginbutton')");
        JavaScript
                .getCurrent()
                .execute(
                        "document.getElementById('loginbutton').setAttribute('form', 'Form')");

    }
    return button;
}

private void doLogin(final String username, final String password) throws Exception {
    //TODO do login here
}

}

br, Christian

Ingo, you have lots of experience on the subject. Maybe you could spend a moment and modify the “deprecated” LoginForm in the core work like it should (read: like your add-on)? Or maybe somebody else who has both the skills and some time. The steps to
check out the core project
and post patches for review are nowadays much simpler than they used to be.

cheers,
matti

Hi Matti,

In about 2 weeks I’ll have time to take a look at it.

Greetings,

Ingo

Cool, thanks! Let me know if you have any issues with, I’m clad to help!

cheers,
matti

I’m new to Vaadin and I need to “add security” to my app. I’m learing Vaadin 7 and the old login form seems deprecated.
Ingo, did you have time to improve the old login form? What’s the recommended way to handle logins?

Richard

I’m not going to work on porting it to the core in the near future. However, you can use my add-on, it does not really matter for you where the code is located.

Excatly as Ingo said, it shoudn’t really matter whether you are using “core Vaadin” or some of the add-ons. They are all OSS and you are priviliged to take the advantage of it. Just add the dependency to your project, recompile and use it. That add-on has been proven to work by many Vaadin projects, don’t hesitate to use it.

But still, we at Vaadin should really make it easier for third parties to contribute to the core. But we are working on it, and I hope I can tell more about this soon. I’m personally bit ashamed that the LoginForm, a component I implemented for a reason years ago, is now depracated - for wrong reasons, which is proved by Ingo’s add-on. It shouldn’t be trickier to commit to the core than to publish an add-on.

cheers,
matti