Angularjs中的页面访问权限怎么设置


Posted in Javascript onNovember 11, 2016

在以往的项目中,前后端常见的配合方式是前端提供页面和ui加一点DuangDuangDuang的效果,后端搭建框架数据结构和数据交互(数据交互前后端有交集),不管是.net、java or php都能一对多的提供前端服务,然而在新形式下项目中运用了前端框架,开发情况就不一样了,比如我要说的这是在angular框架下完成的开发,模式是后端提供服务和api文档,页面和数据交互及逻辑处理由前端完成,前端俨然是个完全的programer了,这个过程中就会遇到之前意想不到的问题(如果没有做过后端开发),比如页面权限控制,不得不说,使用前端的方式去做这些设置比较纠结,因为这方面的数据,也就是这些权限的‘标示',后端运行的时候是可以直接获得的,即像获取字段数据a.b点一下就出来了,而前端只能用http请求的方式获取,繁琐麻烦;

其实在ng中做页面访问权有很多种方法,各有利弊,运用的比较多的是拦截器,拦截器使得在前端往后端发送http请求之前或之后做一些操作,比如全局监测用户是否登录,没登陆就要跳转的登录页面,登录就可以访问页面;拦截器的使用往往配合后台数据,也就是获取到最新的‘标示',来确定这个页面或者下个页面要做什么操作;而这里我使用的是一种用前端控制的方式,不用数据交互,理念就是定义好不同等级/阶段可以访问的页面,在路由的地方作拦截,针对一些不同等级/阶段访问权限定义明确的可以参考使用这种方法,代码如下:

......
app.run(['$rootScope', '$state', '$window', function($rootScope, $state, $window) {
$rootScope.$on('$stateChangeStart', function(event, toState, toStateParams) {
//用户访问等级阶段, 0 1 2
Array.prototype.contains = function(needle) {
for(i in this) {
if(this[i] == needle) return true;
}
return false;
}
var status=new Array("user.a","user.b","user.c","user.d","user.e","user.f","user.g");
var status0=new Array("user.a","user.b");
var status1=new Array("user.c","user.d");
var status2=new Array("user.a","user.b","user.c","user.d"); 

 if (status.contains(toState.name)) {



 if(initObj.getStatus()=="0"){
if(!status0.contains(toState.name)){
event.preventDefault();
$state.go('user.approve');
}
return;
}
if(initObj.getStatus()=="1"){
if(!status1.contains(toState.name)){
event.preventDefault();
$state.go('user.result');
}
return;
}
if(initObj.getStatus()=="2"){
if(!status2.contains(toState.name)){
event.preventDefault();
$state.go('user.result');
}
return;
}
}
})
}])
......

如码所示,在ng的run里加上state监听(我这里使用了an-route-ui),当监听到路由跳转的时候就进行检测,这里设想的可访问‘标示'的status数组里包含每个层级/阶段可访问的页面/路由,比如status里是需要检测的全集,status0、1 2分别是不同的层级/阶段的权限访问集合,也即是ng中路由跳转的哈希值,也就代表了可访问的页面,利用这种检测手段,没有访问权限的用户就不能访问某些页面,比如用户a的的层级阶段配置是status1,包含user.c和user.d,initObj.getStatus()返回了他的状态码是1,当他想访问user.a页面的时候,就会进入initObj.getStatus()=="1"的判断,但是他的配置可访问页面不包括user.a,也即!status1.contains(toState.name)(toState.name返回要跳转的页面,这里返回user.a),接下来进入下面的操作,进入公共页面或提示页面,原理基本是这样;

当然,这种方式跟后端的控制来说,是非常不安全的,也不严谨,因为就算项目中脚本进行发布压缩混淆后,细细浏览还是能找到这里的设置痕迹的,并且脚本在运行之前是可编辑的,这就会造成很大的漏洞;不过在一些小项目中使用这些配置够用了,并且就算有人修改了这个status配置,数据什么的都是从后端请求的,状态不对也请求不到数据的,所以攻陷数据库才算是真黑,从前端的脚本做拦截只是玩玩测试;

继续发掘其他的优化方法,有大神有更好的方法可以交流下;先到这里吧。

还有,光棍节到了,祝广大单身狗早日脱单。嘿嘿~~~~

