본문 바로가기
JSP

Servlet 과 JSP를 이용한(모델2 형식) 블로그 만들기(5) - 세션과 로그아웃

by 김마리님 2020. 6. 1.

 

Servlet 과 JSP를 이용한(모델2 형식) 블로그 만들기(4) - 로그인 하기

 

Servlet 과 JSP를 이용한(모델2 형식) 블로그 만들기(4) - 로그인 하기

Servlet 과 JSP를 이용한(모델2 형식) 블로그 만들기(3) - 부트스트랩을 이용한 웹 폼 만들기 Servlet 과 JSP를 이용한(모델2 형식) 블로그 만들기(3) - 부트스트랩을 이용한 웹 폼 만들기 웹페이지를 만들

itstudy-mary.tistory.com

 

마지막 화면을 가만 보면 거 참 애매하다.

로그인을 해서 들어왔는데, 다시 로그인과 회원가입이 있다? 이걸 구분하는 분기는 어디인가? 바로 세션에 값이 있는가 없는가이다.

간단하다. 네비게이션 바 파일로 가서 if else 구문으로 나누는 것이다.

앞서서 홈 파일에 있던 세션구문을 지우고 nav 파일로 이동한다.

파일에서 세션이 유효하고/ 유효하지 않음에 따라 뜨는 링크 구문을 다르게 지정한다.

 

-nav.jsp

<%@page import="com.cos.blog.model.Users"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
    
 <% 
    Users principal=(Users)session.getAttribute("principal");
 %>
<!DOCTYPE html>
<html lang="en">
<head>
  <title>Mary Blog</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js"></script>
</head>
<body>

<nav class="navbar navbar-expand-md bg-dark navbar-dark">
  <a class="navbar-brand" href="index.jsp">Mary Blog</a>
  <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#collapsibleNavbar">
    <span class="navbar-toggler-icon"></span>
  </button>
  <div class="collapse navbar-collapse" id="collapsibleNavbar">
    <ul class="navbar-nav">
    
    <% if(principal==null){%>
      <li class="nav-item">
        <a class="nav-link" href="/blog/user?cmd=login">로그인</a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="/blog/user?cmd=join">회원가입</a>
        
    <%}else{ %>
          <li class="nav-item">
        <a class="nav-link" href="/blog/board?cmd=write">글쓰기</a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="/blog/user?cmd=update">회원정보</a>
      </li>   
      <li class="nav-item">
        <a class="nav-link" href="/blog/user?cmd=logout">로그아웃</a>       
     <%} %>       
     
      </li>  
    </ul>
  </div>  
</nav>
<br>

또, 로그아웃을 하면 세션을 삭제해야하니 이것에 대한 액션을 추가해보자.

 

-UsersController.java의 router부분

	public Action router(String cmd) {
		if(cmd.equals("join")) {
			return new UsersJoinAction();
		}else if(cmd.equals("joinProc")) {
			//회원가입 진행 후 -> index.jsp 이동
			return new UsersJoinProcAction();
		}else if(cmd.equals("update")) {
			//회원 수정 페이지 이동(세션에 user object를 가지고 있을 예정)
		}else if(cmd.equals("updateProc")) {
			//회원 수정 진행 -> index 이동
		}else if(cmd.equals("delete")) {
			//회원 삭제 진행 후 -> 로그아웃 -> index.jsp
		}else if(cmd.equals("login")) {
			//회원 로그인 페이지로 이동
			return new UsersLoginAction();
		}else if(cmd.equals("loginProc")) {
			return new UsersLoginProcAction();
			//로그인 수행 -> 세션 등록 -> index.jsp
		}else if(cmd.equals("logout")) {
			return new UsersLogoutAction();
			//로그아웃 수행 -> index.jsp
		}
		return null;
	}

 

이 연결된 액션도 생성해보자.

 

-UsersLogoutAction.java

public class UsersLogoutAction implements Action {
	@Override
	public void execute(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
		HttpSession session=request.getSession();
		session.invalidate();
		
		//session.removeAttribute("principal");
		
		Script.href("로그아웃되었습니다.", "index.jsp", response);
	}
}

세션을 삭제하는 방법이 두 가지가 있는데, 주석처리된 부분은 요청시에만 세션이 삭제되고 사용한 invalidate는 세션을 무효화 시킨다. 주로 윗방법을 많이 쓴다.

로그아웃이 되면 홈페이지로 돌아가기 위해 controller->action으로 돌아가기 위해 만들어둔 스크립트를 이용한다.

결과를 보면,

 

- 로그인 세션이 남을때 네비게이션 바의 변화

 

 

- 로그아웃

반응형