サイトのトップへ戻る

Google App Engine ドキュメント日本語訳




アプリケーションのコードとUIを追加する

この項目ではGoogle アカウントと統合されたアプリを作成するので、ユーザーは自分のGoogle アカウントを使ってアプリにログインできます。 アプリはApp Engine Users サービスを使ってGoogle アカウントと統合することができます。 これを使って、アプリの挨拶文をパーソナライズできます。

以下は、この項目が完了した時にできるアプリです:

Hello_UI

リクエストハンドラを実装するための二つの方法を見ていきましょう:



JSP テンプレートを作成する

では、簡単な JSP テンプレートを使って始めてみましょう。guestbook/src/main/webapp内で、中身が以下のようになっているguestbook.jsp という名前のファイルを作成します。:

phase1/src/main/webapp/guestbook.jsp
View on GitHub 
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ page import="com.google.appengine.api.users.User" %>
<%@ page import="com.google.appengine.api.users.UserService" %>
<%@ page import="com.google.appengine.api.users.UserServiceFactory" %>
<%@ page import="java.util.List" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>

<html>
<head>
    <link type="text/css" rel="stylesheet" href="/stylesheets/main.css"/>
</head>

<body>

<%
    String guestbookName = request.getParameter("guestbookName");
    if (guestbookName == null) {
        guestbookName = "default";
    }
    pageContext.setAttribute("guestbookName", guestbookName);
    UserService userService = UserServiceFactory.getUserService();
    User user = userService.getCurrentUser();
    if (user != null) {
        pageContext.setAttribute("user", user);
%>

<p>Hello, ${fn:escapeXml(user.nickname)}! (You can
    <a href="<%= userService.createLogoutURL(request.getRequestURI()) %>">sign out</a>.)</p>
<%
} else {
%>
<p>Hello!
    <a href="<%= userService.createLoginURL(request.getRequestURI()) %>">Sign in</a>
    to include your name with greetings you post.</p>
<%
    }
%>


<form action="/guestbook.jsp" method="get">
    <div><input type="text" name="guestbookName" value="${fn:escapeXml(guestbookName)}"/></div>
    <div><input type="submit" value="Switch Guestbook"/></div>
</form>

</body>
</html>

既定では、webapp/内やWEB-INF/以外のサブディレクトリ内にあるファイル拡張子.jspを持つファイルは、 ファイル名を含む .jsp へのパスで構成されたURLパスに自動的に紐付けられます。 この JSP ファイルは自動的に/guestbook.jspのURLに紐付けられます。

このJSP ではApp Engine Users サービス用のライブラリをインポートし、そのサービスを呼び出してユーザーがログインしているかを判別し、 ユーザーの"ニックネーム" を取得し、ユーザーがログインやログアウトする際に使うURLを計算します。

このテンプレートでは CSS ファイルを使用します。guestbook/src/main/webapp内にstylesheetsという名前のディレクトリを作成してください。 この新ディレクトリ内で、中身が以下のようになっているmain.cssという名前のファイルを作成します:

phase1/src/main/webapp/stylesheets/main.css
View on GitHub 
body {
    font-family: Verdana, Helvetica, sans-serif;
    background-color: #FFFFCC;
}


デベロップメントサーバ上でアプリをテストする

特に変更しなくても、App Engine デベロップサーバ上でこのJSP ファイルをテストできます。 guestbook ディレクトリから以下の Maven コマンドを実行します:


mvn appengine:devserver

以下のような成功のメッセージが表示されるまで待ちます:

[INFO] INFO: Module instance default is running at http://localhost:8080/
[INFO] Apr 29, 2015 3:28:38 PM com.google.appengine.tools.development.AbstractModule startup
[INFO] INFO: The admin console is running at http://localhost:8080/_ah/admin
[INFO] Apr 29, 2015 3:28:38 PM com.google.appengine.tools.development.DevAppServerImpl doStart
[INFO] INFO: Dev App Server is now running

ブラウザで以下のURLを開きます:

http://localhost:8080/guestbook.jsp

このアプリでは、ログインを促すページを表示します。 "Sign in" リンクをクリックすると、任意のEメールアドレスでログインします。 デベロップメントサーバは、テストのためにGoogle アカウントのログイン処理をエミュレートします。 ログインすると、アプリはあなたが入力したEメールアドレスと挨拶文を表示します。

http://localhost:8080 (パスを付けず)URLを開くとエラーが返るのが分かるでしょう。 今のところは、guestbook/src/main/webapp/内でこのファイルを作成することで、/guestbook.jspURLパスのハンドラのみを定義しています。 次の項目では、さらにURハンドラを設定します。

