前后端分离 页面权限验证

前端验证

登入后 添加登入标识

localStorage.login=true;

inc.js 公共头文件处理，没有登入 跳转登入 top.location.href=

/**
 * 获取本地绝对路径或域名访问路径
 */
var href = document.location.href;
var absPath = ""; 
absPath = href.substr(0,href.indexOf('/admin'));//本地目录
//absPath="http://" + location.hostname + ":" + location.port + "/sysu-ui";//ip+port
//absPath=document.domain;//域名

/**
 * 判断是否登入,isLogin标识(此方式不安全)或后台使用zuul/gateway路由进行登入验证、页面授权
 */
var login = localStorage.getItem('login');
if(login!='true'&&href!=absPath+'/admin/login.html') {
	top.location.href=absPath+"/admin/login.html";
} else {

/**
 * CSS
 */
document.write('<link rel="stylesheet" type="text/css" href="'+absPath+'/admin/css/font.css?timestamp='+new Date()+'"/>');
document.write('<link rel="stylesheet" type="text/css" href="'+absPath+'/admin/css/weadmin.css?timestamp='+new Date()+'"/>');
document.write('<link rel="stylesheet" type="text/css" href="'+absPath+'/admin/lib/layui/css/layui.css?timestamp='+new Date()+'"/>');
document.write('<link rel="stylesheet" type="text/css" href="'+absPath+'/admin/css/core/common.css?timestamp='+new Date()+'"/>');

/**
 * Javascript
 */
//document.write('<script src="'+absPath+'/admin/js/jquery-1.8.3.js?timestamp='+new Date()+'"></script>');
document.write('<script src="'+absPath+'/admin/js/jquery-3.3.1.js?timestamp='+new Date()+'"></script>');
document.write('<script src="'+absPath+'/v1/js/core/Config.js?timestamp='+new Date()+'"></script>');
document.write('<script src="'+absPath+'/v1/js/core/vue/vue.min.js?timestamp='+new Date()+'"></script>');
document.write('<script src="'+absPath+'/v1/js/core/sysu/sysu.js?timestamp='+new Date()+'"></script>');
document.write('<script src="'+absPath+'/admin/lib/layui/layui.js?timestamp='+new Date()+'"></script>');
//document.write('<script src="'+absPath+'/admin/js/less-2.5.3.js?timestamp='+new Date()+'"></script>');
//document.write('<script src="'+absPath+'/admin/js/Pretty-1.0.0.js?timestamp='+new Date()+'"></script>');
document.write('<script src="'+absPath+'/admin/js/Twj.web.util.js?timestamp='+new Date()+'"></script>');

}

 

gateWay服务器

配置

# 服务名称
spring:
  application:
    name: pretty-testing
# 服务端口号
server:
  port: 9001
eureka:
  client:
    serviceUrl:
      defaultZone: http://localhost:10001/eureka/,http://localhost:10000/eureka/
  instance:
    preferIpAddress: true
    instanceId: ${spring.cloud.client.ip-address}:${server.port}
#feign开启熔断保护
feign:
  hystrix:
    enabled: true
#路由分发
zuul:
  strip-prefix: true
  routes:
    admin-ui: 
      path: /**
      #前端项目访问的地址
      url: http://127.0.0.1:8848/
# 模板配置
thymeleaf:
   prefix: classpath:/templates/
   suffix: .html
   cache: false
# 安全认证的配置
security:
  basic:
    enabled: true

zuul自定义过滤器 放行.css .js 添加权限验证代码

public class CoreFilter extends ZuulFilter {

	@Override
	public boolean shouldFilter() {
		// TODO Auto-generated method stub
		RequestContext ctx= RequestContext.getCurrentContext();
		HttpServletRequest request = ctx.getRequest();
		String requestUrl = request.getRequestURL().toString();
		//是否需要执行过滤，即执行run()
		return !requestUrl.contains("login.html")&&!requestUrl.contains(".js")&&!requestUrl.contains(".css")&&!requestUrl.contains(".img");
	}

	@Override
	public Object run() throws ZuulException {
		// TODO Auto-generated method stub
		RequestContext ctx= RequestContext.getCurrentContext();
		HttpServletRequest request = ctx.getRequest();
		HttpServletResponse response = ctx.getResponse();
		HttpSession session = request.getSession();
		session.getAttribute("key");
		response.addHeader("token", "123456");
		/*try {
			response.sendRedirect("http://127.0.0.1:9001/admin/login.html");
		} catch (IOException e) {
			// TODO Auto-generated catch block
			e.printStackTrace();
		}*/
		return null;
	}

	@Override
	public String filterType() {
		// TODO Auto-generated method stub
		return PRE_TYPE;
	}

	@Override
	public int filterOrder() {
		// TODO Auto-generated method stub
		return PRE_DECORATION_FILTER_ORDER;
	}

}

例如：前端访问地址为：  http://127.0.0.1://8848/

我们可以通过gateWay访问路由到前端，http://127.0.1:9001进行严格的页面访问控制