[JSP] (5) 회원 가입 - 2

!!    회원 정보를 데이터베이스에 추가할 때 선행되어야 하는 작업    !! 

1) 회원 가입 폼의 * 표시된 글상자에 데이터가 입력되었는지 확인

2) 암호와 암호 확인이 일치하는 값인지 확인

3) 아이디 중복 체크는 수행하였는지 확인

 

회원 정보가 올바르게 입력되었는지 확인하기 위해 유효성을 체크하는 자바스크립트 함수를 작성해야 한다.

작성할 함수는 위에 있는 회원 가입 폼에서 <확인> 버튼을 누르면 호출된다.

 

 

* 회원 정보의 유효성을 체크하기 위한 자바스크립트 함수 작성

✍ script/member.js

JoinCheck() 함수 호출은 회원 가입 폼(join.jsp)에서 <확인> 버튼 소스코드에서 작성하였던 것이다.

✍ join.jsp 소스코드의 일부 화면

 // 위에 중복된 내용 생략
function joinCheck() {
	 // 여기서 document는 join.jsp를 의미함
	 if (document.frm.name.value.length == 0) {
	 	alert("이름을 작성해주세요.");
	 	frm.name.focus();
	 	return false;
	 }
	 if (document.frm.userid.value.length == 0) {
	 	alert("아이디를 입력해주세요.");
	 	frm.userid.focus();
	 	return false;
	 }
	  if (document.frm.userid.value.length < 4) {
	 	alert("아이디는 4글자 이상이어야 합니다.");
	 	frm.userid.focus();
	 	return false;
	 }
	  if (document.frm.pwd.value == "") {
	 	alert("암호는 반드시 입력하여야 합니다.");
	 	frm.pwd.focus();
	 	return false;
	 }
	  if (document.frm.pwd.value != document.frm.pwd_check.value) {
	 	alert("암호가 일치하지 않습니다!");
	 	frm.pwd.focus();
	 	return false;
	 }
	  if (document.frm.reid.value.length == 0) {
	 	alert("아이디 중복 체크를 하지 않았습니다.");
	 	frm.userid.focus();
	 	return false;
	 }
	 return true;
 }

입력된 회원 정보를 데이터베이스에 저장하기 위해서 반드시 아이디가 중복되지 않아야 한다.

→ 히든 태그인 reid에 값이 저장되어 있는지 확인한 후에 회원 가입 작업을 진행해야 한다.

✍ member/idcheck.jsp

                                                                            ↓

✍ script/member.js (위 코드에서 opener는 join.jsp, document는 idcheck.jsp를 의미함)

아이디 중복 체크가 완료된 후 아이디가 사용 가능하다고 판단이 되었을 때,  reid 태그에 값이 저장되는 것이다.

→ 히든 태그인 reid에 값이 저장되어 있을 때 (중복 체크가 완료되었을 때), 회원 가입 작업을 진행할 수 있다.

 

---

 

회원 정보를 입력한 후 <확인> 버튼을 클릭하였을 때 회원 정보를 데이터베이스에 추가하기 위해

join.jsp에서 <form> 태그의 action 속성에 join.do를 기술하였었다.

✍ member/join.jsp 소스코드의 일부 화면

 

join.do를 기술하여 JoinServlet 서블릿 클래스가 요청을 받는 것으로 설계를 하였다.

 

그런데 이미 로그인 페이지(login.jsp)에서 <회원 가입> 버튼이 클릭되었을 때 get 방식으로 join.do가 요청된 적이 있었으므로

✍ member/login.jsp

이번에는 post 방식으로 요청하여 데이터베이스 처리 작업을 수행하기 위해 <form> 태그의 method 속성에 post를 지정하였다.

✍ member/join.jsp

 

 

회원 가입이 성공적으로 이루어지면 다시 로그인 페이지(login.jsp)로 돌아가게 된다.

로그인 페이지로 돌아갈 때 회원 가입 시 입력한 아이디가 로그인 페이지로 넘어가기에 아이디를 입력할 필요가 없다.

 

