在这篇文章中,我们将看看在 Spring Boot 应用程序中提供自定义表单登录。
默认的 Spring Boot 表单登录可能无法满足所有人的需求。例如,某些组织可能希望在其登录页面上放置徽标。有些人可能会发现默认登录表单不那么吸引人。对于一些完美主义者来说,默认密码可能看起来并不适合整个应用程序的主题。因此,如果有人想提供登录页面的实现,这是有道理的。
这里的想法是路径 /login
应该返回一个包含表单的 HTML。为此,我们首先需要添加 thymeleaf 支持并配置自定义登录页面。
添加 thymeleaf starter 作为依赖项。我们需要这个启动器,因为 Spring MVC 需要一个视图解析器来将路径映射到视图模板。
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
创建一个名为 src/main/resources/views/login.html
的文件为此,我创建了一个包含以下内容的简单 HTML。
<!DOCTYPE html>
<html lang="en" xmlns:th="https://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/tailwindcss/2.0.2/tailwind.min.css">
<title>Login : Demo</title>
</head>
<body class="h-screen">
<div class="container mx-auto h-full flex justify-center items-center text-green-700 px-4">
<div class="md:w-1/3 shadow-xl rounded-2xl border bg-green-100 w-full">
<h1 class="text-center font-medium text-2xl text-white rounded-t-2xl bg-green-500 py-4">Sign In</h1>
<form th:action="@{/login}" method="post" class="border-teal p-4 border-t-12 bg-white mb-6">
<div class="mb-4">
<label for="username" class="font-bold text-lg block mb-2">Username</label>
<input id="username" type="text" name="username" autocomplete="off"
class="block w-full rounded p-2 rounded shadow border focus:outline-none focus:ring-2 focus:ring-green-600 focus:border-transparent"
placeholder="Your Username">
</div>
<div class="mb-4">
<label for="password" class="font-bold text-lg block mb-2">Password</label>
<input id="password" type="password" name="password" autocomplete="off"
class="block w-full rounded p-2 rounded shadow border focus:outline-none focus:ring-2 focus:ring-green-600 focus:border-transparent"
placeholder="Your Password">
</div>
<div class="flex items-center justify-between">
<input class="bg-green-500 text-white text-lg font-medium p-2 rounded inline-block w-full hover:bg-green-400 transition duration-400 hover:shadow-lg"
type="submit" value="Login">
</div>
</form>
<div class="text-center pb-4">
<p class="text-grey-dark text-sm">
Don't have an account? <a href="#" class="no-underline text-green-500 font-bold">Create an Account</a>.
</p>
</div>
</div>
</div>
</body>
</html>
将此 login.html
映射到路径 /login
。对于此步骤,您需要提供自定义 WebMvcConfigurer
以让 spring MVC 知道您正在为 login
注册新映射,如下所示。
package com.springhow.examples.springboot.security.customformlogin.config;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.ViewControllerRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;
@Configuration
public class WebConfig implements WebMvcConfigurer {
@Override
public void addViewControllers(ViewControllerRegistry registry) {
registry.addViewController("/login").setViewName("login");
}
}
通过执行此配置,每当请求到达 /login
时,MVC 上下文将在 src/main/resources/templates/
下查找 login.html
。
最后,覆盖默认的 HttpSecurity
配置,如下所示。
package com.springhow.examples.springboot.security.customformlogin.config;
import org.springframework.context.annotation.Configuration;
import org.springframework.security.config.annotation.web.builders.HttpSecurity;
import org.springframework.security.config.annotation.web.configuration.WebSecurityConfigurerAdapter;
@Configuration
public class SecurityConfig extends WebSecurityConfigurerAdapter {
@Override
public void configure(HttpSecurity http) throws Exception {
http.authorizeRequests()
.anyRequest()
.authenticated()
.and()
.formLogin()
.loginPage("/login")
.permitAll()
.and()
.logout()
.permitAll();
}
}
如果上述所有操作均正确完成,则在请求 http://localhost:8080/hello
时将重定向到自定义登录页面,如下所示。
您可以在 this github link 中找到此项目的代码。
版权说明 : 本文为转载文章, 版权归原作者所有 版权申明
原文链接 : https://springhow.com/custom-form-login-in-spring-security/
内容来源于网络,如有侵权,请联系作者删除!