今回は、「Webシステムのログイン(4)―シンプルなログインの作り方―」です。
ユーザーがログインする画面を見てみましょう。
■動画はこちら
■動画で使用しているソースコード
数が多いので、動画内で使用しているソースコードのうち、ログインとログアウトを載せています。
他に欲しいソースコードがありましたら、youtubeのコメント欄へどうぞ。
ログイン
サーブレット（LoginServlet.java）
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 | package yurufuwa.prog.sample; import java.io.IOException; import jakarta.servlet.RequestDispatcher; import jakarta.servlet.ServletContext; import jakarta.servlet.ServletException; import jakarta.servlet.http.HttpServlet; import jakarta.servlet.http.HttpServletRequest; import jakarta.servlet.http.HttpServletResponse; import jakarta.servlet.http.HttpSession; public class LoginServlet extends HttpServlet { @Override protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { //ログインページを表示 ServletContext sc = getServletContext(); RequestDispatcher rd = sc.getRequestDispatcher("/WEB-INF/jsp/login.jsp"); rd.forward(req, resp); } @Override protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { //入力パラメーターを取得 String userId = req.getParameter("txtUserId"); String password = req.getParameter("txtPassword"); //ユーザIDとパスワードのチェック LoginChecker checker = new LoginChecker(); if( checker.isValid(userId, password) ) { //セッションを作成して、ユーザID、ユーザ名を追加 HttpSession session = req.getSession(true); session.setAttribute("USER_ID", userId); session.setAttribute("USER_NAME", checker.getUserName()); //メニューへリダイレクト resp.sendRedirect("./menu"); } else { //ログインのエラーページを表示 ServletContext sc = getServletContext(); RequestDispatcher rd = sc.getRequestDispatcher("/WEB-INF/jsp/login_err.jsp"); rd.forward(req, resp); } } } |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 | package yurufuwa.prog.sample; import java.sql.Connection; import java.sql.PreparedStatement; import java.sql.ResultSet; import javax.naming.InitialContext; import javax.sql.DataSource; public class LoginChecker { private String userName = null; public boolean isValid(String userId, String password) { boolean ret = false; Connection conn = null; try { InitialContext ctx = new InitialContext(); DataSource ds = (DataSource)ctx.lookup("java:comp/env/jdbc/mysql"); conn = ds.getConnection(); //SQLを発行（完全一致で検索） PreparedStatement pstmt = conn.prepareStatement( "SELECT user_name FROM userinfo " + "WHERE user_id = ? and password = ?" ); pstmt.setString(1, userId); pstmt.setString(2, password); ResultSet rs = pstmt.executeQuery(); //結果を取得 while(rs.next()) { userName = rs.getString(1); ret = true; } rs.close(); pstmt.close(); } catch(Exception e) { e.printStackTrace(); } finally { try { //接続を閉じる conn.close(); } catch(Exception e) { } } return ret; } public String getUserName() { return userName; } } |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 | <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>ログイン</title> <link href="./css/style.css" rel="stylesheet" /> </head> <body> <header class="header"> <div class="header_title">ログイン</div> <div class="header_add"></div> </header> <main class="login"> <h2>ログイン</h2> <form action="./login" method="post"> <table> <tr><td>ユーザID</td><td><input type="text" name="txtUserId" /></td></tr> <tr><td>パスワード</td><td><input type="password" name="txtPassword" /></td></tr> </table> <br /> <input type="submit" value="ログイン" /> </form> </main> </body> </html> |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 | <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>ログインエラー</title> <link href="./css/style.css" rel="stylesheet" /> </head> <body> <header class="header"> <div class="header_title">ログイン</div> <div class="header_add"></div> </header> <main class="err"> <h2>ログインエラー</h2> <p>ユーザID、または、パスワードが違います</p> <a href="./login">ログインページに戻る</a> </main> </body> </html> |
ログアウト
サーブレット（Sv18.java）
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 | package yurufuwa.prog.sample; import java.io.IOException; import jakarta.servlet.RequestDispatcher; import jakarta.servlet.ServletContext; import jakarta.servlet.ServletException; import jakarta.servlet.http.HttpServlet; import jakarta.servlet.http.HttpServletRequest; import jakarta.servlet.http.HttpServletResponse; import jakarta.servlet.http.HttpSession; public class LogoutServlet extends HttpServlet { @Override protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException { //セッションを無効化 HttpSession session = req.getSession(false); if(session != null) { session.invalidate(); } //ログアウトページへフォワード ServletContext sc = getServletContext(); RequestDispatcher rd = sc.getRequestDispatcher("/WEB-INF/jsp/logout.jsp"); rd.forward(req, resp); } } |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 | <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>ログアウト</title> <link href="./css/style.css" rel="stylesheet" /> </head> <body> <header class="header"> <div class="header_title">ログアウト</div> <div class="header_add"></div> </header> <main class="logout"> <h2>ログアウトしました</h2> <a href="./login">ログインページに戻る</a> </main> </body> </html> |
共通
web.xml
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 | <?xml version="1.0" encoding="UTF-8"?> <web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns="https://jakarta.ee/xml/ns/jakartaee" xmlns:web="http://xmlns.jcp.org/xml/ns/javaee" xsi:schemaLocation="https://jakarta.ee/xml/ns/jakartaee https://jakarta.ee/xml/ns/jakartaee/web-app_5_0.xsd" id="WebApp_ID" version="5.0"> <display-name>testWeb</display-name> <servlet> <servlet-name>Login</servlet-name> <servlet-class>yurufuwa.prog.sample.LoginServlet</servlet-class> </servlet> <servlet> <servlet-name>Menu</servlet-name> <servlet-class>yurufuwa.prog.sample.MenuServlet</servlet-class> </servlet> <servlet> <servlet-name>Logout</servlet-name> <servlet-class>yurufuwa.prog.sample.LogoutServlet</servlet-class> </servlet> <servlet> <servlet-name>Todofuken</servlet-name> <servlet-class>yurufuwa.prog.sample.TodofukenServlet</servlet-class> </servlet> <servlet-mapping> <servlet-name>Login</servlet-name> <url-pattern>/login</url-pattern> </servlet-mapping> <servlet-mapping> <servlet-name>Menu</servlet-name> <url-pattern>/menu</url-pattern> </servlet-mapping> <servlet-mapping> <servlet-name>Logout</servlet-name> <url-pattern>/logout</url-pattern> </servlet-mapping> <servlet-mapping> <servlet-name>Todofuken</servlet-name> <url-pattern>/todofuken</url-pattern> </servlet-mapping> </web-app> |
1 2 3 4 5 6 7 8 9 10 11 12 | <?xml version="1.0" encoding="UTF-8"?> <Context> <Resource name="jdbc/mysql" auth="Container" type="javax.sql.DataSource" factory="org.apache.tomcat.jdbc.pool.DataSourceFactory" maxActive="5" maxIdle="5" initialSize="5" username="yuruku" password="fuwatto" driverClassName="com.mysql.cj.jdbc.Driver" url="jdbc:mysql://localhost/yuruku"/> </Context> |
