微人事学习之权限管理完善

学习SpringBoot+Vue前后端分离项目，原项目GitHub地址，项目作者江雨一点雨博客。

异常操作导致的问题

当用户没有登录，直接访问菜单地址时，例如/sys/basic，浏览器报错了，具体信息

Access to XMLHttpRequest at 'http://localhost:8081/login' (redirected from 'http://localhost:8080/system/config/menu') 
from origin 'http://localhost:8080' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

这段信息意思是访问http://localhost:8080/system/config/menu时，重定向到了登录页，但是登录页被同源策略阻止了，也就是发生了跨域问题。
当我们访问菜单信息时，拦截器发现没有数据，需要加载数据就去请求/system/config/menu这个接口。然而这个接口需要登录才能访问，所以就重定向到了登录页。
我们打开控制台，在Network中找到menu文件，看一下ResponseHeader

location: http://localhost:8081/login

前端没有经过Node.js代理，直接访问了8081/login，发生了跨域。

解决方法

我们可以直接在LoginController里面给RespBean添加@CrossOrigin(*)注解，
也可以在SecurityConfig的configure方法最后加上一段代码

.csrf().disable()
.exceptionHandling()
//没有认证时，在这里处理结果，不要重定向
.authenticationEntryPoint(new AuthenticationEntryPoint() {
            @Override
            public void commence(HttpServletRequest req, HttpServletResponse resp, AuthenticationException e) throws IOException, ServletException {
                resp.setContentType("application/json;charset=utf-8");
                PrintWriter out = resp.getWriter();
                RespBean respBean = RespBean.error("访问失败");
                if (e instanceof InsufficientAuthenticationException){
                    respBean.setMsg("请求失败，请联系管理员");
                }
                out.write(new ObjectMapper().writeValueAsString(respBean));
                out.flush();
                out.close();
            }
        });

这个只是提示用户需要登录，并没有跳转到登录页，我们还得在前端配置下
在main.js的导航守卫里

router.beforeEach((to, from, next) => {
    if (to.path=='/'){
        next();
    }else {
        if(window.sessionStorage.getItem("user")){
            initMenu(router,store);
            next();
        }else {

            next("/?redirect="+to.path);
        }

    }
})

修改Login.vue的subLogin方法

submitLogin(){
                this.$refs.loginForm.validate((valid) => {
                    if (valid) {
                        //alert('submit!');
                        this.postKeyValueRequest('/doLogin',this.loginForm).then(resp=>{
                            if (resp) {
                                window.sessionStorage.setItem("user",JSON.stringify(resp.obj));
                                let path=this.$route.query.redirect;
 								//如果(path=='/'||path==undefined)，就去home页，否则去path
 								
                                this.$router.replace((path=='/'||path==undefined)?'/home':path);
                            }
                        })
                    } else {
                        this.$message.error('错了哦，这是一条错误消息');
                        return false;
                    }
                });
            }

上面改完之后，用户登录之后直接跳转到之前未登录时访问的sys/basic。