JSPタグとJavaBeansの連携

JSPタグでJavaBeansとの連携ができることを知ったのでメモメモ。

Eclipseで動的 Webプロジェクトを作成

Eclipseを立ち上げ、 「新規(N)」>「動的 Webプロジェクト」を選択。

f:id:ts0818:20170904202404j:plain

「プロジェクト名(M)」を入力し、「ワーキング・セット」を利用する場合は、「ワーキング・セットにプロジェクトを追加」などにチェックします。

f:id:ts0818:20170904202141j:plain

「次へ(N)>」をクリック。

f:id:ts0818:20170904202135j:plain

「完了(F)」をクリック。

f:id:ts0818:20170904203004j:plain

 

Javaファイルを作成

次に、「Javaファイル」を作っていきます。まずは、パッケージを作成します。「src」フォルダを選択した状態で、右クリックし「新規(N)」>「パッケージ」を選択。

f:id:ts0818:20170904203000j:plain

「名前(M):」を入力し、「完了(F)」をクリック。

f:id:ts0818:20170904202952j:plain

作成したパッケージを選択した状態で右クリックし、「新規(N)」>「クラス」を選択。

f:id:ts0818:20170904202948j:plain

JabaBeansとなるクラスを作るので、「名前(M):」を入力し、「インターフェイス(I):」の「追加(A)...」をクリックします。

f:id:ts0818:20170904202940j:plain

 テキストボックスに「Ser」ぐらいまで入力すると、候補が出てくるので、「Serializable - java.io」を選択。

f:id:ts0818:20170904203731j:plain

インターフェイス(I):」が追加できたら、「完了(F)」をクリックします。

f:id:ts0818:20170904203728j:plain

同じパッケージで「新規(N)」>「クラス」を選択し、「名前(M):」を入力し「完了(F)」をクリック。

f:id:ts0818:20170904204442j:plain

 同じパッケージで「新規(N)」>「サーブレット」を選択。

f:id:ts0818:20170904203713j:plain

 「クラス名(M):」を入力し、「次へ(N)>」をクリックします。 

f:id:ts0818:20170904204854j:plain

「URL マッピング(U):」を編集もできます。

f:id:ts0818:20170904204850j:plain

「次へ(N)>」をクリックします。

f:id:ts0818:20170904204845j:plain

「完了(F)」をクリックします。

f:id:ts0818:20170904204841j:plain

 

JSPファイルを作成

続いて、JSPファイルを作成していきます。「WebContent」を選択した状態で右クリックし、「新規(N)」>「フォルダー」を選択。

f:id:ts0818:20170904204837j:plain

「フォルダー名(N):」を入力し、「完了(F)」をクリック。

f:id:ts0818:20170904205411j:plain

作成されたフォルダを選択した状態で右クリックし、「新規(N)」>「JSPファイル」を選択。

f:id:ts0818:20170904205406j:plain

「ファイル名(M):」を入力し「次へ(N)>」をクリック。

f:id:ts0818:20170904205401j:plain

「新規JSPファイル(html)」を選択し、「完了(F)」をクリック。

f:id:ts0818:20170904205358j:plain

JSPファイルができてます。

f:id:ts0818:20170904205353j:plain

同じ流れで、JSPファイルをもう2つ用意します。

f:id:ts0818:20170904205815j:plain

 

ファイルの編集

UserBean.java

package websample;

import java.io.Serializable;

public class UserBean implements Serializable {
  /**
   * フィールド変数
   */
	private String id;
	private String password;
	private String name;
	private int age;

	public UserBean() {}

	public String getId() {
		return id;
	}

	public void setId(String id) {
		this.id = id;
	}

	public String getPassword() {
		return password;
	}

	public void setPassword(String password) {
		this.password = password;
	}

	public String getName() {
		return name;
	}

	public void setName(String name) {
		this.name = name;
	}

	public int getAge() {
		return age;
	}

	public void setAge(int age) {
		this.age = age;
	}

}

Login.java

package websample;

public class Login {

	public UserBean getUser(String id, String pass) {
		UserBean bean = new UserBean();
		if(bean != null) {

			if("web01".equals(id) && "1234".equals(pass)) {

				bean.setId("web01");
				bean.setName("Bob");
				bean.setAge(34);

			} else if("web02".equals(id) && "5678".equals(pass)) {

				bean.setId("web02");
				bean.setName("Michel");
				bean.setAge(32);

			} else {
				bean = null;
			}
		}
		return bean;
	}
}

LoginUserServlet.java

package websample;

import java.io.IOException;

import javax.servlet.RequestDispatcher;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;

/**
 * Servlet implementation class LoginUserServlet
 */
@WebServlet("/LoginUser")
public class LoginUserServlet extends HttpServlet {
	private static final long serialVersionUID = 1L;

    /**
     * @see HttpServlet#HttpServlet()
     */
    public LoginUserServlet() {
        super();

    }

