스프링과 JPA 기반 웹 애플리케이션 개발 #17 회원 가입 메인 네비게이션 메뉴
해당 내용은 인프런, 스프링과 JPA 기반 웹 애플리케이션 개발의 강의 내용을 바탕으로 작성된 내용입니다.
강의를 학습하며 요약한 내용을 출처를 표기하고 블로깅 또는 문서로 공개하는 것을 허용합니다 라는 원칙 하에 요약 내용을 공개합니다. 출처는 위에 언급되어있듯, 인프런, 스프링과 JPA 기반 웹 애플리케이션 개발입니다.
제가 학습한 소스코드는 https://github.com/n00nietzsche/jakestudy_webapp 에 지속적으로 업로드 됩니다. 매 커밋 메세지에 강의의 어디 부분까지 진행됐는지 기록해놓겠습니다.
<dependency>
<groupId>org.thymeleaf.extras</groupId>
<artifactId>thymeleaf-extras-springsecurity5</artifactId>
</dependency>
<!-- 타임리프 확장팩, 타임리프가 스프링 시큐리티5를 지원할 수 있게 됨 -->
<dependency>
<groupId>org.thymeleaf.extras</groupId>
<artifactId>thymeleaf-extras-springsecurity5</artifactId>
</dependency>
위의 확장팩을 설치하면, 타임리프에서도 스프링 시큐리티를 이용한 인증에 따른 뷰 페이지 출력이 가능하다.
<html lang="en"
xmlns:th="http://www.thymeleaf.org"
xmlns:sec="http://www.thymeleaf.org/extras/spring-security">
...
<ul class="navbar-nav justify-content-end">
<li class="nav-item" sec:authorize="!isAuthenticated()">
<a class="nav-link" th:href="@{/login}">로그인</a>
</li>
<li class="nav-item" sec:authorize="!isAuthenticated()">
<a class="nav-link" th:href="@{/sign-up}">가입</a>
</li>
<li class="nav-item" sec:authorize="isAuthenticated()">
<a class="nav-link" th:href="@{/notifications}">알림</a>
</li>
<li class="nav-item" sec:authorize="isAuthenticated()">
<a class="nav-link btn btn-outline-primary" th:href="@{/notifications}">스터디 개설</a>
</li>
<li class="nav-item dropdown" sec:authorize="isAuthenticated()">
<a class="nav-link dropdown-toggle" href="#" id="userDropdown" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
프로필
</a>
<div class="dropdown-menu dropdown-menu-sm-right" aria-labelledby="userDropdown">
<h6 class="dropdown-header">
<span sec:authentication="name">Username</span>
</h6>
<a class="dropdown-item" href="#" th:href="@{'/profile/' + ${#authentication.name}}">프로필</a>
<a class="dropdown-item" href="#">스터디</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#" th:href="@{'/settings/profile'}">설정</a>
<form class="form-inline my-2 my-lg-0" action="#" th:action="@{/logout}" method="post">
<button class="dropdown-item" type="submit">로그아웃</button>
</form>
</div>
</li>
</ul>
...
먼저 가장 상단 html
태그에 xmlns
로 xml 네임스페이스를 추가해줘야 한다. xmlns:sec="http://www.thymeleaf.org/extras/spring-security"
그리고 이후에 딱 2가지 속성만 이용해주면 되는데,
sec:authorize
와 sec:authentication
이다.
sec:authorize
: 인증이 되었는지 안되었는지에 따라 해당 태그를 보여줄지 결정 (인가의 영역)sec:authentication
: 인증된 사용자의 이름 등을 가져올 수 있음Thymeleaf 공식문서 페이지에서 해당 내용을 확인할 수 있다.
ROLE
마다 보여주는 게 다르도록 설정할 수도 있다. 그리고 권한도 출력해줄 수도 있다.