【JavaでTodoアプリ】ログイン機能の追加

今回の記事はこちらの記事の続きとなっております。

現在Java(サーブレット・jsp) x PostgreSQLを使ってTodoアプリを作成しています。現時点での機能は次のとおりです。

そして今回はログイン機能を追加していきます。ログイン単体に関してはこちらでも解説していますので合わせて読んでください。

今回は以下のような流れで開発を進めていきます。

  1. PostgreSQLのtododbにusersテーブルを追加しユーザーを登録する
  2. データベースに接続するLoginDAOの作成
  3. DAOを呼び出してログイン認証を行うLoginServletの作成
  4. ログイン画面の作成

その他の機能はこちらにまとめています。

GitHubにソースがあるので、参考にしてください!ご質問等あればこちらのTwitterアカウントまでお願いします。

Java x MySQLでWebアプリの作り方が学べるUdemy講座

usersテーブルの作成

まずはPostgreSQLでuserstーブルの作成を行います。すでにtododbを作成しているので、そこにusersテーブルを新しく追加していきます。ターミナル等で以下のコマンドを使ってデータベースにログインします。先頭の$は入力しなくて大丈夫です。

$ psql -U yourUserName tododb

次に以下のコマンドでusersテーブルの作成を行います。今回のusersテーブルはidとパスワードのみを持つシンプルなものにしました。後から追加していくかもしれません。なお先頭の(tododb=>)はPostgreSQL内でコマンドを実行していることを表しているので、入力する必要はありません。

tododb=> create table users (id varchar(50) primary key, password varchar(50));

作成したテーブルにデータを追加してみます。uha-blog, keisuke, ikezakiという3人のユーザーを追加しました。

tododb=> insert into users values ('uha-blog', 'uha-pass'), ('keisuke', 'professional'), ('ikezaki', 'justice');

追加したユーザーをSELECT文で取得してみます。上手く追加されているようです。

tododb=> select * from users;
    id    |   password
----------+--------------
 uha-blog | uha-pass
 keisuke  | professional
 ikezaki  | justice
(3 rows)
無料でJavaのWebアプリ開発が学べるプログラミングスクール

LoginDAOの作成

LoginDAOではログイン認証を行うためのデータベース接続を行います。LoginAuthenticateメソッドを作成します。このメソッドではidとパスワードを引数として受け取り、それに一致する情報を持つユーザーの取得を行います。ユーザーが存在する場合はidを返却します。存在しない場合は空文字を返却します。LoginDAOは以下のようになります。

package model.dao;

import java.sql.Connection;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.SQLException;

import model.DBConnection;

/**
 * ログイン認証を行うためにデータベースに接続するクラス
 *
 * @author yuhablog
 */
public class LoginDAO {

	/**
	 * idとパスワードによるログイン認証を行う
	 * @param id
	 * @param password
	 * @return 成功: id / 失敗: 空文字
	 * @throws SQLException
	 * @throws ClassNotFoundException
	 */
	public String LoginAuthenticate(String id, String password) throws SQLException, ClassNotFoundException {
		// 返却用変数
		String resId = "";
		// SQL作成
		StringBuilder sql = new StringBuilder();
		sql.append(" SELECT ");
		sql.append("	id ");
		sql.append(" FROM ");
		sql.append("	users ");
		sql.append(" WHERE ");
		sql.append("	id = ? ");
		sql.append(" AND ");
		sql.append("	password = ? ");

		// DBに接続しユーザー情報を取得する
		try (Connection con = DBConnection.getConnection();
				PreparedStatement pstmt = con.prepareStatement(sql.toString())) {
			pstmt.setString(1, id);
			pstmt.setString(2, password);

			// SQLの実行
			ResultSet res = pstmt.executeQuery();

			// idとパスワードが一致するユーザーが存在した時の処理
			if(res.next()) {
				// 返却用変数にデータベースから取得したユーザーIDを設定する
				resId = res.getString("id");
			}
		}
		return resId;
	}
}

LoginServletの作成

次にリクエストを受け取り、LoginDAOを使ってログイン認証を行うLoginServletを作成します。パッケージはsrc.servlet内に作成します。LoginServletではdoGetメソッドとdoPostメソッドを作成します。

まずはdoGetメソッドです。こちらはログイン画面を表示するのみです。login.jspは後ほど作成します。

