[JSP] login1

JSP 2021. 7. 27. 18:40

Member VO.java 클래스

회원 테이블 정보 저장

package com.saeyan.dto;

import lombok.Getter;
import lombok.Setter;
import lombok.ToString;

@Getter
@Setter
@ToString

public class MemberVo {
	private String name;
	private String userid;
	private String pwd;
	private String email;
	private String phone;
	private int admin;
}

index.jsp

홈페이지

get방식. 보통 회원가입이나 게시글 작성 등의 작업에서 입력 폼을 출력할 때 사용한다.

go to the login page를 클릭하면 로그인 페이지가 나타나도록 하고, login.do가 get 방식으로 요청되었을 때 로그인 입력 폼이 나타나도록 서블릿을 정의할 것이다.

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>member management</title>
</head>
<body>
home page
<a href="login.do">go to the login page</a>
</body>
</html>

LoginServlet.java (@WebServlet("/login.do"))

jsp를 직접 실행시키지 않고

xxx.do로 요청하여 서블릿에서 jsp 페이지 실행

@WebServlet("/login.do")
public class LoginServlet extends HttpServlet {	
	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		RequestDispatcher dispatcher = request.getRequestDispatcher("member/login.jsp");
		dispatcher.forward(request, response);
		//response.sendRedirect("member/login.jsp");
	}
}

Member DAO.java

데이터 베이스의 데이터에 접근하기 위한 객체 (1.DB 데이터를 VO 객체로 끌어오거나 2. VO 객체에 저장된 값을 DB에 추가)
싱글톤 형태로 DAO 만들기

public class MemberDAO{
	private MemberDAO()
	private static MemberDAO instance = new MemberDAO();
    public static MEmberDAO getInstance() {return instance;}
    
    public Connection getConnection() throws Exception { 
		Context initContext = new InitialContext();
		DataSource ds = (DataSource)initContext.lookup("java:comp/env/jdbc/OracleDB"); 
		Connection conn = ds.getConnection();
		return conn;		
	}
     //DBCP로 커넥션 객체를 얻어오는 메소드
    
}

login.jsp

submit 버튼을 누르면 login.do가 요청되는데, login.do 처리는 서블릿(LoginServlet.java - doPost())에서 할 것이다.

로그인 인증을 위한 DB 처리를 위해 login.do는 post 방식으로 요청된다.

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="script/member.js"></script>
</head>
<body>
<h2>로그인</h2>
<form action="login.do" method="post" name="frm">
	<table>
		<tr>
			<td>아이디</td>
			<td><input type="text" name="userid" value="${userid}"></td>
		</tr>
		<tr>
			<td>암호</td>
			<td><input type="password" name="pwd"></td>
		</tr>
		<tr>
			<td colspan="2" align="center">
				<input type="submit" value="login" onclick="return loginCheck()">&nbsp;&nbsp;
				<input type="reset" value="reset">&nbsp;&nbsp;
				<input type="button" value="join" onclick="location.href='join.do'">
			</td>
		</tr>
		<tr>
			<td colspan="2">${message}</td>
		</tr>		
	</table>
</form>
</body>
</html>

member.js

유효성 체크하는 js

function loginCheck(){
	if(document.frm.userid.value.length==0){
		alert("enter id");
		frm.userid.focus();
		return false;
	}	
	if(document.frm.pwd.value==""){
		alert("enter pwd");
		frm.pwd.focus();
		return false;
	}	
	return true;
}

MemberDAO.java

사용자 인중시 사용하는 메소드(userCheck) 추가하기

회원 아이디와 암호를 전달받는다.

result 에 아이디가 일치하는 회원이 존재하지 않으면 -1을 , 존재하면 1을 저장한다. 아이디가 일치하지만 암호가 불일치하면 0을 저장한다.

package com.saeyan.dao;

import java.sql.Connection;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import javax.naming.Context;
import javax.naming.InitialContext;
import javax.sql.DataSource;
import com.saeyan.dto.MemberVo;

public class MemberDAO { 

	private MemberDAO() {
		// TODO Auto-generated constructor stub
	}
	
	private static MemberDAO instance = new MemberDAO();
	
	public static MemberDAO getInstance() {
		return instance;
	}
	
	public Connection getConnection() throws Exception { 
		Context initContext = new InitialContext();
		DataSource ds = (DataSource)initContext.lookup("java:comp/env/jdbc/OracleDB");
		Connection conn = ds.getConnection();
		return conn;
		
	}
	
