회원가입
📍 Ajax : JS를 이용하여 비동기식으로 클라이언트와 서버가 데이터를 주고받는 방식
-
비동기 : 클라이언트가 서버로 데이터 요청 후 응답을 기다리지 않고 다른 작업 수행 가능. 추후 요청에 대한 응답이 오면 응답에 관련된 작업을 진행
-
전체 페이지를 갱신하지 않고 일부분만 업데이트 가능
<a href="/community/member/signUp">회원가입</a> <span>|</span> <a href="#">ID/PW 찾기</a><%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>KH 커뮤니티</title>
<link rel="stylesheet" href="../resources/css/main-style.css">
<link rel="stylesheet" href="../resources/css/signUp-style.css">
<script src="https://kit.fontawesome.com/8f020b2fa9.js"
crossorigin="anonymous"></script>
</head>
<body>
<main>
<jsp:include page="/WEB-INF/views/common/header.jsp"/>
<!-- 회원가입 -->
<section class="signUp-content">
<!-- 회원가입 화면 전환 주소(GET)와 같은 주소로
실제 회원가입을 요청(POST)
-> 요청 주소가 같아도 데이터 전달 방식이 다르면 중복 허용
-->
<!-- 절대경로 : /community/member/signUp
현재주소 : /community/member/signUp
상대경로 : signUp
-->
<form action="signUp" method="POST" name="signUp-form" onsubmit="return signUpValidate()">
<label for="memberEmail">
<span class="required">*</span> 아이디(이메일)
</label>
<div class="signUp-input-area">
<input type="text" id="memberEmail" name="memberEmail"
placeholder="아이디(이메일)" maxlength="30"
autocomplete="off" required>
<!-- autocomplete="off" : 자동완성 미사용 -->
<!-- required : 필수 작성 iunput 태그 -->
<button type="button">인증번호 받기</button>
</div>
<span class="signUp-message" id="emailMessage">메일을 받을 수 있는 이메일을 입력해주세요.</span>
<label for="emailCheck">
<span class="required">*</span> 인증번호
</label>
<div class="signUp-input-area">
<input type="text" id="emailCheck"
placeholder="인증번호 입력" maxlength="6"
autocomplete="off">
<button type="button">인증하기</button>
</div>
<span class="signUp-message confirm">인증되었습니다.</span>
<label for="memberPw">
<span class="required">*</span> 비밀번호
</label>
<div class="signUp-input-area">
<input type="password" id="memberPw" name="memberPw"
placeholder="비밀번호" maxlength="30">
</div>
<div class="signUp-input-area">
<input type="password" id="memberPwConfirm"
placeholder="비밀번호 확인" maxlength="30">
</div>
<span class="signUp-message" id="pwMessage">영어/숫자/특수문자(!,@,#,-,_) 6~30글자 사이로 작성해주세요</span>
<label for="memberNickname">
<span class="required">*</span> 닉네임
</label>
<div class="signUp-input-area">
<input type="text" id="memberNickname" name="memberNickname"
placeholder="닉네임" maxlength="10">
</div>
<span class="signUp-message" id="nicknameMessage">영어/숫자/한글 2~10글자 사이로 작성해주세요.</span>
<label for="memberTel">
<span class="required">*</span> 전화번호
</label>
<div class="signUp-input-area">
<input type="text" id="memberTel" name="memberTel"
placeholder="(- 없이 숫자만 입력)" maxlength="11">
</div>
<span class="signUp-message" id="telMessage">전화번호를 입력해주세요.(-제외)</span>
<label for="memberAddress">
<span class="required">*</span> 주소
</label>
<div class="signUp-input-area">
<input type="text" id="memberAddress" name="memberAddress"
placeholder="우편번호" maxlength="6">
<button type="button">검색</button>
</div>
<div class="signUp-input-area">
<input type="text" name="memberAddress" placeholder="도로명 주소">
</div>
<div class="signUp-input-area">
<input type="text" name="memberAddress" placeholder="상세주소">
</div>
<button type="submit" id="signUp-btn">가입하기</button>
</form>
</section>
</main>
<!-- footer include -->
<jsp:include page="/WEB-INF/views/common/footer.jsp"/>
<!-- jQuery 라이브러리 추가(CDN) 방식 -->
<script src="https://code.jquery.com/jquery-3.7.0.min.js" integrity="sha256-2Pmvv0kuTBOenSvLm6bvfBSSHrUJ+3A7x6P5Ebd07/g=" crossorigin="anonymous"></script>
<!-- signUp.js 연결 -->
<script src="${contextPath}/resources/js/member/signUp.js"></script>
</body>
</html>/* signUp.js */
// 유효성 검사 여부를 기록할 객체 생성
const checkObj = {
"memberEmail" : false,
"memberPw" : false,
"memberPwConfirm" : false,
"memberNickname" : false,
"memberTel" : false
};
//전화번호 유효성 검사
const memberTel = document.getElementById("memberTel");
const telMessage = document.getElementById("telMessage");
// ** input 이벤트 **
// -> 입력과 관련된 모든 동작 (Key 관련 mouse 관련 붙어넣기)
memberTel.addEventListener("input", function () {
//입력이 되지 않은 경우
if (memberTel.value.trim().length == 0) {
telMessage.innerText = "전화번호를 입력해주세요!!!!!!!!!.(-제외)";
//telMessage.classList.remove("error");
//telMessage.classList.remove("confirm")
telMessage.classList.remove("confirm", "error")
//유효하지 않은 상태임을 기록 (11_객체.js 복습하기 !)
checkObj.memberTel = false;
/* 입력이 되지 않으면 밑에 코드 수행하지 않게 return 작성 */
return;
}
// 전화번호 정규식
const regExp = /^0(1[01679]|2|[3-6][1-5]|70)\d{3,4}\d{4}$/;
if (regExp.test(memberTel.value)) { //유효한 경우
telMessage.innerText = "유효한 전화번호 형식입니다.";
telMessage.classList.add("confirm")
telMessage.classList.remove("error")
//유효한 상태임을 기록
checkObj.memberTel = true;
} else { //유효하지 않은 경우
telMessage.innerText = "전화번호 형식이 올바르지 않습니다.";
telMessage.classList.add("error")
telMessage.classList.remove("confirm")
//유효하지 않은 상태임을 기록
checkObj.memberTel = false;
}
})
// 이메일 유효성 검사
const memberEmail = document.getElementById("memberEmail");
const emailMessage = document.querySelector("#emailMessage");
memberEmail.addEventListener("input", function () {
//입력이 되지 않은 경우
if (memberEmail.value.trim().length == 0) {
emailMessage.innerText = "메일을 받을 수 있는 이메일을 입력해주세요."
emailMessage.classList.remove("confirm", "error")
//유효하지 않은 상태임을 기록
checkObj.memberEmail = false;
return;
}
//입력된 경우
const regExp = /^[\w\-\_]{4,}@[\w\-\_]+(\.\w+){1,3}$/;
if (regExp.test(memberEmail.value)) {
// **************** 이메일 중복 검사(ajax) 진행 예정 ****************
// $.ajax({K:V, K:V}); // jQuery ajax 기본 형태
// 입력된 이메일 == memberEmail.value
$.ajax({
url : "emailDupCheck", // 필수 속성 url
// 현재 주소 : /community/member/signUp
// 상대 경로 : /community/member/emailDupCheck
data : {"memberEmail" : memberEmail.value},
// data 속성 : 비동기 통신 시 서버로 전달할 값 작성(JS 객체 형식)
// -> 비동기 통신 시 input에 입력된 값을
// "memberEmail"이라는 key값(파라미터)으로 전달
type : "GET", // 데이터 전달 방식 type
success : function(result){
// 비동기 통신(ajax)가 오류 없이 요청/응답 성공한 경우
// 매개변수 result : servlet에서 출력된 result값
// console.log(result);
if(result == 1){ // 중복 O
emailMessage.innerText = "이미 사용 중인 이메일입니다.";
emailMessage.classList.add("error");
emailMessage.classList.remove("confirm");
checkObj.memberEmail = false;
} else{ // 중복 X
emailMessage.innerText = "사용 가능한 이메일입니다.";
emailMessage.classList.add("confirm");
emailMessage.classList.remove("error");
//유효한 상태임을 기록
checkObj.memberEmail = true;
}
},
error : function(){
// 비동기 통신(ajax) 중 오류가 발생한 경우
console.log("오류 발생")
}
});
} else {
emailMessage.innerText = "유효하지 않은 이메일 형식입니다.";
emailMessage.classList.add("error");
emailMessage.classList.remove("confirm");
//유효하지 않은 상태임을 기록
checkObj.memberEmail = false;
}
})
// 닉네임 유효성 검사
const memberNickname = document.getElementById("memberNickname")
const nicknameMessage = document.getElementById("nicknameMessage")
memberNickname.addEventListener("input", function () {
//입력되지 않은 경우
if (memberNickname.value.trim().length == 0) {
nicknameMessage.innerText = "영어/숫자/한글 2~10글자 사이로 작성해주세요."
nicknameMessage.classList.remove("confirm", "error")
//유효하지 않은 상태임을 기록
checkObj.memberNickname = false;
return;
}
const regExp = /^[a-zA-Z0-9가-힣]{2,10}$/
if (regExp.test(memberNickname.value)) { // 유효한 경우
// **************** 닉네임 중복 검사(ajax) 진행 예정 ****************
// /community/member/nicknameDupCheck
$.ajax({
url : "nicknameDupCheck", // 필수 작성 속성
data : {"memberNickname": memberNickname.value}, // 서버로 전달할 값 파라미터
type : "GET", // 데이터 전달 방식 (기본값 GET)
success : function(res){ // 비동기 통신 성공 시 (오류 발생 X)
// 매개변수 res : Servlet에서 응답으로 출력된 데이터가 저장
if(res == 1 ){ // 닉네임 중복 X
nicknameMessage.innerText = "이미 사용 중인 닉네임입니다.";
nicknameMessage.classList.add("error");
nicknameMessage.classList.remove("confirm");
checkObj.memberNickname = false;
} else{
nicknameMessage.innerText = "사용 가능한 닉네임입니다.";
nicknameMessage.classList.add("confirm");
nicknameMessage.classList.remove("error");
checkObj.memberNickname = true;
}
},
error : function(){ // 비동기 통신 중 오류가 발생한 경우
console.log("error");
}
})
} else {
nicknameMessage.innerText = "닉네임 형식이 유효하지 않습니다.";
nicknameMessage.classList.add("error");
nicknameMessage.classList.remove("confirm");
//유효하지 않은 상태임을 기록
checkObj.memberNickname = false;
}
})
//비밀번호 유효성 검사
const memberPw = document.getElementById("memberPw")
const memberPwConfirm = document.getElementById("memberPwConfirm")
const pwMessage = document.getElementById("pwMessage")
memberPw.addEventListener("input", function () {
//입력이 되지 않은 경우
if (memberPw.value.trim().length == 0) {
pwMessage.innerText = "영어, 숫자, 특수문자(!,@,#,-,_)6~30글자 사이로 작성해주세요.";
pwMessage.classList.remove("confirm", "error")
//유효하지 않은 상태임을 기록
checkObj.memberPw = false;
return;
}
const regExp = /^[\w!@#_-]{6,30}$/;
if (regExp.test(memberPw.value)) { // 비밀번호 유효한 경우
//유효하지 않은 상태임을 기록
checkObj.memberPw = true;
if (memberPwConfirm.value.trim().length == 0) { // 비밀번호 유효, 확인 작성 X
pwMessage.innerText = "유효한 비밀번호 형식입니다.";
pwMessage.classList.add("confirm");
pwMessage.classList.remove("error");
} else { // 비밀번호 유효, 확인 작성 O
checkPw() // 비밀번호 일치 검사 함수
}
} else {
pwMessage.innerText = "비밀번호 형식이 유효하지 않습니다.";
pwMessage.classList.add("error");
pwMessage.classList.remove("confirm");
//유효하지 않은 상태임을 기록
checkObj.memberPw = false;
}
});
// 비밀번호 확인 유효성검사
//함수명() : 함수 호출(수행)
//함수명 : 함수에 작성된 코드 반환
memberPwConfirm.addEventListener("input", checkPw);
// -> 이벤트가 발생되었을때 정의된 함수를 호출하겠다.
// 비밀번호 일치 여부 검사
function checkPw() {
//비밀번호 / 비밀번호 확인이 같을 경우
if (memberPw.value == memberPwConfirm.value) {
pwMessage.innerText = "비밀번호가 일치합니다.";
pwMessage.classList.add("confirm");
pwMessage.classList.remove("error");
//유효하지 않은 상태임을 기록
checkObj.memberPwConfirm = true;
} else {
pwMessage.innerText = "비밀번호가 일치하지 않습니다.";
pwMessage.classList.add("error");
pwMessage.classList.remove("confirm");
//유효하지 않은 상태임을 기록
checkObj.memberPwConfirm = false;
}
}
// 회원가입 버튼 클릭 시 유효성 검사가 완료 되었는지 확인하는 함수
function signUpValidate() {
//checkObj에 있는 모든 속성을 반복 접근하여
//false가 하나라도 있는 경우에는 form 태그 기본 이벤트 제거
let str;
//객체용 향상된 for문
for(let key in checkObj){
//현재 접근 중인 key의 value가 false 인 경우 실행이된다 !
if(!checkObj[key]){
switch(key){
case "memberEmail" : str="이메일이"; break;
case "memberPw" : str="비밀번호가"; break;
case "memberPwConfirm" : str="비밀번호 확인이"; break;
case "memberNickname" : str="닉네임이"; break;
case "memberTel" : str="전화번호가"; break;
}
str+=" 유효하지 않습니다.";
alert(str)
document.getElementById(key).focus();
return false; //form 태그 기본 이벤트 제거
}
}
return true; //form 태그 기본 이벤트 수행
}SignUpServlet
package edu.kh.community.member.controller;
import java.io.IOException;
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 edu.kh.community.member.model.service.MemberService;
import edu.kh.community.member.model.vo.Member;
@WebServlet("/member/signUp")
public class SignUpServlet extends HttpServlet {
// GET 방식 요청 시 JSP로 바로 응답할 수 있도록 요청 위임
@Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
String path = "/WEB-INF/views/member/signUp.jsp";
req.getRequestDispatcher(path).forward(req, resp);
}
// POST 방식 요청 시 회원가입 서비스 수행
@Override
protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
// 파라미터를 모두 변수에 저장
String memberEmail = req.getParameter("memberEmail");
String memberPw = req.getParameter("memberPw");
String memberNickname = req.getParameter("memberNickname");
String memberTel = req.getParameter("memberTel");
// 주소는 3개의 input으로 이루어져 있으므로 배열로 전달받음
// -> DB 컬럼은 1개이므로 배열을 하나의 문자열로 합칠 예정
String[] address = req.getParameterValues("memberAddress");
// 주소가 입력되지 않으면 null이 아니라 빈칸 3개
String memberAddress = null;
if(!address[0].equals("")) { // 우편번호가 빈칸이 아니라면 == 주소 작성
memberAddress = String.join(",,", address);
// String.join("구분자", 배열)
// -> 배열 요소를 하나의 문자열로 반환
// 요소 사이에 "구분자" 추가
}
// 파라미터를 하나의 Member 객체에 저장
Member mem = new Member();
mem.setMemberEmail(memberEmail);
mem.setMemberPw(memberPw);
mem.setMemberNickname(memberNickname);
mem.setMemberTel(memberTel);
mem.setMemberAddress(memberAddress);
try {
MemberService service = new MemberService();
// 회원가입 서비스 호출 후 결과 반환 받기
int result = service.signUp(mem);
// 서비스 결과에 따라서 message를 다르게 하여 메인 페이지 재요청(Redirect)
HttpSession session = req.getSession();
if(result>0) { // 성공
session.setAttribute("message", "회원가입 성공!!");
} else {
session.setAttribute("message", "회원가입 실패");
}
resp.sendRedirect(req.getContextPath()); // 메인 페이지로 돌아감
} catch (Exception e) {
e.printStackTrace();
}
}
}
service
/** 회원가입 Service
* @param mem
* @return result
* @throws Exception
*/
public int signUp(Member mem) throws Exception{
// 1) 커넥션 얻어오기
Connection conn = getConnection(); // DBCP에서 얻어옴
// 2) DAO 메소드 호출 후 결과 반환 받기
int result = dao.signUp(conn, mem);
// 3) 트랜잭션 처리
// result가 0인 경우 -> DAO return 구문 잘못 작성
if(result>0) conn.commit();
else conn.rollback();
// 4) conn 반환 (DBCP 돌려주기)
close(conn);
// 5) 결과 반환
return result;
}DAO
/** 회원가입 DAO
* @param conn
* @param mem
* @return result
* @throws Exception
*/
public int signUp(Connection conn, Member mem) throws Exception {
int result = 0;
try {
String sql = prop.getProperty("signUp");
pstmt = conn.prepareStatement(sql);
pstmt.setString(1, mem.getMemberEmail());
pstmt.setString(2, mem.getMemberPw());
pstmt.setString(3, mem.getMemberNickname());
pstmt.setString(4, mem.getMemberTel());
pstmt.setString(5, mem.getMemberAddress());
result = pstmt.executeUpdate();
} finally {
close(pstmt);
}
return result;
}<!-- 회원가입 -->
<entry key="signUp">
INSERT INTO MEMBER VALUES(SEQ_MEMBER_NO.NEXTVAL, ?, ?, ?, ?, ?, DEFAULT, DEFAULT, DEFAULT)
</entry>유효성 검사
닉네임
// 닉네임 유효성 검사
const memberNickname = document.getElementById("memberNickname")
const nicknameMessage = document.getElementById("nicknameMessage")
memberNickname.addEventListener("input", function () {
//입력되지 않은 경우
if (memberNickname.value.trim().length == 0) {
nicknameMessage.innerText = "영어/숫자/한글 2~10글자 사이로 작성해주세요."
nicknameMessage.classList.remove("confirm", "error")
//유효하지 않은 상태임을 기록
checkObj.memberNickname = false;
return;
}
const regExp = /^[a-zA-Z0-9가-힣]{2,10}$/
if (regExp.test(memberNickname.value)) { // 유효한 경우
// **************** 닉네임 중복 검사(ajax) 진행 예정 ****************
// /community/member/nicknameDupCheck
$.ajax({
url : "nicknameDupCheck", // 필수 작성 속성
data : {"memberNickname": memberNickname.value}, // 서버로 전달할 값 파라미터
type : "GET", // 데이터 전달 방식 (기본값 GET)
success : function(res){ // 비동기 통신 성공 시 (오류 발생 X)
// 매개변수 res : Servlet에서 응답으로 출력된 데이터가 저장
if(res == 1 ){ // 닉네임 중복 X
nicknameMessage.innerText = "이미 사용 중인 닉네임입니다.";
nicknameMessage.classList.add("error");
nicknameMessage.classList.remove("confirm");
checkObj.memberNickname = false;
} else{
nicknameMessage.innerText = "사용 가능한 닉네임입니다.";
nicknameMessage.classList.add("confirm");
nicknameMessage.classList.remove("error");
checkObj.memberNickname = true;
}
},
error : function(){ // 비동기 통신 중 오류가 발생한 경우
console.log("error");
}
})
} else {
nicknameMessage.innerText = "닉네임 형식이 유효하지 않습니다.";
nicknameMessage.classList.add("error");
nicknameMessage.classList.remove("confirm");
//유효하지 않은 상태임을 기록
checkObj.memberNickname = false;
}
})package edu.kh.community.member.controller;
import java.io.IOException;
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 edu.kh.community.member.model.service.MemberService;
// 닉네임 중복 검사(AJAX)
@WebServlet("/member/nicknameDupCheck")
public class NicknameDupCheckServlet extends HttpServlet {
@Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
// 파라미터 얻어오기(data 속성 값)
String memberNickname = req.getParameter("memberNickname");
try {
// 닉네임 중복 검사 Service 호출 후 결과 반환 받기
MemberService service = new MemberService();
int result = service.nicknameDupCheck(memberNickname);
// 동기식 -> forward 또는 redirect로 응답(화면 전환)
// 비동기식 -> 응답용 스트림을 이용해 데이터 전달(데이터가 현재 화면 추가)
resp.getWriter().print(result);
} catch (Exception e) {
e.printStackTrace();
}
}
}
/** 닉네임 중복 검사 service
* @param memberNickname
* @return result
* @throws Exception
*/
public int nicknameDupCheck(String memberNickname) throws Exception {
Connection conn = getConnection();
int result = dao.nicknameDupCheck(conn, memberNickname);
close(conn);
return result;
}/** 닉네임 중복 검사 DAO
* @param conn
* @param memberNickname
* @return result
* @throws Exception
*/
public int nicknameDupCheck(Connection conn, String memberNickname) throws Exception {
int result = 0;
try {
String sql = prop.getProperty("nicknameDupCheck");
pstmt = conn.prepareStatement(sql);
pstmt.setString(1, memberNickname);
rs = pstmt.executeQuery();
if(rs.next()) {
result = rs.getInt(1);
}
} finally {
close(rs);
close(pstmt);
}
return result;
}
<!-- 닉네임 중복 검사 -->
<entry key="nicknameDupCheck">
SELECT COUNT(*) FROM MEMBER
WHERE MEMBER_NICK = ?
AND SECESSION_FL = 'N'
</entry>이메일
// 이메일 유효성 검사
const memberEmail = document.getElementById("memberEmail");
const emailMessage = document.querySelector("#emailMessage");
memberEmail.addEventListener("input", function () {
//입력이 되지 않은 경우
if (memberEmail.value.trim().length == 0) {
emailMessage.innerText = "메일을 받을 수 있는 이메일을 입력해주세요."
emailMessage.classList.remove("confirm", "error")
//유효하지 않은 상태임을 기록
checkObj.memberEmail = false;
return;
}
//입력된 경우
const regExp = /^[\w\-\_]{4,}@[\w\-\_]+(\.\w+){1,3}$/;
if (regExp.test(memberEmail.value)) {
// **************** 이메일 중복 검사(ajax) 진행 예정 ****************
// $.ajax({K:V, K:V}); // jQuery ajax 기본 형태
// 입력된 이메일 == memberEmail.value
$.ajax({
url : "emailDupCheck", // 필수 속성 url
// 현재 주소 : /community/member/signUp
// 상대 경로 : /community/member/emailDupCheck
data : {"memberEmail" : memberEmail.value},
// data 속성 : 비동기 통신 시 서버로 전달할 값 작성(JS 객체 형식)
// -> 비동기 통신 시 input에 입력된 값을
// "memberEmail"이라는 key값(파라미터)으로 전달
type : "GET", // 데이터 전달 방식 type
success : function(result){
// 비동기 통신(ajax)가 오류 없이 요청/응답 성공한 경우
// 매개변수 result : servlet에서 출력된 result값
// console.log(result);
if(result == 1){ // 중복 O
emailMessage.innerText = "이미 사용 중인 이메일입니다.";
emailMessage.classList.add("error");
emailMessage.classList.remove("confirm");
checkObj.memberEmail = false;
} else{ // 중복 X
emailMessage.innerText = "사용 가능한 이메일입니다.";
emailMessage.classList.add("confirm");
emailMessage.classList.remove("error");
//유효한 상태임을 기록
checkObj.memberEmail = true;
}
},
error : function(){
// 비동기 통신(ajax) 중 오류가 발생한 경우
console.log("오류 발생")
}
});
} else {
emailMessage.innerText = "유효하지 않은 이메일 형식입니다.";
emailMessage.classList.add("error");
emailMessage.classList.remove("confirm");
//유효하지 않은 상태임을 기록
checkObj.memberEmail = false;
}
})package edu.kh.community.member.controller;
import java.io.IOException;
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 edu.kh.community.member.model.service.MemberService;
@WebServlet("/member/emailDupCheck")
public class EmailDupCheckServlet extends HttpServlet {
// 이메일 중복 검사(비동기 통신)
@Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
// 비동기 통신으로 전달된 파라미터(data 속성의 key값)얻어오기
String memberEmail = req.getParameter("memberEmail");
try {
// 이메일 중복 검사 서비스 호출 후 결과 반환 받기
MemberService service = new MemberService();
int result = service.emailDupCheck(memberEmail);
// 보통 동기식 코드 작성 시
// forward, redirect를 이용해서 새로운 페이지가 보이게 동작
// *** 비동기 통신 시 응답은 화면이 아닌 데이터(String, XML, JSON, int...)
// -> 응답용 스트림을 이용해서 단순 데이터 전달만 하면 된다.
resp.getWriter().print(result);
// 응답 스트림을 이용해서 result 출력
} catch (Exception e) {
e.printStackTrace();
}
}
}
/** 이메일 중복 검사 service
* @param memberEmail
* @return result
* @throws Exception
*/
public int emailDupCheck(String memberEmail) throws Exception {
Connection conn = getConnection(); // DBCP에서 만들어둔 커넥션 얻어오기
int result = dao.emailDupCheck(conn, memberEmail);
close(conn);
return result;
}
/** 이메일 중복 검사 DAO
* @param conn
* @param memberEmail
* @return result
* @throws Exception
*/
public int emailDupCheck(Connection conn, String memberEmail) throws Exception {
int result = 0;
try {
// SQL 얻어오기
String sql = prop.getProperty("emailDupCheck");
// pstmt 생성
pstmt = conn.prepareStatement(sql);
// 위치홀더에 알맞은 값 세팅
pstmt.setString(1, memberEmail);
// SQL(SELECT) 수행 후 결과 반환 받기
rs = pstmt.executeQuery();
// rs.next()로 조회결과 확인
if(rs.next()) {
result = rs.getInt(1); // 1번 컬럼 결과를 result에 대입
}
} finally {
close(rs);
close(pstmt);
}
return result;
}
<!-- 이메일 중복 검사 -->
<entry key="emailDupCheck">
SELECT COUNT(*) FROM MEMBER
WHERE MEMBER_EMAIL=?
AND SECESSION_FL='N'
</entry>
개발 일지