Wednesday, June 25, 2014

Re: Making browser save userneme & password

Greetings,

Thank you again for your response.  I am trying to implement what you gave me.  It does remember the password now, but it has other, significant problems as follows:

1.  when I submit the form, it shows the user name and password in the browser URL bar as URL arguments, i.e.:


2.  Also, perhaps related, it seems to execute the login code correctly but the subsequent GWT code isn't getting displayed.  This might be unrelated and because I am not setting the form to invisable.

3.  You have a line in your HTML file:

<script type="text/javascript" language="javascript" src="pleasesavemypassword/pleasesavemypassword.nocache.js"></script>

I don't have anything like it.  Perhaps this is my problem.  I don't understand what it is for.

Thanks for the help!

Blake




On Mon, Jun 9, 2014 at 12:39 AM, Saumar Hajjar <saumar@gmail.com> wrote:
Working example
PleaseSaveMyPassword.html:
<!doctype html>
<html>
  <head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <title>Please Save My Password</title>
    <script type="text/javascript" language="javascript" src="pleasesavemypassword/pleasesavemypassword.nocache.js"></script>
    <style>
h1 {font-size: 2em; font-weight: bold; color: #777777; margin: 40px 0px 70px; text-align: center;}
#gwt, table {width: 100%;}
.loginPanel {width: 300px; margin: 0 auto; border: 1px solid #ccc; border-radius: 5px;}
input {width: 200px; float: right;}
button {width: 80px; float: right;}
.loggedInPanel {width: 300px; margin: 0 auto; font-size: 1.5em;}
.gwt-HTML {float: left;}
a {float: right;}
</style>
  </head>
  <body>
    <h1>Please Save My Password</h1>
    <div id="gwt"></div>
<div id="login" style="display: none;">
<form id="login_form" action="javascript:;">
<input type="text" name="username" id="login_username" />
<input type="password" name="password" id="login_password" />
<button type="submit" id="login_submit"></button>
</form>
</div>    
  </body>
</html>

PleaseSaveMyPassword.java:
package com.sh.pleasesavemypassword.client;

import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.core.client.GWT;
import com.google.gwt.event.dom.client.ClickEvent;
import com.google.gwt.event.dom.client.ClickHandler;
import com.google.gwt.user.client.DOM;
import com.google.gwt.user.client.Window;
import com.google.gwt.user.client.rpc.AsyncCallback;
import com.google.gwt.user.client.ui.Anchor;
import com.google.gwt.user.client.ui.Button;
import com.google.gwt.user.client.ui.FlexTable;
import com.google.gwt.user.client.ui.FlowPanel;
import com.google.gwt.user.client.ui.FormPanel;
import com.google.gwt.user.client.ui.FormPanel.SubmitEvent;
import com.google.gwt.user.client.ui.FormPanel.SubmitHandler;
import com.google.gwt.user.client.ui.HTML;
import com.google.gwt.user.client.ui.Label;
import com.google.gwt.user.client.ui.PasswordTextBox;
import com.google.gwt.user.client.ui.RootPanel;
import com.google.gwt.user.client.ui.SubmitButton;
import com.google.gwt.user.client.ui.TextBox;

public class PleaseSaveMyPassword implements EntryPoint {
private static final BackendServiceAsync backend = GWT.create(BackendService.class);
private static class LoginForm extends FlowPanel {
private static LoginForm instance = null;
private static final TextBox txtUser = TextBox.wrap(DOM.getElementById("login_username"));
private static final PasswordTextBox txtPassword = PasswordTextBox.wrap(DOM.getElementById("login_password"));
private static final Button btnSubmit = SubmitButton.wrap(DOM.getElementById("login_submit"));
private static final FormPanel form = FormPanel.wrap(DOM.getElementById("login_form"));
public static LoginForm getInstance() {
if (instance == null) {
instance = new LoginForm();
}
return instance;
}
private LoginForm() {
setStyleName("loginPanel");

FlexTable table = new FlexTable();
table.setWidget(0, 0, new Label("User:"));
table.setWidget(0, 1, txtUser);
table.setWidget(1, 0, new Label("Password:"));
table.setWidget(1, 1, txtPassword);
btnSubmit.setText("Login");
table.setWidget(2, 1, btnSubmit);
form.setWidget(table);
add(form);
form.addSubmitHandler(new SubmitHandler() {
@Override
public void onSubmit(SubmitEvent event) {
btnSubmit.setEnabled(false);
backend.login(txtUser.getText(), txtPassword.getText(), new AsyncCallback<String>() {
@Override
public void onFailure(Throwable caught) {
Window.alert(caught.getMessage());
btnSubmit.setEnabled(true);
}

@Override
public void onSuccess(String result) {
if (result == null) {
Window.alert("Invalid username or password");
btnSubmit.setEnabled(true);
}
else {
// This is the only I've found that makes Chrome happy:
Window.Location.reload();
//  IE and FF don't require this reload thing.
// showLoggedInContents(result);
}
}
});
}
});
}
}
public void onModuleLoad() {
// check if the user is already logged in
backend.getLoggedInUser(new AsyncCallback<String>() {
@Override
public void onSuccess(String result) {
if (result == null)
showLoginForm();
else
showLoggedInContents(result);
}
@Override
public void onFailure(Throwable caught) {
Window.alert(caught.getMessage());
}
});
}
private void showLoginForm() {
RootPanel.get("gwt").clear();
RootPanel.get("gwt").add(LoginForm.getInstance());
}
public static void showLoggedInContents(String user) {
FlowPanel loggedInPanel = new FlowPanel();
loggedInPanel.setStyleName("loggedInPanel");
HTML html = new HTML("Hello, <strong>" + user + "</strong>");
loggedInPanel.add(html);
Anchor a = new Anchor("Logout");
a.addClickHandler(new ClickHandler() {
@Override
public void onClick(ClickEvent event) {
backend.logout(new AsyncCallback<Void>() {
@Override
public void onFailure(Throwable caught) {
Window.alert(caught.getMessage());
}

@Override
public void onSuccess(Void result) {
Window.Location.reload();
}
});
}
});
loggedInPanel.add(a);
RootPanel.get("gwt").add(loggedInPanel);
}
}
BackendServiceImpl.java:
package com.sh.pleasesavemypassword.server;

import com.google.gwt.user.server.rpc.RemoteServiceServlet;
import com.sh.pleasesavemypassword.client.BackendService;

@SuppressWarnings("serial")
public class BackendServiceImpl extends RemoteServiceServlet implements BackendService {

@Override
public String getLoggedInUser() {
return (String) getThreadLocalRequest().getSession().getAttribute("user");
}

@Override
public String login(String user, String password) {
if (password.equals("ta7yasoorya")) {
getThreadLocalRequest().getSession().setAttribute("user", user);
return user;
}
return null;
}

@Override
public void logout() {
getThreadLocalRequest().getSession().removeAttribute("user");
}

}


Em domingo, 8 de junho de 2014 23h17min43s UTC-3, Blake escreveu:
On Sat, Jun 7, 2014 at 5:29 PM, Jens <jens.ne...@gmail.com> wrote:
 Other than that you should follow your original approach and let the browser/password manager ask the user to store the password.

That is clearly the best and my preferred approach.  The problem is that no person and no web site has stated they know how to do it (in a way that supports most modern browsers), and here is specifically how it is done (a working example).  The web sites have many half solutions, and I have seen many "try this" solutions.  I am weaker than most in this technology, and I am a bit lost.  I think the only thing that is going to help me is a working example.

Thanks.

Blake

--
You received this message because you are subscribed to the Google Groups "Google Web Toolkit" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-web-toolkit+unsubscribe@googlegroups.com.
To post to this group, send email to google-web-toolkit@googlegroups.com.
Visit this group at http://groups.google.com/group/google-web-toolkit.
For more options, visit https://groups.google.com/d/optout.

--
You received this message because you are subscribed to the Google Groups "Google Web Toolkit" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-web-toolkit+unsubscribe@googlegroups.com.
To post to this group, send email to google-web-toolkit@googlegroups.com.
Visit this group at http://groups.google.com/group/google-web-toolkit.
For more options, visit https://groups.google.com/d/optout.

No comments:

Post a Comment