이 글은 정수원님의 Infrean 강의를 학습한 내용을 정리하여 작성합니다.
Form 인증 - Custom Login Form Page
Custom Login Form Page 생성
login.html
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head th:replace="layout/header::userHead"></head>
<body>
<div th:replace="layout/top::header"></div>
<div class="login-form d-flex justify-content-center">
<div class="col-sm-5" style="margin-top: 30px;">
<div class="panel">
<p>아이디와 비밀번호를 입력해주세요.</p>
</div>
<div th:if="${param.error}" class="form-group" >
<span th:text="${exception}" class="alert alert-danger"></span>
</div>
<form th:action="@{/login_proc}" class="form-signin" method="post">
<input type="hidden" th:value="secret" name="secret_key">
<div class="form-group">
<input type="text" class="form-control" name="username" placeholder="아이디" required="required" autofocus="autofocus">
</div>
<div class="form-group">
<input type="password" class="form-control" name="password" placeholder="비밀번호" required="required">
</div>
<button type="submit" class="btn btn-lg btn-primary btn-block">로그인</button>
</form>
</div>
</div>
</body>
</html>
top.html
<!DOCTYPE html>
<html lang="ko" xmlns:th="http://www.thymeleaf.org">
<div th:fragment="header">
<nav class="navbar navbar-dark sticky-top bg-dark ">
<div class="container">
<a class="text-light" href="#"><h4>Core Spring Security</h4></a>
<ul class="nav justify-content-end">
<li class="nav-item" ><a class="nav-link text-light" th:href="@{/login}">로그인</a></li>
<li class="nav-item" ><a class="nav-link text-light" th:href="@{/users}">회원가입</a></li>
<li class="nav-item" ><a class="nav-link text-light" href="/">HOME</a></li>
</ul>
</div>
</nav>
</div>
</html>
- 로그인 페이지로 이동할 수 있도록 기능을 추가했다.
SecurityConfig
- SecurityConfig 설정 파일에서 로그인 페이지 api 값을 설정해야 한다.
@Configuration
@EnableWebSecurity
public class SecurityConfig {
...
@Bean
public SecurityFilterChain filterChain(HttpSecurity http) throws Exception {
http
.authorizeHttpRequests((authz) -> authz
.antMatchers("/", "/users").permitAll()
.antMatchers("/mypage").hasRole("USER")
.antMatchers("/messages").hasRole("MANAGER")
.antMatchers("/config").hasRole("ADMIN")
.anyRequest().authenticated()
)
.formLogin()
.loginPage("/login")
.loginProcessingUrl("/login_proc")
.defaultSuccessUrl("/")
.permitAll();
return http.build();
}
}
주의!
loginProcessingUrl 값은 login.html 파일의 form 태그 action 위치와 동일하게 작성해야 한다.
주의!
현재 로그인 페이지는 우리가 생성한 url 페이지로 이동하게 되므로 인증 받지 않은 사용자도 접근 가능하도록 마지막에 permitAll() 메소드를 추가해야 한다.
LoginController
@Controller
public class LoginController {
@GetMapping("/login")
public String login() {
return "user/login/login";
}
}
실행
- 로그인을 클릭하면 우리가 생성한 로그인 페이지로 이동하는 것을 확인할 수 있다.
- 로그인을 수행하면 마이페이지 이동이 가능해진다.
'스프링 시큐리티 > 실전프로젝트 - 인증 프로세스 Form 인증 구현' 카테고리의 다른 글
인증 부가 기능 - WebAuthenticationDetails, AuthenticationDetailsSource (0) | 2023.02.12 |
---|---|
로그아웃 및 인증에 따른 화면 보안 처리 (0) | 2023.02.12 |
DB 연동 인증 처리(2): CustomAuthenticationProvider (0) | 2023.02.11 |
DB 연동 인증 처리(1): CustomUserDetailsService (0) | 2023.02.11 |
사용자 DB 등록 및 PasswordEncoder (0) | 2023.02.10 |