	/**
	 * @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
	 */
	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

	}

	/**
	 * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)
	 */
	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
    // 文字コード指定
		request.setCharacterEncoding("UTF8");
		response.setCharacterEncoding("UTF8");

		// リクエストパラメーター(JSPから)
		String id   = request.getParameter("id");
		String pass = request.getParameter("pass");
		String send = request.getParameter("send");

		// セッション開始
		HttpSession session = request.getSession();
		RequestDispatcher rd;  // 遷移用
		String url = "";       // 遷移URL

		// ログイン処理クラスのインスタンス生成
		Login login = new Login();
		// ログインチェック
		UserBean bean = login.getUser(id, pass);

		// ログインが押された場合
		if("ログイン".equals(send)) {

      // ログインOK
  		if(bean != null) {
  			session.setAttribute("user", bean);
  			session.setAttribute("login", "login");
  			session.setMaxInactiveInterval(180);

  			url = "./WEB-Sample/loginOK.jsp";
  			rd = request.getRequestDispatcher(url);

  		// ログインNG
  		} else {
  			url = "./WEB-Sample/loginNG.jsp";
  			rd = request.getRequestDispatcher(url);
  			System.out.println("ログインNG?");

  		}

  		rd.forward(request, response);
		}

		// ログアウトが押された場合
		if("ログアウト".equals(send)) {
      session.removeAttribute("user");
      session.removeAttribute("login");
      url = "./WEB-Sample/login.jsp";
      response.sendRedirect(url);
		}

	}

}

login.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<jsp:useBean id="user" scope="session" class="websample.UserBean" />
<%
String login = (String)session.getAttribute("login");
%>

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>ログイン</title>
</head>
<body>
  <form action="/JSPAndBeans/LoginUser" method="POST">
    <p>ログインID: <input type="text" name="id" value="${user.getId() != null ? user.getId() : '' }"></p>
    <p>パスワード: <input type="password" name="pass" value=""></p>
    <input type="submit" name="send" value="ログイン">
    <% if(login != null && login.equals("login")) { %>
    <input type="submit" name="send" value="ログアウト">
    <% } %>
  </form>
</body>
</html>

loginOK.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<jsp:useBean id="user" scope="session" class="websample.UserBean" />

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>ログイン情報</title>
</head>
<body>
  <% if(user.getId() != null) { %>
  <p>ID: <jsp:getProperty property="id" name="user"/></p>
  <p>名前: <jsp:getProperty property="name" name="user"/></p>
  <p>年齢: <jsp:getProperty property="age" name="user"/></p>
  <% } %>

  <form>
    <input type="button" onclick="location.href='./WEB-Sample/login.jsp'" value="戻る">
  </form>
</body>
</html>

loginNG.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>ログインエラー</title>
</head>
<body>
  <p>入力されたユーザーはいないようです。</p>
  <form>
    <input type="button" value="戻る" onclick="location.href='./WEB-Sample/login.jsp'">
  </form>
</body>
</html>

それでは、サーバーで実行してみます。「login.jsp」を選択した状態で右クリックし、「実行(R)」>「サーバーで実行」を選択。

f:id:ts0818:20170904230132j:plain

「次へ(N)>」をクリック。

f:id:ts0818:20170904230133j:plain

「構成済み(C):」にプロジェクトが追加されてるのを確認し、「完了(F)」をクリック。

f:id:ts0818:20170904230134j:plain

login.jspのページが表示されたら、 存在するユーザーの「ログインID」「パスワード」を入力し「ログイン」クリックで、

f:id:ts0818:20170904230129j:plain

ログインユーザーの情報が表示されます。

f:id:ts0818:20170904230130j:plain

戻ると、セッションで保存された「UserBeanクラス」のインスタンスの「ログインID」が表示されています。

f:id:ts0818:20170904230131j:plain

  

JavaBeansのルール

JavaBeansクラスを使う場合、ルールがあるようです。 

  • クラス名は「○○○Bean」とする。
  • メンバフィールドはprivateのメンバ変数にする
  • メンバフィールドへのアクセサメソッドが必要
    • getter
    • setter
  • アクセサメソッドの接頭語には 「set」,「get」をつける
    • setter なら「set○○」
    • getter なら「get○○」
  • publicで引数なしのコンストラクタが必要
  • 直列化(シリアライズ)のために、 Serializableインターフェースが必要
  • ユニークなserialVersionUIDを設定

Java Beansクラスについて - はしくれエンジニアもどきのメモ

 

Beanクラスを使っているjsp

今回の場合は、

getterを使う場合

<p>ID:<%=user.getId()%></p>
<p>名前:<%=user.getName()%></p>
<p>年齢:<%=user.getAge()%></p>

アクションタグを使う場合

<jsp:useBean id="user" scope="session" class="websample.UserBean" />

と書いて(sessionスコープの場合、また、classの部分は今回ですと、「websample」パッケージの中の「UserBean.java」クラスを使いたいので、「class="websample.UserBean"」となるようです。)

<p>ID:<jsp:getProperty property="id" name="user"/></p>
<p>名前:<jsp:getProperty property="name" name="user"/></p>
<p>年齢:<jsp:getProperty property="age" name="user"/></p>

取得できます。

EL式を使う場合

<p>ID:${user.getId()}</p>
<p>名前:${user.getName()}</p>
<p>年齢:${user.getAge()}</p>

と記述できるようです。

EL式(Expression Language)を利用するには、JSP 2.0以上、サーブレット2.4以上をサポートしているwebアプリケーションサーバTomcatだと、5.0以上)が必要のようです。

[Java]JavaEE - JSP - EL式【基本】【PGBox】

Java Beansクラスについて - はしくれエンジニアもどきのメモ

 

JSPいろいろなことができて複雑ですね。