	public int userCheck(String userid,String pwd) {		
		
		Connection conn = null;
		PreparedStatement pstmt = null;
		ResultSet rs = null;
		
		String sql = "select pwd from member where userid=?";
		
		int result = -1;
		
		try {			
			conn = pstmt.getConnection();
			pstmt = conn.prepareStatement(sql);
			pstmt.setString(1, userid);
			rs = pstmt.executeQuery(); //쿼리문을 실행하여 결과값을 ResultSet 객체인 rs에 저장.
			
			if(rs.next()) {
				if(rs.getString(1) != null && rs.getString(1).equals(pwd)) {
					return 1;
				}else {
					result = 0;
				}
			}else {
				result = -1;
			}
			
		}catch(Exception e) {
			e.printStackTrace();
		}finally {
			try {
				if(rs!=null) rs.close();
				if(pstmt!=null) pstmt.close();
				if(conn!=null) conn.close();
			
			}catch(Exception e) {
				e.printStackTrace();
			}
			
		}
		return result;
	}
}

MemberDAO.java

아이디로 회원 정보를 가져오는 메소드(getMember) 추가하기. MemberVO타입

아이디가 일치하는 멤버의 정보를 얻어온다.

아이디가 일치하는 로우가 존재하면 VO 객체에 DB에 저장된 회원 정보를 채운다.

package com.saeyan.dao;

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

import javax.naming.Context;
import javax.naming.InitialContext;
import javax.sql.DataSource;

import com.saeyan.dto.MemberVo;

public class MemberDAO {
	private MemberDAO() {
    
	}
	private static MemberDAO instance = new MemberDAO();
	public static MemberDAO getInstance() {
		return instance;
	}
	public Connection getConnection() throws Exception {  
		Context initContext = new InitialContext();
		DataSource ds = (DataSource)initContext.lookup("java:comp/env/jdbc/OracleDB"); 
		Connection conn = ds.getConnection();
		return conn;
		
	}
	
	public int userCheck(String userid,String pwd) {		
		Connection conn = null;
		PreparedStatement pstmt = null;
		ResultSet rs = null;
		
		String sql = "select pwd from member where userid=?";
		
		int result = -1;
		
		try {			
			conn = pstmt.getConnection();
			pstmt = conn.prepareStatement(sql);
			pstmt.setString(1, userid);
			rs = pstmt.executeQuery();
			
			if(rs.next()) {
				if(rs.getString(1) != null && rs.getString(1).equals(pwd)) {
					return 1;
				}else {
					result = 0;
				}
			}else {
				result = -1;
			}
			
		}catch(Exception e) {
			e.printStackTrace();
		}finally {
			try {
				if(rs!=null) rs.close();
				if(pstmt!=null) pstmt.close();
				if(conn!=null) conn.close();
			
			}catch(Exception e) {
				e.printStackTrace();
			}			
		}
		return result;
	}

	public MemberVo getMember(String userid) {
		MemberVo mVo = null;
		String sql = "select * from member where userid=?";
		Connection conn = null;
		PreparedStatement pstmt = null;
		ResultSet rs = null;
		
		try {
			conn = getConnection();
			pstmt = conn.prepareStatement(sql);
			rs = pstmt.executeQuery();
			if(rs.next()) {
				mVo = new MemberVo();
				mVo.setName(rs.getString("name"));
				mVo.setUserid(rs.getString("userid"));
				mVo.setPwd(rs.getString("pwd"));
				mVo.setEmail(rs.getString("email"));
				mVo.setPhone(rs.getString("phone"));
				mVo.setAdmin(rs.getInt("admin"));
			}
		}catch(Exception e) {
			e.printStackTrace();
		}finally {
			try {
				if(rs!=null) rs.close();
				if(pstmt!=null) pstmt.close();
				if(conn!=null) conn.close();			
			}catch(Exception e) {
				e.printStackTrace();
			}			
		}
		return mVo;
	}
}

LoginServlet.java (@WebServlet("/login.do"))

아이디와 암호를 입력한 후 login 버튼을 누르면 입력된 정보를 받아서 DB에 해당 정보가 저장되어 있는지 확인 작업이 필요하다.

서블릿에 요청할 것이고, 로그인 입력 폼을 띄우기 위해서 사용했던 동일한 요청에 요청 방식만 post로 주어서 로그인을 위한 DB 처리 작업을 할 것이다.

(요청이 일어날 때마다 서블릿 클래스를 별도로 만들어서 처리하기 보다는 이 방식이 낫다)

로그인 인증을 위한 데이터베이스 처리를 위해 login.do는 post 방식으로 요청되므로 doPost()에 아래 코드처럼 기술한다.