Javascript 相关文章推荐
ExtJS 2.0 实用简明教程之布局概述
Apr 29 Javascript
JavaScript的strict模式与with关键字介绍
Feb 08 Javascript
jQuery 1.9.1源码分析系列(十四)之常用jQuery工具
Dec 02 Javascript
jQuery中slidedown与slideup方法用法示例
Sep 16 Javascript
js实现贪吃蛇小游戏(容易理解)
Jan 22 Javascript
关于vue.js发布后路径引用的问题解决
Aug 15 Javascript
JavaScript编写的网页小游戏,很给力
Aug 18 Javascript
浅谈express 中间件机制及实现原理
Aug 31 Javascript
vue解决使用webpack打包后keep-alive不生效的方法
Sep 01 Javascript
详解基于Wepy开发小程序插件(推荐)
Aug 01 Javascript
微信小程序 bindtap 传参的实例代码
Feb 21 Javascript
JavaScript原型链中函数和对象的理解
Jun 16 Javascript
jquery.multiselect多选下拉框实现代码
Nov 11 #Javascript
通过扫描二维码打开app的实现代码
Nov 10 #Javascript
用JS动态设置CSS样式常见方法小结(推荐)
Nov 10 #Javascript
关于json字符串与实体之间的严格验证代码
Nov 10 #Javascript
jquery日历插件e-calendar升级版
Nov 10 #Javascript
Vue.js开发环境搭建
Nov 10 #Javascript
js 获取本地文件及目录的方法(推荐)
Nov 10 #Javascript
You might like
分页详解 从此分页无忧(PHP+mysql)
2007/11/23 PHP
php数据入库前清理 注意php intval与mysql的int取值范围不同
2010/12/12 PHP
PHP图片等比缩放类SimpleImage使用方法和使用实例分享
2014/04/10 PHP
PHP PDOStatement::errorInfo讲解
2019/01/31 PHP
Ajax一统天下之Dojo整合篇
2007/03/24 Javascript
css图片自适应大小
2007/11/28 Javascript
JavaScript实现动态增加文件域表单
2009/02/12 Javascript
js复制到剪切板的实例方法
2013/06/28 Javascript
jquery配合css简单实现返回顶部效果
2013/09/30 Javascript
JS中处理时间之setUTCMinutes()方法的使用
2015/06/12 Javascript
js HTML5手机刮刮乐代码
2020/09/29 Javascript
浅析BootStrap Treeview的简单使用
2016/10/12 Javascript
微信小程序实现运动步数排行功能(可删除)
2018/07/05 Javascript
Vue一次性简洁明了引入所有公共组件的方法
2018/11/28 Javascript
JS原生瀑布流效果实现
2019/04/26 Javascript
vue项目中引入Sass实例方法
2019/08/27 Javascript
layui checkbox默认选中,获取选中值,清空所有选中项的例子
2019/09/02 Javascript
使用React代码动态生成栅格布局的方法
2020/05/24 Javascript
微信小程序实现转盘抽奖
2020/09/21 Javascript
Python求出0~100以内的所有素数
2018/01/23 Python
python调用xlsxwriter创建xlsx的方法
2018/05/03 Python
Pandas之groupby( )用法笔记小结
2019/07/23 Python
Python中私有属性的定义方式
2020/03/05 Python
深入了解Python 变量作用域
2020/07/24 Python
自然健康的概念:Natural Healthy Concepts
2020/01/26 全球购物
英语简历自我评价
2014/01/26 职场文书
房产公证书格式
2015/01/26 职场文书
文案策划岗位职责
2015/02/11 职场文书
2019年聘任书的写作格式及范文!
2019/07/03 职场文书
想创业成功,需要掌握这些要点
2019/12/06 职场文书
MySQL pt-slave-restart工具的使用简介
2021/04/07 MySQL
Pytest中skip skipif跳过用例详解
2021/06/30 Python
MySQL 聚合函数排序
2021/07/16 MySQL
SQL Server使用导出向导功能
2022/04/08 SQL Server
Sql Server 行数据的某列值想作为字段列显示的方法
2022/04/20 SQL Server
postgresql如何找到表中重复数据的行并删除
2023/05/08 MySQL