개발일지/JSP
[JSP] 로그인 화면 분석하기③
연습용365
2021. 11. 29. 01:49
<user/userRegForm.jsp>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ page import="com.icia.common.util.StringUtil" %>
<%@ page import="com.icia.web.util.CookieUtil" %>
<%@ page import="com.icia.web.util.HttpUtil" %>
<%@ page import="com.icia.web.dao.UserDao" %>
<%@ page import="com.icia.web.model.User" %>
<%@ page import="org.apache.logging.log4j.LogManager" %>
<%@ page import="org.apache.logging.log4j.Logger" %>
<%
//로그
Logger logger = LogManager.getLogger("/user/userRegForm.jsp");
//현재 소스이름 넣으면 알아서 찍어주는 용도라서 틀려도 괜찮음
HttpUtil.requestLogString(request, logger);
//HttpUtil 사용 //값을 담음
//회원가입 가능 여부
boolean bSuccess = false;
//쿠키 정보 가져오기
String cookieUserId = CookieUtil.getValue(request, "USER_ID");
//클라이언트에서 넘어 온 쿠키 정보를 읽는 메소드
//"USER_ID" 비어있는 경우 로그인이 안 돼 있다는 뜻
if(!StringUtil.isEmpty(cookieUserId)) //쿠키 값이 있다면?
{
//쿠키정보가 있을때
logger.debug("cookie UserId : " + cookieUserId);
//콘솔창에 뜸
UserDao userDao = new UserDao(); //객체생성
User user = userDao.userSelect(cookieUserId);
//정보 갖고옴. 당연히 쿠키니까 아이디를 인수값으로 넘김
if(user != null)
//유저 정보에는 없는데 쿠키가 있다? 뭔가 잘못됨 ㄱ-
//때문에 쿠키를 날려버리고 로그인 페이지로 넘어가야 한다.
{
//사용자 정보가 있다면 //Status Y인가요?
//if(user.getStatus().equals("Y")) //StringUtil이 없을 때
if(StringUtil.equals(user.getStatus(), "Y")) //메소드 사용
{
//정상 사용자인 경우라면 페이지로 이동
response.sendRedirect("/board/list.jsp");
}
else
{
//정지사용자인 경우 쿠키를 삭제하고 로그인 페이지로 이동
CookieUtil.deleteCookie(request, response, "USER_ID"); //삭제 메소드
response.sendRedirect("/index.jsp");
//아래 거 복사한 거임
}
}
else //정보 없음
{
CookieUtil.deleteCookie(request, response, "USER_ID"); //쿠키 날림
response.sendRedirect("/index.jsp"); //응답으로 페이지를 보낸다
}
}
else //쿠키가 없을 때
{
bSuccess = true;
//정상적인 회원가입
//아래의 페이지를 보여줌
}
if(bSuccess == true)
{
%>
<!DOCTYPE html>
<html>
<head>
<%@ include file="/include/head.jsp" %>
<script type="text/javascript">
$(document).ready(function() {
$("#userId").focus();
$("#btnReg").on("click", function() {
//Ajax통신 화면에 안 보이지만 이 때 함께 실행된다.
// 모든 공백 체크 정규식
var emptCheck = /\s/g;
// 영문 대소문자, 숫자로만 이루어진 4~12자리 정규식
var idPwCheck = /^[a-zA-Z0-9]{4,12}$/;
if($.trim($("#userId").val()).length <= 0)
{
alert("사용자 아이디를 입력하세요.");
$("#userId").val("");
$("#userId").focus();
return;
}
if (emptCheck.test($("#userId").val()))
{
alert("사용자 아이디는 공백을 포함할 수 없습니다.");
$("#userId").focus();
return;
}
if (!idPwCheck.test($("#userId").val()))
{
alert("사용자 아이디는 4~12자의 영문 대소문자와 숫자로만 입력하세요");
$("#userId").focus();
return;
}
if($.trim($("#userPwd1").val()).length <= 0)
{
alert("비밀번호를 입력하세요.");
$("#userPwd1").val("");
$("#userPwd1").focus();
return;
}
if (emptCheck.test($("#userPwd1").val()))
{
alert("비밀번호는 공백을 포함할 수 없습니다.");
$("#userPwd1").focus();
return;
}
if (!idPwCheck.test($("#userPwd1").val()))
{
alert("비밀번호는 영문 대소문자와 숫자로 4~12자리 입니다.");
$("#userPwd1").focus();
return;
}
if ($("#userPwd1").val() != $("#userPwd2").val())
{
alert("비밀번호가 일치하지 않습니다.");
$("#userPwd2").focus();
return;
}
if($.trim($("#userName").val()).length <= 0)
{
alert("사용자 이름을 입력하세요.");
$("#userName").val("");
$("#userName").focus();
return;
}
if(!fn_validateEmail($("#userEmail").val()))
{
alert("사용자 이메일 형식이 올바르지 않습니다.");
$("#userEmail").focus();
return;
}
$("#userPwd").val($("#userPwd1").val());
$.ajax({
type : "POST",
url : "/user/userIdCheckAjax.jsp",
data : {
userId : $("#userId").val()
},
datatype : "JSON",
success : function(obj) {
var data = JSON.parse(obj);
if(data.flag == 0)
{
document.regForm.submit();
}
else
{
alert("중복된 아이디 입니다.");
}
},
complete : function(data) {// 응답이 종료되면 실행, 잘 사용하지않는다
console.log(data);
},
error : function(xhr, status, error) {
alert("아이디 중복 체크 에러!");
}
});
});
});
function fn_validateEmail(value)
{
var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
return emailReg.test(value);
}
</script>
</head>
<body>
<%@ include file="/include/navigation.jsp" %>
<div class="container">
<div class="row mt-5">
<h1>회원가입</h1>
</div>
<div class="row mt-2">
<div class="col-12">
<form id="regForm" name="regForm" action="/user/userProc.jsp" method="post">
<!-- DB에 Insert를 하는 애 -->
<div class="form-group">
<label for="username">사용자 아이디</label>
<input type="text" class="form-control" id="userId" name="userId" placeholder="사용자 아이디" maxlength="12" />
</div>
<div class="form-group">
<label for="username">비밀번호</label>
<input type="password" class="form-control" id="userPwd1" name="userPwd1" placeholder="비밀번호" maxlength="12" />
</div>
<div class="form-group">
<label for="username">비밀번호 확인</label>
<input type="password" class="form-control" id="userPwd2" name="userPwd2" placeholder="비밀번호 확인" maxlength="12" />
</div>
<div class="form-group">
<label for="username">사용자 이름</label>
<input type="text" class="form-control" id="userName" name="userName" placeholder="사용자 이름" maxlength="15" />
</div>
<div class="form-group">
<label for="username">사용자 이메일</label>
<input type="text" class="form-control" id="userEmail" name="userEmail" placeholder="사용자 이메일" maxlength="30" />
</div>
<input type="hidden" id="userPwd" name="userPwd" value="" /> //hidden 개발자가 작성
<button type="button" id="btnReg" class="btn btn-primary">등록</button>
</form>
</div>
</div>
</div>
</body>
</html>
<%
}
//이렇게 괄호를 닫음
%>
등록 버튼 눌렀을 때
실제로 DB에 Insert 서브밋 하기 전 값을 다 체크해야한다.
이 아이디가 가입 돼 있는 아이디가 아닌지 중복 여부 체크
그걸 체크하기 위해서는 userIdCheckAjax.jsp 파일을 만들어 주어야함~
자바를 만들 때는 src/main/java에서 만들지만~
jsp 만들 때는 무조건 webapp에서 만든다!!!
<user/userIdCheckAjax.jsp>
회원가입 할 때의 아이디 중복체크
다 복사해 온 것임~
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ page import="com.icia.common.util.StringUtil" %>
<%@ page import="com.icia.web.util.CookieUtil" %>
<%@ page import="com.icia.web.util.HttpUtil" %>
<%@ page import="com.icia.web.dao.UserDao" %>
<%@ page import="com.icia.web.model.User" %>
<%@ page import="org.apache.logging.log4j.LogManager" %>
<%@ page import="org.apache.logging.log4j.Logger" %>
<%
//로그
Logger logger = LogManager.getLogger("/user/userIdCheckAjax.jsp");
//현재 소스 찍어만 주는 용도임
HttpUtil.requestLogString(request, logger);
String userId = HttpUtil.get(request, "userId");
//클라이언트에서 넘어오는 값 "userId"를 변수에 담을 거임
//""안의 이름과 userRegForm>ajax>data: { userId : $("#userId").val() },
if(!StringUtil.isEmpty(userId))
{
UserDao userDao = new UserDao();
if(userDao.userIdSelectCount(userId) <= 0)
{
//사용가능 ID
response.getWriter().write("{\"flag\":0}");
}
else //값이 안 넘어 옴
{
//존재하는 ID
response.getWriter().write("{\"flag\":1}");
}
}
else
{
response.getWriter().write("{\"flag\":-1}"); //값 없음
}
%>
<userProc.jsp>
userRegForm에서 넘어 온 값을 다 받아 준다.
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ page import="com.icia.common.util.StringUtil" %>
<%@ page import="com.icia.web.util.CookieUtil" %>
<%@ page import="com.icia.web.util.HttpUtil" %>
<%@ page import="com.icia.web.dao.UserDao" %>
<%@ page import="com.icia.web.model.User" %>
<%@ page import="org.apache.logging.log4j.LogManager" %>
<%@ page import="org.apache.logging.log4j.Logger" %>
<%
//로그
Logger logger = LogManager.getLogger("/user/userProc.jsp");
HttpUtil.requestLogString(request, logger);
String redirectUrl = "";
String msg = "";
String userId = HttpUtil.get(request, "userId");
String userPwd = HttpUtil.get(request, "userPwd");
String userName = HttpUtil.get(request, "userName");
String userEmail = HttpUtil.get(request, "userEmail");
//userRegForm 값을 다 받아서 지역변수에 넣음
String cookieUserId = CookieUtil.getValue(request, "userId");
//얘만 CookieUtil에서 받아 와야함
//용도 2 (회원가입 - 쿠키정보X, 회원정보수정 - 쿠키정보O)
UserDao userDao = new UserDao();
if(StringUtil.isEmpty(cookieUserId)) //비어 있어?
{
//클라이언트 화면에서 Jquery를 다 체크 했다. (위에서 다 체크함)
//서버에서도 체크 하기 위해서 여기서도 체크함
//회원 가입
if(!StringUtil.isEmpty(userId) && !StringUtil.isEmpty(userPwd) &&
!StringUtil.isEmpty(userName) && !StringUtil.isEmpty(userEmail))
//하나도 비어져 있으면 안 되기 때문에 ||가 아니라 &&를 했음
{
if(userDao.userIdSelectCount(userId) > 0) //카운트가 0 이어야함
{
//중복아이디 존재
msg = "사용자 아이디가 존재 합니다.";
redirectUrl = "/user/userRegForm"; //다시 가입 페이지
}
else
{
//회원 가입(INSERT)
//insert 메소드의 매개변수를 User로 받으니까 User 객체 생성을 한다.
User user = new User();
user.setUserId(userId);
user.setUserPwd(userPwd);
user.setUserName(userName);
user.setUserEmail(userEmail);
user.setStatus("Y");
//user객체에 값을 넣어 보냄
//해당 메소드 콜
if(userDao.userInsert(user) > 0)
{
msg = "회원가입이 완료 되었습니다.";
redirectUrl = "/"; //index.jsp
}
else
{
msg = "회원가입중 오류가 발생했습니다.";
redirectUrl = "/user/userRegForm.jsp";
}
}
}
else
{
msg = "회원가입 중 입력값이 잘 못 되었습니다.";
redirectUrl = "/user/userRegForm.jsp";
//회원가입 페이지로 다시 가줘야 한다.
}
}
else
{
//회원 정보 수정
}
%>
<!DOCTYPE html>
<html>
<head>
<%@ include file="/include/head.jsp" %>
<script type="text/javascript">
$(document).ready(function() {
alert("<%=msg%>");
location.href = "<%=redirectUrl%>";
});
</script>
</head>
<body>
</body>
</html>
기술 면접 TIP!!
- 회사에서 하는 것 처럼 시도해 보려고 공통 모듈 빼서 사용해 봤습니다. 하면 됨~!