Session 을 사용하는 이유는 로그인 인증이 처리된 회원 정보를 다른 사이트에 갔다가 돌아와도 다시 로그인하지 않아도 될 수 있도록 하기 위해서 session에 등록해둬야한다.

package com.saeyan.controller;
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;
import com.saeyan.dao.MemberDAO;
import com.saeyan.dto.MemberVo;

@WebServlet("/login.do")
public class LoginServlet extends HttpServlet {
	
	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		RequestDispatcher dispatcher = request.getRequestDispatcher("member/login.jsp");
		dispatcher.forward(request, response);
		//response.sendRedirect("member/login.jsp");
	}

	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		String url = "member/login.jsp";
		
		String userid = request.getParameter("userid");
		String pwd = request.getParameter("pwd");
		
		MemberDAO mDao = MemberDAO.getInstance();
		int result = mDao.userCheck(userid, pwd);
		
		if(result ==1 ) {
			MemberVo mVo = mDao.getMember(userid);
			
			HttpSession session = request.getSession();
			session.setAttribute("loginUser",mVo);
			
			request.setAttribute("message", "success login. welcome!");
			url = "main.jsp";
		}else if(result==0) {
			request.setAttribute("message", "not this password");
		}else if(result==-1) {
			request.setAttribute("message", "not exist member");
		}
		
		RequestDispatcher dispatcher = request.getRequestDispatcher(url);
		dispatcher.forward(request, response);
		
	}

}

main.jsp

회원 인증된 사용자에게 제공되는 페이지

<%@ taglib uri="" prefix=""%> 는 JSTL 태그 라이브러리를 사용하기 위한 지시자

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="member.js"></script>
</head>
<body>
	<h2>page for member</h2>
	
	<table>
		<tr>
			<td>hello. ${loginUser.name} ! (${loginUser.userid})</td>
		</tr>
		<tr>
			<td colspan="2" align="center">
				<input type="submit" value="logout"><br><br>
				<input type="button" value="change of member's information" onclick="location.href='memberUpdate.do?userid=%{loginUser.userid}'">
			</td>
		</tr>
	</table>
</body>
</html>

join.do

회원가입 과정은 회원 정보를 입력받은 후 진행된다. 로그인 폼에서 <join> 버튼을 클릭하면 회원가입을 위한 입력 폼을 띄우기 위한 join.do 를 get 방식으로 요청한다.

요청방식은 get과 post 두 가지 방식이 있는데 join.do가 get 방식으로 요청되었는지, post 방식으로 요청되었는지에 따라 처리가 달라진다.

get방식으로 요청할 경우 회원 가입이나 게시글 작성 등의 작업에서 입력 폼을 출력할 때 사용한다.

post방식으로 요청할 경우 게시글 정보를 모두 입력하고 난 후에 데이터베이스 정보를 저장하기 위한 작업을 처리한다.

링크에 의한 요청은 get방식이므로 서블릿에서 doGet() 메소드에 회원가입 폼인 join.jsp 로 포워딩하도록 코딩한다.

join.do가 get 방식으로 요청되면 회원가입을 위한 폼인 join.jsp 를 띄운다.

package com.saeyan.controller;
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;

@WebServlet("/Join.do")
public class JoinServlet extends HttpServlet {
	private static final long serialVersionUID = 1L;
       
	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		RequestDispatcher dispatcher = request.getRequestDispatcher("member/join.jsp");
		dispatcher.forward(request, response);
	}
	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
	}
}

join.jsp

회원가입을 위해서 정보를 입력받는 form을 작성하기

확인 버튼을 누르면 joinCheck() 함수를 호출한다. (member.js) joinCheck()는 입력이 제대로 되었는지 검사한 후 join.do 로 제어를 옮긴다.

