so woon!

로그아웃 구현 본문

Spring Boot/개념정리

로그아웃 구현

xowoony 2023. 1. 29. 08:33

로그인을 했으면 로그아웃을 해야겠징..

 

 

MemberController.java

로그아웃 버튼을 누르면

session에 있던 user를 null로 만들어 주면 된다.

 

로그아웃 후에는 다시 로그인 페이지로 데려다 주기 위해서

modelAndView 를 이용하여 redirect 하여

로그인페이지로 가게끔 해준다.

MedelAndView modelAndView = new ModelAndView("redirect:login");

이렇게 말이다.

//로그아웃
@RequestMapping(value = "logout",
        method = RequestMethod.GET,
        produces = MediaType.TEXT_HTML_VALUE)
public ModelAndView getLogout(HttpSession session) {
    session.setAttribute("user", null);
    ModelAndView modelAndView = new ModelAndView("redirect:login");
    return modelAndView;
}

 

 

 

body.html

나는 body.html을 만들때

가장 먼저 생각했던 것이

로그인을 했을 경우의 드롭다운 메뉴와

로그아웃 상태에서의 드롭다운 메뉴가 다르게 나와야 한다는 것이었다.

로그아웃 상태일때는

이렇게 [시작하기] 쪽에 hover시 드롭다운 메뉴가 형성되지 않게끔 하고 싶었고

로그인 했을 경우 [시작하기] -> [유저의 닉네임] 으로 바뀌고

hover시 드롭다운 메뉴가 마이페이지와 로그아웃이 나오게끔 하고싶었다.

 

이는 타임리프 문법으로 해결하였는데

th:if를 사용하여

 

1. 로그아웃 상태일 경우

th:if="${session.user == null}" 을 적어주고

<li class="start" th:if="${session.user == null}">
    <i class="fa-sharp fa-solid fa-user icon"></i>
    <span>
      <a class="login" th:href="@{/member/login}">시작하기</a>
    </span>
</li>

2. 로그인한 상태일 경우

th:if="${session.user != null}" 을 적어준다.

 

3. 또한 관리자가 로그인 했을 경우

드롭다운 메뉴에 관리자 모드를 하나 더 추가시켜 주기 위해

<!-- 관리자 모드  -->
<li class="user-board" th:if="${session.user != null && session.user.getEmail().equals('admin@admin')}">
    <a th:href="@{/etbAdmin}">관리자모드</a>
</li>

th:if="${session.user != null && session.user.getEmail().equals('admin@admin')}"

를 적어주어

세션 유저의 이메일이 admin@admin 과 일치할 경우 관리자모드 드롭다운 메뉴가 추가되도록 조치하였다.

<!-- 로그인 했을 경우  -->
<li class="start" th:if="${session.user != null}">
    <i class="fa-sharp fa-solid fa-user icon"></i>
    <span>
        <a class="login" href="#" th:text="${session.user.nickname}">양파쿵야님</a>
        <span>님</span>
    </span>
    <ul class="depth_1 my">
        <!-- 마이페이지 -->
        <li class="user-board">
            <a th:href="@{/member/myPage}">마이페이지</a>
        </li>
        <!-- 로그아웃  -->
        <li class="user-board">
            <a th:href="@{/member/logout}">로그아웃</a>
        </li>
        <!-- 관리자 모드  -->
        <li class="user-board" th:if="${session.user != null && session.user.getEmail().equals('admin@admin')}">
            <a th:href="@{/etbAdmin}">관리자모드</a>
        </li>
    </ul>
</li>

 

 

<!DOCTYPE html>
<html lang="ko" xmlns:th="http://www.thymeleaf.org">
<!--공통 header-->
<header th:fragment="header">
    <div class="spring">
        <ul class="category">
            <li class="etb-logo">
                <a class="title-logo" th:href="@{/}">잔이비어</a>
            </li>
            <li>
                <a class="home" th:href="@{/}">HOME</a>
            </li>
            <li>
                <a class="product" th:href="@{/product}">PRODUCT</a>
                <ul class="depth_1">
                    <li class="product-board">
                        <a th:href="@{/data/beer}">BEER</a>
                    </li>
                    <li class="product-board"><a th:href="@{/bbs/review}">REVIEW</a></li>
                </ul>
            </li>
            <li>
                <a class="community" th:href="@{/community}">COMMUNITY</a>
                <ul class="depth_1">
                    <li class="community-board"><a th:href="@{/basicBbs/list (bid=free)}">자유게시판</a></li>
                    <li class="community-board"><a th:href="@{/basicBbs/list (bid=meeting)}">모임게시판</a></li>
                </ul>
            </li>
            <li>
                <a class="festival" th:href="@{/festival}">FESTIVAL</a>
            </li>
            <!-- 로그인 했을 경우  -->
            <li class="start" th:if="${session.user != null}">
                <i class="fa-sharp fa-solid fa-user icon"></i>
                <span>
                    <a class="login" href="#" th:text="${session.user.nickname}">양파쿵야님</a>
                    <span>님</span>
                </span>
                <ul class="depth_1 my">
                    <!-- 마이페이지 -->
                    <li class="user-board">
                        <a th:href="@{/member/myPage}">마이페이지</a>
                    </li>
                    <!-- 로그아웃  -->
                    <li class="user-board">
                        <a th:href="@{/member/logout}">로그아웃</a>
                    </li>
                    <!-- 관리자 모드  -->
                    <li class="user-board" th:if="${session.user != null && session.user.getEmail().equals('admin@admin')}">
                        <a th:href="@{/etbAdmin}">관리자모드</a>
                    </li>
                </ul>
            </li>
            <!-- 로그인 안했을 경우  -->
            <li class="start" th:if="${session.user == null}">
                <i class="fa-sharp fa-solid fa-user icon"></i>
                <span>
                  <a class="login" th:href="@{/member/login}">시작하기</a>
                </span>
            </li>
        </ul>
    </div>
</header>
<!--공통 footer-->
<footer th:fragment="footer">
    <section class="footer-section1" id="footerSection1">
        <div class="fix-footer" id="fixFooter">
            <i class="title">©2023 by Empty Beer</i>
        </div>
    </section>
</footer>


<!--무언가를 불러오고 있습니다 loading-->
<div class="loading-cover" id="cover" th:fragment="cover">
    <img alt="" class="--icon" th:src="@{/resources/images/loading.png}">
    <span class="loading-text" rel="text">무언가를 불러오고 있습니다. 잠시만 기다려 주세요.</span>
</div>

</html>

 

 

이상으로 로그아웃 구현 완료~

저작자표시 비영리 변경금지 (새창열림)

'Spring Boot > 개념정리' 카테고리의 다른 글

로그인 구현  (0) 2023.01.27
개발절차  (0) 2023.01.11
[공통] 암호화  (0) 2022.11.08
[공통] 회원가입 구현  (0) 2022.11.07
[공통] 요소  (0) 2022.11.07
'Spring Boot/개념정리' Related Articles more
Comments