본문 바로가기

개발일지/JSP

[JSP] 로그인 화면 분석 ④ (쿠키 적용, 로그아웃, nav 자동변경)

** log4j 관련 파일 **
WEB-INF > conf >  log4j
자동으로 log 파일이 만들어진다.

 

**로그 관련 파일 **
web.xml (복붙)
log4j가 어디있다 알려주면서 한글 깨지는 문제 처리 해주는 부분

 

**HttpEncodingFilter**
init - 처음에 단 한 번 로딩이 되는 것

 

 

- SQLDeveloper 가서 한글 깨진 레코드 삭제함
- WAS 실행
- http://localhost:8088/ 접속 - 회원가입
- 콘솔창에 /user/userRegForm.jsp 뜬다.

  Logger logger = LogManager.getLogger("/user/userRegForm.jsp");
  userRegForm.jsp 이 파일에서 설정한 로그 찍어준거임
- 콘솔창에 넘어간 게 뜸
- SQLD에도 잘 넘어갔음
- 이클립스에서 지원하는 디버그는 한 단계 한 단계 처리를 한다.
- 잘 안 되는 경우 벌레를 눌러서 해제 시켜주면 됨

 

** 로그인 유무는 쿠키의 userId(값)을 보고 판단한다.
userId값이 존재 하면 로그인이 된 거임
로그인이 될 경우 navbar가 ( 로그아웃 / 회원 정보 수정 / 게시판 ) 변경됨
- 쿠키 확인 F12 (Application - Cookies)

 


< navigation.jsp 수정>
매개 변수에서 받아서 처리하는 게 공통적임

 

공통모듈로 많이 사용되는 메소드 : 성별 리턴, request 받아서 처리

 

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ page import="com.icia.web.util.CookieUtil" %>
<!-- 웹에서만 사용하는 모듈은 웹 페이지에 넣음 -->
<%@ page import="com.icia.common.util.StringUtil" %>
<!-- 앱전용으로 들어갔건 공통으로 사용하는 건 common -->
<!-- 공통모듈 : 내부적인 것들은 내가 다 만들었으니까 매개변수만 넘겨 결과는 내가 줄게! -->

<!-- 쿠키에 정보가 있을 때(로그인) -->
<%
   if(!StringUtil.isEmpty(CookieUtil.getValue(request, "USER_ID")))
   {   //로그인 성공 //중괄호 닫고 나서 주석을 써야한다.
%>      
<!--로그인이 되었을 때 추가 되어야함-->
 <nav class="navbar navbar-expand-sm bg-secondary navbar-dark mb-3"> 
   <ul class="navbar-nav"> 
       <li class="nav-item"> 
         <a class="nav-link" href="/loginOut.jsp">로그아웃</a> 
       </li> 
       <li class="nav-item"> 
         <a class="nav-link" href="/user/userUpdateForm.jsp">회원정보수정</a> 
       </li>
       <li class="nav-item"> 
         <a class="nav-link" href="/user/list.jsp">게시판</a> 
       </li> 
   </ul>      
 </nav>
<%          
   }
   else
   {   //로그인 실패
%>
<!--로그인이 안 되어 있을 때-->
 <nav class="navbar navbar-expand-sm bg-secondary navbar-dark mb-3"> 
   <ul class="navbar-nav"> 
       <li class="nav-item"> 
         <a class="nav-link" href="/">로그인</a> 
       </li> 
       <li class="nav-item"> 
         <a class="nav-link" href="/user/userRegForm.jsp">회원가입</a> 
       </li> 
  </ul>
 </nav>
 
<%
   }
%>

 

nav <a>를 선택했을 때 각각에서 걸어 놓은 페이지(href)로 이동을 하게 되는 것이다.

 


<loginOut.jsp>

로그아웃을 담당 하는 파일로 네비게이션의 로그아웃을 눌렀을 때 쿠키가 있다면 삭제 되고, 없으면 메인으로 이동한다.

 

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ page import="com.icia.web.util.CookieUtil" %>
<%@ page import="com.icia.web.util.HttpUtil" %>
<%@ page import="org.apache.logging.log4j.LogManager" %>
<%@ page import="org.apache.logging.log4j.Logger" %>
<%
   //로그
   Logger logger = LogManager.getLogger("/loginOut.jsp");
   HttpUtil.requestLogString(request, logger);
   
   //쿠키가 있다면 삭제
   if(CookieUtil.getCookie(request, "USER_ID") != null) //null과 같지 않다 = 값이 있다
   {
	   CookieUtil.deleteCookie(request, response, "USER_ID");
   }
   //쿠키 없으면 메인
   response.sendRedirect("/"); //메인으로 이동 index.jsp
 %>

 

 

 

<loginProcAjax.jsp>

원래 페이지에서 수정이 있었다. 로그인 했을 때 쿠키가 적용이 될 수 있도록 바꿔줬다. 쿠키 확인은 로그인 하고 나서 F12를 통해서 확인 할 수 있다. 로그는 굳이 찍지 않아도 되지만 콘솔창에서 개발자가 보기 편하도록 추가 해주었다. 