데이터베이스를 설계하면서 아이디에 primary key 조건을 설정했기 때문에, 이미 입력된 아이디를 insert 하게되면 err 가 발생한다. 그래서 회원 정보를 데이터베이스에 추가하기 전에 이미 등록된 회원인지 아닌지 확인해야한다. 그래서 중복체크 버튼을 추가했다. 이 버튼을 클릭하면 idCheck() js 함수를 호출한다.

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="script/memebr.js"></script>
</head>
<body>
<h2>회원가입</h2>
'*' is a required field to be entered.
<form action = "join.do" method="post" name="frm">
	<table>
		<tr>
			<td style="size:30;">name</td>
			<td><input type="text" name="name" size="20">*</td>
		</tr>
		<tr>
			<td>id</td>
			<td>
				<input type="text" name="userid" size="20" id="userid">*
				<input type="hidden" name="reid" size="20">
				<input type="button" value="double check" onclick="idCheck()">
			</td>			
		</tr>
		<tr>
			<td>password</td>
			<td><input type="text" name="pwd" size="20">*</td>
		</tr>
		<tr height="30" >
			<td width="80">password check</td>
			<td><input type="text" name="pwd_check" size="20">*</td>
		</tr>
		<tr>
			<td>email</td>
			<td><input type="text" name="email" size="20"></td>
		</tr>
		<tr>
			<td>phone number</td>
			<td><input type="text" name="phone" size="20"></td>
		</tr>
		<tr>
			<td>grade</td>
			<td>
				<input type="radio" name="admin" value="0" checked="checked">user
				<input type="radio" name="admin" value="1">manager
			</td>
		</tr>
		<tr>
			<td colspan="2" align="center">
				<input type="submit" value="confirm" onclick="return joinCheck()">
				<input type="reset" value="reset">
			</td>
		</tr>
		<tr>
			<td colspan="2">${message}</td>
		</tr>
	</table>
</form> 
</body>
</html>

member.js

join.jsp 에서 idCheck() 버튼이 클릭되면 아이디 중복 체크를 위한 페이지로 이동하도록 했고 해당 내용 코드이다.

아이디 중복 체크를 위해서 아이디 입력을 받아와야한다. 밑에 나오겠지만, 아이디 중복 체크를 위한 idcheck.jsp 페이지는 현재 페이지가 아닌 새로운 창에 출력되도록 하자.

js에서 새로운 창을 띄우게 하려면 window 객체의 open() 메소드를 제공한다.

function loginCheck(){
	if(document.frm.userid.value.length==0){
		alert("enter id");
		frm.userid.focus();
		return false;
	}	
	if(document.frm.pwd.value.length==0){
		alert("enter pwd");
		frm.pwd.focus();
		return false;
	}
	return true;
}


function idCheck(){
	if(document.frm.userid.value.lengt==0){
		alert("enter id");
		frm.name.focuse();
		return false;
	}	
	let url = "idCheck.do?userid=" + document.frm.userid.value; 
	window.open(url,"_blank_1","toolbar=no, menubar=no, scrollbars=yes, resizable=no, width=450, height=200");
}

MemberDAO.java

아이디 중복 체크를 위해서는 데이터베이스에 존재하는 아이디인지를 점검하기 위한 메소드를 DAO에 추가해야한다.

int형인 confirmID 메소드를 만들어서 입력한 아이디가 이미 존재하면 1을, 존재하지 않으면 -1을 return한다.

package com.saeyan.dao;

import java.sql.Connection;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import javax.naming.Context;
import javax.naming.InitialContext;
import javax.sql.DataSource;
import com.saeyan.dto.MemberVo;

public class MemberDAO { //DAO는 데이터베이스의 데이터에 접근하기 위한 객체이다.

	private MemberDAO() {
	}
	
	private static MemberDAO instance = new MemberDAO();
	
	public static MemberDAO getInstance() {
		return instance;
	}
	
	public Connection getConnection() throws Exception {  //DBCP로 커넥션 객체를 얻어오는 메소드
		Context initContext = new InitialContext();
		DataSource ds = (DataSource)initContext.lookup("java:comp/env/jdbc/OracleDB"); //jdbc/OracleDB 라는 이름을 찾으면 DataSource 형으로 return 하므로 이를 받아서 DataSource 객체에 저장한다.
		Connection conn = ds.getConnection();//lookup 메소드로 얻어낸 DataSource 객체로 getConnection() 메소드를 호출하여 Connection객체를 얻는다.
		return conn;
		
	}
	
	public int userCheck(String userid,String pwd) {
		Connection conn = null;
		PreparedStatement pstmt = null;
		ResultSet rs = null;
		
		String sql = "select pwd from member where userid=?";
		
		int result = -1;
		
		try {			
			conn = getConnection();
			pstmt = conn.prepareStatement(sql);
			pstmt.setString(1, userid);
			rs = pstmt.executeQuery();
			
			if(rs.next()) {
				if(rs.getString(1) != null && rs.getString(1).equals(pwd)) {
					return 1;
				}else {
					return 0;
				}
			}else {
				return -1;
			}
		}catch(Exception e) {
			e.printStackTrace();
		}finally {
			try {
				if(rs!=null) rs.close();
				if(pstmt!=null) pstmt.close();
				if(conn!=null) conn.close();
			
			}catch(Exception e) {
				e.printStackTrace();
			}
		}
		return result;
	}