ControlキーとCキーを押すことでデベロップメントサーバを終了できます。



サーブレットクラスを作成する

App Engine Java アプリケーションはJava Servlet APIを使ってウェブサーバとやり取りできます。 前述のように、JSP ファイルは自身のファイル名に似たURLパスに紐付けられたサーブレットとして動作します。 Java servletクラスを使ってサーブレットを実装することもできます。 servlet クラスはjavax.servlet.GenericServlet クラスや javax.servlet.http.HttpServlet クラスに継承されています。

guestbook/src/main/java ディレクトリ内では、com/example/guestbookと呼ばれるサーブレットクラス用のパッケージパスを作成します。 Linux や Mac OS Xでは、以下のコマンドが実行できます:


mkdir -p com/example/guestbook

この新ディレクトリ内で、以下のような中身の GuestbookServlet.javaという名前のファイルを作成します。:

phase1/src/main/java/com/example/guestbook/GuestbookServlet.java
View on GitHub 
package com.example.guestbook;

import com.google.appengine.api.users.User;
import com.google.appengine.api.users.UserService;
import com.google.appengine.api.users.UserServiceFactory;

import java.io.IOException;
import java.util.Properties;

import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

public class GuestbookServlet extends HttpServlet {
  @Override
  public void doGet(HttpServletRequest req, HttpServletResponse resp)
      throws IOException {
    if (req.getParameter("testing") == null) {
      resp.setContentType("text/plain");
      resp.getWriter().println("Hello, this is a testing servlet. 

");
      Properties p = System.getProperties();
      p.list(resp.getWriter());

    } else {
      UserService userService = UserServiceFactory.getUserService();
      User currentUser = userService.getCurrentUser();

      if (currentUser != null) {
        resp.setContentType("text/plain");
        resp.getWriter().println("Hello, " + currentUser.getNickname());
      } else {
        resp.sendRedirect(userService.createLoginURL(req.getRequestURI()));
      }
    }
  }
}

この時点で、あなたのプロジェクトのディレクトリ構造は以下のようになります:

Simple Hello World



URL パスを設定する

サーブレットエンジンは、各サーブレットクラスへのURLパスを知っている必要があります。 デプロイメントディスクリプタ(web.xmlという名前のファイル)を使ってこれを設定します。

guestbook/src/main/webapp/WEB-INF ディレクトリ内に web.xml を置き、このファイルを以下のような中身になるよう編集します:

phase1/src/main/webapp/WEB-INF/web.xml
View on GitHub 
<?xml version="1.0" encoding="utf-8"?>
<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="http://java.sun.com/xml/ns/javaee"
  xmlns:web="http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"
  xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd"
  version="2.5">
  <servlet>
    <servlet-name>guestbook</servlet-name>
    <servlet-class>com.example.guestbook.GuestbookServlet</servlet-class>
  </servlet>
  <servlet-mapping>
    <servlet-name>guestbook</servlet-name>
    <url-pattern>/guestbook</url-pattern>
  </servlet-mapping>
  <welcome-file-list>
    <welcome-file>guestbook.jsp</welcome-file>
  </welcome-file-list>
</web-app>

デプロイメントディスクリプタは三つのことを行います:

  • <servlet> ディレクティブで、GuestbookServlet クラスは guestbookという名前のサーブレットだと宣言します。
  • <servlet-mapping> ディレクティブで、guestbook サーブレットと URL パス /guestbookを関連付けます。
  • <welcome-file-list> ディレクティブで、あなたが作成したJSP ファイルを使ってホームページ宛のリクエストを処理するよう、サーバに指示します。

デベロップメントサーバがまだ起動している場合はControl-Cキーで停止させ、 それから再起動します。(再び guestbook ディレクトリから起動します):


mvn appengine:devserver

GuestbookServlet クラスの結果を表示するために、/guestbook URLを開きます:

http://localhost:8080/guestbook

以下のサーブレットでは、getParameter()メソッドでクエリーパラメータを読み取る方法のデモンストレーションをしています。 URLに testingパラメータを追加してこれを試してみてください。:

http://localhost:8080/guestbook?testing

ルートURL(/) を開いてこのホームページに現在使用されているJSPファイルを表示することもできます:

http://localhost:8080/

次の項目に進み、永続的なデータストレージ機能をguestbook アプリに追加します。

データストアにデータを保存する >>