<%@ 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/loginProcAjax.jsp");
   HttpUtil.requestLogString(request, logger);
   
   String userId = HttpUtil.get(request, "userId");
   String userPwd = HttpUtil.get(request, "userPwd");
   String cookieUserId = CookieUtil.getValue(request, "USER_ID"); //쿠키 정보
   
   logger.debug("loginProcAjax.jsp Cookie UserId : " + cookieUserId);
   
 	//로그인해야 되는데 쿠키 정보가 있을 땐 날린다.
   if(!StringUtil.isEmpty(cookieUserId))
   {
      //쿠키정보가 있다면 쿠키 삭제(아이디)
      	CookieUtil.deleteCookie(request, response, "UserId");
      	logger.debug("쿠키[" + cookieUserId + "]삭제");
    	//로그를 안찍어도 상관 없지만 정보에 대한 걸 알기 위해서
   }   
   if(!StringUtil.isEmpty(userId) && !StringUtil.isEmpty(userPwd))
   {
      //정상 파라미터를 받았을 때
      UserDao userDao = new UserDao();
      User user = userDao.userSelect(userId); 
      
      //플래그만 넣고 따로 추가하지 않음
      //여기서 null은 userDao 59줄에서 멈춘 것. 아래 트라이 캐치에서 객체 생성을 못한것임
      if(user != null)
      {
         if(user.getStatus().equals("Y"))
         {
            if(user.getUserPwd().equals(userPwd))
            {  
            	//로그 찍기
               logger.debug("아이디[" + userId + "] 비밀번호 [" + userPwd + "] 로그인");
               //쿠키생성
               CookieUtil.addCookie(response, "USER_ID", userId);
               response.getWriter().write("{\"flag\": 0}"); //콘솔창에서 실행하면 뜨는 로그!
            }   
            else
            {
               //비밀번호 불일치
               logger.debug("아이디[" + userId + "] 비밀번호 [" + userPwd + "] 가 일치하지 않습니다.");
               response.getWriter().write("{\"flag\": -1}");
            }
         }
         else
         {
            //정지된 사용자
            logger.debug("아이디[" + userId + "] 는 정지된 아이디입니다.");
            response.getWriter().write("{\"flag\": -2}");
         }
      }
      else 
      {   
         //아이디 정보 없음
         logger.debug("아이디[" + userId + "] 정보가 없습니다.");
         response.getWriter().write("{\"flag\": -3}");
      }
   }
   else
   {
      //파라미터값 오류시
      response.getWriter().write("{\"flag\": -500}");
   }   
%>

 

 

 

<user/userUpdateForm.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/userUpdateForm.jsp");
HttpUtil.requestLogString(request, logger);

User user = null;
String cookieUserId = CookieUtil.getValue(request, "USER_ID");

//비어있지 않으면 로그인 돼 있으면
if(!StringUtil.isEmpty(cookieUserId))
{
	//쿠키 정보가 있다면
	logger.debug("cookieUserId : " + cookieUserId);
	
	UserDao userDao = new UserDao();
	user = userDao.userSelect(cookieUserId); //정보를 이렇게 넘김
	
	//DB에 없는 정상사용자가 아님
	if(user == null)
	{
		//정상 사용자가 아니라면 쿠키를 삭제하고 로그인 페이지로 이동
		CookieUtil.deleteCookie(request, response, "USER_ID");
		response.sendRedirect("/"); //index 페이지로 이동
	}
	else
	{
		if(!StringUtil.equals(user.getStatus(), "Y"))
		{
			//정지된 사용자인경우
			CookieUtil.deleteCookie(request, response, "USER_ID");
			user = null;
			
			response.sendRedirect("/");
			
		}
	}
}

if(user != null)
{
	//user가 null과 같지 않을 때
	
%>

<!DOCTYPE html>
<html>
<head>
<%@ include file="/include/head.jsp" %>

</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 name="updateForm" id="updateForm" action="/user/userProc.jsp" method="post">
                <div class="form-group">
                    <label for="username">사용자 아이디</label>
                    <!-- 하드코딩에서 넣어준다 -->
                    <%=user.getUserId()%>
                    <!-- user객체의 get으로 갖고온다. -->
                </div>
                <div class="form-group">
                    <label for="username">비밀번호</label>
                    <input type="password" class="form-control" id="userPwd1" name="userPwd1" value="<%=user.getUserPwd()%>" placeholder="비밀번호" maxlength="12" />
                </div>
                <div class="form-group">
                    <label for="username">비밀번호 확인</label>
                    <input type="password" class="form-control" id="userPwd2" name="userPwd2" value="<%=user.getUserPwd()%>" placeholder="비밀번호 확인" maxlength="12" />
                </div>
                <div class="form-group">
                    <label for="username">사용자 이름</label>
                    <input type="text" class="form-control" id="userName" name="userName" value="<%=user.getUserName()%>" placeholder="사용자 이름" maxlength="15" />
                </div>
                <div class="form-group">
                    <label for="username">사용자 이메일</label>
                    <input type="text" class="form-control" id="userEmail" name="<%=user.getUserEmail()%>" value="ttt@icia.co.kr" placeholder="사용자 이메일" maxlength="30" />
                </div>
                <input type="hidden" id="userId" name="userId" value="<%=user.getUserId()%>" />
                <input type="hidden" id="userPwd" name="userPwd" value="" />
                <button type="button" id="btnUpdate" class="btn btn-primary">수정</button>
            </form>
        </div>
    </div>
</div>
</body>
</html>
<%
}
%>