文章目录

回顾
自定义表单登录页
自定义登录回调URL

回顾

上一篇《循序渐进学习spring security 第二篇，如何修改默认用户？》中我们介绍了如何通过配置或者代码的方式修改默认登录用户和密码，修改默认用户之后就能正常进行登录了，只是我们发现一个问题，每次要登录时，都会跳转到一个登录页面，这个登录页面就是spring security 默认的登录页面，实际业务场景中，每个企业都有自己的登录页面，淘宝有自己的登录页面，京东也有自己的登录页面，几乎每个产品，都有自己的登录页面，那么，我们要如何去自定义登录页面呢？这就是今天我要和大家聊的主题

源码下载

自定义表单登录页

事实上，每个企业都会根据自己的产品定制登录页面，一个企业，不同的产品，都会有不同的登录页面，比如淘宝，天猫，阿里云，都属于阿里的产品，但是都有自己产品的登录页面。自定义的登录页面需要考虑几个问题

定义的登录页面，用户名和密码参数名称，是固定的名称？怎么定义？能否自定义？
自定义页面怎么关联到spring security？提交登录接口是什么？能否修改？

服务端定义

其实，我们只需要创建一个类SecurityConfig，继承WebSecurityConfigurerAdapter，重写configure(HttpSecurity http) 接口，配置自定义的页面和接口就可以了，针对以上问题，我们一个一个解决

定义的登录页面，用户名和密码参数名称，是固定的名称？怎么定义？能否自定义？

通过HttpSecurity 对象，获取到表单登录配置对象，修改对应的用户名和密码参数名称，即可完成自定义用户名和密码参数名称

  @Override
    protected void configure(HttpSecurity http) throws Exception {
    
    
        http.authorizeRequests().anyRequest().authenticated()
                .and().formLogin().usernameParameter("userName").passwordParameter("passwd")
        .permitAll().and().csrf().disable()
        ;
    }

我们可以顺藤摸瓜，跟着源码进去查看默认的用户名和密码参数名称是什么，跟进去发现默认的用户名字段名称是username，密码字段名称是password
在这里插入图片描述
因此，如果业务场景中不需要修改这两个字段名称的话，就用默认就好，如果需要修改，则获取到表单登录配置对象后调用对应的方法修改就可以了

自定义页面怎么关联到spring security？提交的登录接口是什么？能否修改？

默认的登录接口和登录页面都是/login，可这样配置指定

        http.formLogin().loginPage("/login.html").loginProcessingUrl("/login");

loginPage("/login.html")指定了自定义的登录页面，loginProcessingUrl("/login")方法指定登录接口，该接口需要和页面表单的点击登录提交的接口action属性对应，否则将会登录失败。

<div class="materialContainer">
    <div class="box">
        <div class="title">统一认证中心</div>
        <form action="/login" method="post">
            <div class="input">
                <label for="name">用户名</label>
                <input type="text" name="userName" id="name">
                <span class="spin"></span>
            </div>
            <div class="input">
                <label for="pass">密码</label>
                <input type="password" name="passwd" id="pass">
                <span class="spin"></span>
            </div>
            <div class="button login">
                <button type="submit">
                    <span>登录</span>
                    <i class="fa fa-check"></i>
                </button>
            </div>
        </form>
    </div>

我们通过跟进源码发现，如果不指定loginProcessingUrl登录接口，默认登录接口就是登录页面
在这里插入图片描述
所以，如果不想指定登录接口loginProcessingUrl()，则自定义登录页面表单的action，就是当前登录表单自己，我demo的登录表单页面是login.html,即action="/login.html"

项目实战

自定义一个登录表单页面，当访问服务时，如果接口还没有认证授权，自动跳转到该自定义登录表单的页面进行登录，登录成功后可访问对应的接口

创建项目

基于上一篇《循序渐进学习spring security 第二篇，如何修改默认用户？》的项目，copy一个新的项目，项目名称改为：security-form,修改pom.xml文件的artifactId 属性和name属性，都为：security-form

将自定义页面资源放到resource目录下的static目录下，如图

在这里插入图片描述

