07自定义登录页面

7.自定义登录页面

7.1 认证服务添加依赖

 <!--thymeleaf-->
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-thymeleaf</artifactId>
        </dependency>

7.2 资源\成品页面\登录页面

在这里插入图片描述

7.3 把页面放到下面的项目中

在这里插入图片描述

7.4 静态资源放行

修改WebSecurityConfig类
在这里插入图片描述

web.ignoring().antMatchers(
"/oauth/login",
"/oauth/logout","/oauth/toLogin","/login.html","/css/**","/data/**","/fonts/**"
,"/img/**","/js/**");

添加开启表单登录

在这里插入图片描述

7.5 LoginRedirectController

@Controller
@RequestMapping("/oauth")
public class LoginRedirectController {
	@RequestMapping("/toLogin")
	public String toLogin(){
	return "login";
	}
}

7.6 修改登录页面实现用户登录

在这里插入图片描述

7.7 定义login方法

<script th:inline="javascript">
	var app = new Vue({
		el:"#app",
		data:{
			username:"",
			password:"",
			msg:""
		},
		methods:{
			login:function(){
				app.msg="正在登录";
				axios.post("/api/oauth/login?username="+app.username+"&password="+app.password).then(function (response) {
					if (response.data.flag){
						app.msg="登录成功";
					}else{
						app.msg="登录失败";
					}
				})
			}
		}
	})
</script>

定义路径过滤

package com.changgou.web.gateway.filter;

public class UrlFilter {

    //所有需要传递令牌的地址
    public static String filterPath="/api/wseckillorder,/api/seckill,/api/wxpay,/api/wxpay/**,/api/worder/**,/api/user/**,/api/address/**,/api/wcart/**,/api/cart/**,/api/categoryReport/**,/api/orderConfig/**,/api/order/**,/api/orderItem/**,/api/orderLog/**,/api/preferential/**,/api/returnCause/**,/api/returnOrder/**,/api/returnOrderItem/**";

    public static boolean hasAuthorize(String url){

        String[] split = filterPath.replace("**", "").split(",");

        for (String value : split) {

            if (url.startsWith(value)){
                return true; //代表当前的访问地址是需要传递令牌的
            }
        }

        return false; //代表当前的访问地址是不需要传递令牌的
    }
}