How can a login page be created using Spring Boot?
add a comment
1 Answer
To create a login page using Spring Boot, follow these steps:
- Create a new Spring Boot project using your preferred IDE or by using the Spring Initializr website.
- Add the necessary dependencies for security, web, and Thymeleaf to your project's pom.xml file. For example:
<dependencies>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-security</artifactId>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-web</artifactId>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
</dependencies>
- Create a new Java class that extends the WebSecurityConfigurerAdapter class. This class will handle the authentication and authorization configuration. For example:
@Configuration
@EnableWebSecurity
public class SecurityConfig extends WebSecurityConfigurerAdapter {
@Autowired
private UserDetailsService userDetailsService;
@Override
protected void configure(AuthenticationManagerBuilder auth) throws Exception {
auth.userDetailsService(userDetailsService);
}
@Override
protected void configure(HttpSecurity http) throws Exception {
http
.authorizeRequests()
.antMatchers("/login").permitAll()
.anyRequest().authenticated()
.and()
.formLogin()
.loginPage("/login")
.defaultSuccessUrl("/")
.permitAll()
.and()
.logout()
.logoutUrl("/logout")
.permitAll();
}
}
- Create a new controller class that handles the login page request. This class should return the login HTML template using Thymeleaf. For example:
@Controller
public class LoginController {
@GetMapping("/login")
public String login() {
return "login";
}
}
- Create a new HTML template for the login page using Thymeleaf. This template should include a form with fields for the username and password, and should submit the form to the "/login" endpoint. For example:
<!DOCTYPE html>
<html lang="en"
xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Login</title>
</head>
<body>
<h1>Login</h1>
<form action="/login" method="post">
<div>
<label for="username">Username</label>
<input type="text" id="username" name="username" />
</div>
<div>
<label for="password">Password</label>
<input type="password" id="password" name="password" />
</div>
<button type="submit">Login</button>
</form>
</body>
</html>
- Start the application and visit the login page at "/login". Try logging in with a username and password that match a user in your UserDetailsService implementation. Upon successful login, you should be redirected to the default success URL specified in the security configuration.
Your Answer
Stats
Asked: 2021-06-27 11:00:00 +0000
Seen: 8 times
Last updated: Feb 12 '22