회원 가입을 위한 입력 폼이 완성되었으므로 가입 정보를 받아와서 데이터베이스(member 테이블)에 추가하는 작업을 해야 한다.

→ DAO에 회원 가입을 위한 메서드 추가

 

회원 정보를 DB에 추가하기 위한 메서드 추가

 

✍ MemberDAO.java

밑에 JoinServlet.java 코드를 먼저 보고 이 코드를 봐야 이해하기 더 쉽다.

// 위의 중복된 내용 생략	
    // 회원 정보를 DB에 추가하는 메서드
	public int insertMember(MemberVO mvo) {
		int result = -1;
		String sql = "insert into member values(?, ?, ?, ?, ?, ?)";
		Connection conn = null;
		PreparedStatement pstmt = null;
		// 데이터를 굳이 조회할 필요가 없으므로 ResultSet 객체는 작성하지 않는다.
		try {
			conn = getConnection();
			pstmt = conn.prepareStatement(sql);
			pstmt.setString(1, mvo.getName());
			pstmt.setString(2, mvo.getUserid());
			pstmt.setString(3, mvo.getPwd());
			pstmt.setString(4, mvo.getEmail());
			pstmt.setString(5, mvo.getPhone());
			pstmt.setInt(6, mvo.getAdmin());
			result = pstmt.executeUpdate();
		} catch (Exception e) {
			e.printStackTrace();
		} finally {
			try {
				if (pstmt != null) pstmt.close();
				if (conn != null) conn.close();
			}catch(Exception e) {
				e.printStackTrace();
			} 
			}
		return result;
		}
	}

 

회원 정보를 데이터베이스에 추가하는 작업은 회원 가입 폼을 사용자에게 제공해주는 JoinServlet 서블릿 클래스에서

수행한다.

JoinServlet 서블릿 클래스에서 doGet() 함수에는 회원 가입을 위한 정보를 입력 받을 폼을 제공하는 join.jsp로 

이동하는 코드를 작성하였다.

doPost() 함수에는 데이터베이스 처리를 위한 코드를 작성하도록 한다.

 

✍ JoinServlet.java

package 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 dao.MemberDAO;
import dto.MemberVO;

@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 {
		// 회원 가입 폼에서 입력받은 한글이 깨지지 않도록 하기 위해 인코딩 설정
		request.setCharacterEncoding("UTF-8");
		
		// 회원 가입 폼(join.jsp)에서 입력한 회원 정보를 얻어온다.
		String name = request.getParameter("name");
		String userid = request.getParameter("userid");
		String pwd = request.getParameter("pwd");
		String email = request.getParameter("email");
		String phone = request.getParameter("phone");
		String admin = request.getParameter("admin");
		
		// MemberVO 객체인 mvo에 회원 가입 폼(join.jsp)에서 입력 받은 데이터를 저장한다.
		MemberVO mvo = new MemberVO();
		mvo.setName(name);
		mvo.setUserid(userid);
		mvo.setPwd(pwd);
		mvo.setEmail(email);
		mvo.setPhone(phone);
		mvo.setAdmin(Integer.parseInt(admin));
		
		MemberDAO mdao = MemberDAO.getInstance();
		int result = mdao.insertMember(mvo);
		
		HttpSession session = request.getSession();
		
		if (result == 1) {
			// session에 "userid"를 key로 설정하여 지금 막 회원 가입한 회원의 아이디를 값으로 저장해둔 채
			// login.jsp로 제어를 이동하여 로그인 작업을 할 때 아이디를 입력받는 수고를 덜어줌.
			session.setAttribute("userid", mvo.getUserid());
			request.setAttribute("message", "회원 가입에 성공하였습니다.");
		} else {
			request.setAttribute("message", "회원 가입에 실패하였습니다.");
		}
		
		// 회원 가입에 성공하면 로그인 페이지로 이동
		RequestDispatcher dispatcher = request.getRequestDispatcher("member/login.jsp");
		dispatcher.forward(request, response);
	}
}