GWT での Google App Engine のユーザー認証の実装例

GWT から Google App Engine の Google Accounts 認証を利用するときは、GWT RPC を組み合わせると簡単です。

ログイン GWT RPC の作成

GWT の client パッケージに次の内容を LoginInfo.java として作成します。パッケージ名は適当に変えてください。

package com.appspot.mywebfeeds.client;

import java.io.Serializable;

@SuppressWarnings("serial")
public class LoginInfo implements Serializable {

  private boolean loggedIn = false;
  private String loginUrl;
  private String logoutUrl;
  private String email;
  private String nickname;
  
  public boolean isLoggedIn(){
    return loggedIn;
  }
  
  public void setLoggedIn(boolean loggedIn){
    this.loggedIn = loggedIn;
  }
  
  public String getLoginUrl(){
    return loginUrl;
  }
  
  public void setLoginUrl(String loginUrl){
    this.loginUrl = loginUrl;
  }
  
  public String getLogoutUrl(){
    return logoutUrl;
  }
  
  public void setLogoutUrl(String logoutUrl){
    this.logoutUrl = logoutUrl;
  }
  
  public String getEmail(){
    return email;
  }
  
  public void setEmail(String email){
    this.email = email;
  }
  
  public String getNickname(){
    return nickname;
  }
  
  public void setNickname(String nickname){
    this.nickname = nickname;
  }
  
}

GWT の client パッケージに、LoginService インターフェイスを作ります。(LoginService.java)

package com.appspot.mywebfeeds.client;

import com.google.gwt.user.client.rpc.RemoteService;
import com.google.gwt.user.client.rpc.RemoteServiceRelativePath;

@RemoteServiceRelativePath("login")
public interface LoginService extends RemoteService {
  public LoginInfo login(String requestUri);
}

Async インターフェイスを作ります (LoginServiceAsync.java)。

package com.appspot.mywebfeeds.client;

import com.google.gwt.user.client.rpc.AsyncCallback;

public interface LoginServiceAsync {
  public void login(String requestUri, AsyncCallback<LoginInfo> async);
}

サーバー側の LoginService の実装を作ります。GWT server パッケージに、LoginServiceImpl.java とします。

package com.appspot.mywebfeeds.server;

import com.appspot.mywebfeeds.client.LoginInfo;
import com.appspot.mywebfeeds.client.LoginService;
import com.google.appengine.api.users.User;
import com.google.appengine.api.users.UserService;
import com.google.appengine.api.users.UserServiceFactory;
import com.google.gwt.user.server.rpc.RemoteServiceServlet;

@SuppressWarnings("serial")
public class LoginServiceImpl extends RemoteServiceServlet implements
    LoginService {

  public LoginInfo login(String requestUri) {

    UserService userService = UserServiceFactory.getUserService();
    User user = userService.getCurrentUser();
    LoginInfo loginInfo = new LoginInfo();
    
    if(user!=null){
      loginInfo.setLoggedIn(true);
      loginInfo.setEmail(user.getEmail());
      loginInfo.setNickname(user.getNickname());
      loginInfo.setLogoutUrl(userService.createLogoutURL(requestUri));
    }
    else{
      loginInfo.setLoggedIn(false);
      loginInfo.setLoginUrl(userService.createLoginURL(requestUri));
    }
    
    return loginInfo;
  }

}

上記を作成して、web.xml は次のように設定します。

  <servlet>
    <servlet-name>loginService</servlet-name>
    <servlet-class>com.appspot.mywebfeeds.server.LoginServiceImpl</servlet-class>
  </servlet>
  
  <servlet-mapping>
    <servlet-name>loginService</servlet-name>
    <url-pattern>/mywebfeeds/login</url-pattern>
  </servlet-mapping>

上記のログインサービスの実装はほぼ決まりきったものになります。

» GWT RPC - LoginService (gwt-appengine-user-service.zip) 1.9 KB

ログイン GWT RPC の利用

上記のログイン GWT RPC を利用するクライアント例は次のようになります。

package com.appspot.mywebfeeds.client;

import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.core.client.GWT;
import com.google.gwt.user.client.rpc.AsyncCallback;
import com.google.gwt.user.client.ui.Anchor;
import com.google.gwt.user.client.ui.HTML;
import com.google.gwt.user.client.ui.Label;
import com.google.gwt.user.client.ui.RootPanel;
import com.google.gwt.user.client.ui.VerticalPanel;


public class Mywebfeeds implements EntryPoint {

  private LoginInfo loginInfo = null;
  private VerticalPanel loginPanel = new VerticalPanel();
  private VerticalPanel mainPanel = new VerticalPanel();
  private Label loginLabel = new Label("Please sign in to your Google Account.");
  private Anchor signInLink = new Anchor("Sign in");
  private Anchor signOutLink = new Anchor("Sign out");
  
  public void onModuleLoad() {
    
    LoginServiceAsync loginService = GWT.create(LoginService.class);
    loginService.login(
      GWT.getHostPageBaseURL(),
      new AsyncCallback<LoginInfo>(){
        public void onFailure(Throwable error){
        }
        
        public void onSuccess(LoginInfo result){
          loginInfo = result;
          if(loginInfo.isLoggedIn()){
            loadMain();
          }
          else{
            loadLogin();
          }
        }
      }
    );
      
  }

  protected void loadLogin() {
    signInLink.setHref(loginInfo.getLoginUrl());
    loginPanel.add(loginLabel);
    loginPanel.add(signInLink);
    RootPanel.get("main").add(loginPanel);
  }

  protected void loadMain() {
    mainPanel.add(new HTML("<h1>Welcome!</h1>"));
    signOutLink.setHref(loginInfo.getLogoutUrl());
    mainPanel.add(signOutLink);
    RootPanel.get("main").add(mainPanel);
  }
}

ホストページは次の用に記載してあります。

<!doctype html>
<html>
  <head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    <link type="text/css" rel="stylesheet" href="Mywebfeeds.css">
    <title>My Web Feeds</title>
    <script type="text/javascript" language="javascript" 
src="mywebfeeds/mywebfeeds.nocache.js"></script>
  </head>
  <body>
    <iframe src="javascript:''" 
id="__gwt_historyFrame" tabIndex='-1' 
style="position:absolute;width:0;height:0;border:0"></iframe>  
    <noscript>
      <div>
        Your web browser must have JavaScript enabled
        in order for this application to display correctly.
      </div>
    </noscript>
    <div id="main"></div>
  </body>
</html>