/**
 * GETメソッドでリクエストを受け付けた時はログイン画面を表示する
 * login.jspを画面に表示
 */
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
	request.getRequestDispatcher("login.jsp").forward(request, response);
}

次にdoPostメソッドです。login.jspで入力されたidとパスワードを受け取り、ログイン認証を行います。

リクエストパラメータのidとパスワードを受け取り、LoginDAOのLoginAuthenticateメソッドを呼び出します。LoginAuthenticateメソッドは認証に成功するとidを失敗すると空文字を返却するので、それを利用してログイン成功か失敗か判定します。

ログインに成功した場合はセッションにログインしたユーザーのidを保持させておきます。また一覧画面に遷移します。失敗した場合はログイン画面に戻します。

/**
 * POSTメソッドでリクエストを受け付けた時はログイン認証を行う
 * 成功した時はTodo一覧画面に遷移
 * 失敗した時はログイン画面に戻す
 */
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
	// リクエストからidとパスワードを取得する
	String id = request.getParameter(Parameters.LOGIN_ID);
	String password = request.getParameter(Parameters.LOGIN_PASSWORD);

	// ログインユーザーのid
	String loginId = "";

	LoginDAO dao = new LoginDAO();

	// データベースに接続し、ログイン認証を行う
	try {
		loginId = dao.LoginAuthenticate(id, password);
	} catch (SQLException | ClassNotFoundException e) {
		e.printStackTrace();
	}

	// 遷移先のパスを保持する
	String path = "";
	// loginIdが空文字かどうかでログインの成否を判定する
	if (loginId != "") {
		// セッションにログインIDを保持する
		HttpSession session = request.getSession();
		session.setAttribute(SessionInfo.LOGIN_USER_ID, loginId);
		path = "list-servlet";
	} else {
		path = "login.jsp";
	}

	// 設定されているパスに遷移する
	request.getRequestDispatcher(path).forward(request, response);
}

Parameters.javaの編集

LoginSerlvetを作成していく中で、パラメータのやりとりがあるので、パラメータ名をParameters.javaに追加します。

/**
 * ログイン時に使用するidのパラメータ名
 */
public static final String LOGIN_ID = "loginId";

/**
 * ログイン時に使用するパスワードのパラメータ名
 */
public static final String LOGIN_PASSWORD = "lodinPassword";

SessionInfoの設定

セッションにデータを設定したり、取得したりするときの文字列を定数として持たせます。

package constant;

/**
 * セッション情報の文字列を管理するためのクラス
 *
 * @author uhablog
 */
public class SessionInfo {

	/**
	 * ログインユーザーのidを取得・設定する時に使用する定数
	 */
	public static final String LOGIN_USER_ID = "loginUserId";

}

ログイン画面の作成

loginn.jspを作成します。簡単なフォームを設置します。

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ page import="constant.Parameters" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<!-- ログインフォーム。ユーザーIDとパスワードの入力を行う -->
<form action="LoginServlet" method="post">
	<input type="text" name="<%=Parameters.LOGIN_ID %>">
	<input type="password" name="<%=Parameters.LOGIN_PASSWORD %>">
	<input type="submit" value="ログイン">
</form>
</body>
</html>

動作確認

ここまできたら動作確認します。サーバーを立ち上げ、ログイン画面を表示します。

idとパスワードを入力して一覧画面に遷移したら成功です。まあ今のままだとログインしてなくても普通に一覧画面見えちゃうんですけどね。

またusersテーブルに登録していないidもしくはパスワードを入力するとログイン画面に戻ってきます。

次回予告

次はログインしていない場合は一覧画面とか、その他新規作成などの操作をできないように変更したいと思います。

GitHubにソースがあるので、参考にしてください!ご質問等あればこちらのTwitterアカウントまでお願いします。

私はプログラミング学習はUdemyで行うのが以下のような理由で圧倒的におすすめです。

  • 動画で好きなときに学べる
  • 一流のエンジニアから教えてもらえる
  • 好きな技術を体系的に学べる
  • 実際に手を動かしながら学ぶことができる
  • セール時であれば1500円〜2000円ほどで購入できる(大半の技術書より安い)
  • 講座自体がアップデートされていくので情報が古くなりにくい

UdemyにはJava x MySQLでWebアプリの作り方が学べるUdemy講座 もあるので興味がある方は一度チェックしてみてください!なおUdemyは頻繁にセールをやっているので、セール時を狙って購入してください!

おすすめの参考書

コメント

タイトルとURLをコピーしました