在配置文件SecurityConfig中关联自定义页面和配置相关项

    @Override
    protected void configure(HttpSecurity http) throws Exception {
    
    
        http.authorizeRequests().anyRequest().authenticated()
                .and().formLogin().loginPage("/login.html")
                .loginProcessingUrl("/login")
                .usernameParameter("userName")
                .passwordParameter("passwd")
        .permitAll().and().csrf().disable()
        ;
    }

测试

启动项目
在浏览器访问接口：http://127.0.0.1:8080/sayHello，因为还没有登录，因此，会跳转到我们自定义的登录页面，输入账号和密码，登录，登录成功

说明：

因为我们修改了账号和密码的参数名称，我们通过请求信息发现，在登录时，提交的账号和密码字段，正是我们修改后的字段
登录接口实际上就是一个POST请求，默认的login接口有get和post请求两种方式，但意义也是区别很大的，get请求的login就是登录页面，而post请求的是登录接口

OK，我这里的登录页面比较简单，大家可以自行根据项目需要进行修改，案例中我是将自定义页面和后端放在一起部署的，实际上，大家可以分开部署，前端单独部署，后端单独部署，前后端分离，修改对应的配置就好了

自定义登录回调URL

登录会出现两种结果，要么成功，要么失败，这里分别针对登录成功和登录失败的回调地址进行说明

登录成功回调地址配置

在 Spring Security 中，和登录成功重定向 URL 相关的方法有两个：

defaultSuccessUrl
successForwardUrl

我们在配置的时候，defaultSuccessUrl 和 successForwardUrl 只需要配置一个即可，具体配置哪个，则要看你的需求，两个的区别如下：
defaultSuccessUrl 有两个重载的方法

先说一个参数的 defaultSuccessUrl 方法。如果我们在 defaultSuccessUrl 中指定登录成功的跳转页面为 /home，此时分两种情况，如果你是直接在浏览器中输入的登录地址，登录成功后，就直接跳转到 /home，如果你是在浏览器中输入了其他地址，例如 http://localhost:8080/hello，结果因为没有登录，又重定向到登录页面，此时登录成功后，就不会来到 /home，而是来到 /hello 页面。
defaultSuccessUrl 还有一个重载的方法，第二个参数如果不设置默认为 false，也就是我们上面的的情况，如果手动设置第二个参数为 true，则 defaultSuccessUrl 的效果和 successForwardUrl 一致。

successForwardUrl
表示不管你是从哪里来的，登录后一律跳转到 successForwardUrl 指定的地址。例如 successForwardUrl 指定的地址为 /home，访问 http://localhost:8080/hello，结果因为没有登录，重定向到登录页面，当你登录成功之后，就会服务端跳转到 /home页面；或者你直接就在浏览器输入了登录页面地址，登录成功后也是来到 /home。
相关配置如下：

.formLogin()
.loginPage("/login.html")
.loginProcessingUrl("/login")
.usernameParameter("userName")
.passwordParameter("passwd")
//.defaultSuccessUrl("/home")
.successForwardUrl("/home")

登录失败回调配置

与登录成功相似，登录失败也是有两个方法：

failureForwardUrl
failureUrl
这两个方法在设置的时候也是设置一个即可。failureForwardUrl 是登录失败之后会发生服务端跳转，failureUrl 则在登录失败之后，会发生重定向。

注销配置

注销登录的默认接口是 /logout，我们也可以配置。

.and()
.logout()
.logoutUrl("/logout")
.logoutRequestMatcher(new AntPathRequestMatcher("/logout","POST"))
.logoutSuccessUrl("/index")
.deleteCookies()
.clearAuthentication(true)
.invalidateHttpSession(true)
.permitAll()

注销登录的配置我来说一下：

默认注销的 URL 是 /logout，是一个 GET 请求，我们可以通过 logoutUrl 方法来修改默认的注销 URL。
logoutRequestMatcher 方法不仅可以修改注销 URL，还可以修改请求方式，实际项目中，这个方法和 logoutUrl 任意设置一个即可。
logoutSuccessUrl 表示注销成功后要跳转的页面。
deleteCookies 用来清除 cookie。
clearAuthentication 和 invalidateHttpSession 分别表示清除认证信息和使 HttpSession 失效，默认可以不用配置，默认就会清除。

OK，今天就聊到这里
源码下载

循序渐进学习spring security 第三篇，如何自定义登录页面？登录回调？