	public MemberVo getMember(String userid) {
		MemberVo mVo = null;
		String sql = "select * from member where userid=?";
		Connection conn = null;
		PreparedStatement pstmt = null;
		ResultSet rs = null;
		
		try {
			conn = getConnection();
			pstmt = conn.prepareStatement(sql);
			pstmt.setString(1, userid);
			rs = pstmt.executeQuery();
			if(rs.next()) {
				mVo = new MemberVo();
				mVo.setName(rs.getString("name"));
				mVo.setUserid(rs.getString("userid"));
				mVo.setPwd(rs.getString("pwd"));
				mVo.setEmail(rs.getString("email"));
				mVo.setPhone(rs.getString("phone"));
				mVo.setAdmin(rs.getInt("admin"));
			}
		}catch(Exception e) {
			e.printStackTrace();
		}finally {
			try {
				if(rs!=null) rs.close();
				if(pstmt!=null) pstmt.close();
				if(conn!=null) conn.close();
			
			}catch(Exception e) {
				e.printStackTrace();
			}
			
		}
		return mVo;
	}
	
	public int confirmID(String userid) {
		
		int result = -1;
		
		String sql = "select userid from member where userid=?";
		
		Connection conn = null;
		PreparedStatement pstmt = null;
		ResultSet rs = null;
		
		try {
			conn = getConnection();
			pstmt = conn.prepareStatement(sql);
			pstmt.setString(1, userid);
			rs = pstmt.executeQuery();
			
			if(rs.next()) {
				result = 1;
			}else {
				result = -1;
			}
		}catch(Exception e) {
			e.printStackTrace();
		}finally {
			try {
				if(rs!=null) rs.close();
				if(pstmt!=null) pstmt.close();
				if(conn!=null) conn.close();
			
			}catch(Exception e) {
				e.printStackTrace();
			}
		}
		return result;
	}
}

IdCheckServlet.java (idCheck.do)

join.jsp 에서 idCheck() 버튼을 누르면 idCheck.do가 요청된다. 요청에 대한 처리를 위한 서블릿 클래스를 만들자.

DAO객체를 얻어와서 confirmID() 메소드에 아이디를 전달하여 결과값을 얻어온다.

아이디 중복 체크 후 얻어온 confirmID() 메소드의 결과값을 userid 와 result 값으로 idcheck.jsp 페이지에 attribute에 실어 보낸다.

package com.saeyan.controller;

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 com.saeyan.dao.MemberDAO;

@WebServlet("/idCheck.do")
public class IDCheckServlet extends HttpServlet {
	private static final long serialVersionUID = 1L;
       
	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		String userid = request.getParameter("userid");
		
		MemberDAO mDao = MemberDAO.getInstance();
		
		int result = mDao.confirmID(userid); 
		
		request.setAttribute("userid", userid); 
		request.setAttribute("result", result);
		
		RequestDispatcher dispatcher = request.getRequestDispatcher("member/idcheck.jsp");
		dispatcher.forward(request, response);
	}
}

idcheck.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri = "http://java.sun.com/jsp/jstl/core" prefix="c" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="script/member.js"></script>
</head>
<body>
	<h2>id duplicate check</h2>
	<form action="idCheck.do" method="get" name="frm">
		id <input type="text" name="userid" value="${userid}">
		<input type="submit" value="duplicate check"><br>
		
		<c:if test="${result==1}"> 
			<script type="text/javascript">opener.document.frm.userid.value="";</script>
			${userid} is already used
		</c:if>
		<c:if test="${result==-1}">
			${userid} can use id
			<input type="button" value="use" class="cancel" onclick="idok()">
		</c:if>
	</form>
</body>
</html>

member.js

idcheck.jsp 에 use 버튼을 누르면 호출되는 idok() 함수를 정의해보자.

728x90

'JSP' 카테고리의 다른 글

[JSP] login2-2 (0)	2021.08.02
[JSP] login2-1 (0)	2021.07.29
[JSP] JSTL 라이브러리 다운 / 기능 (0)	2021.07.22
[JSP] 표현언어 이용하여 프로퍼티 얻어오기 (0)	2021.07.22
[JSP] 자바와 EL / null과 공백 (0)	2021.07.21

ABOUT ME

worri worri

'JSP' 카테고리의 다른 글

티스토리툴바

ABOUT ME

'JSP' 카테고리의 다른 글

관련글 관련글 더보기

티스토리툴바