angularjs許可權細粒度怎麼做到按鈕級別?
看到網上很多通過以下方法來解決
$routeProvider
.when("/register", { templateUrl: "views/register.html", controller: "RegisterController",access: {
authorizedRoles: [USER_ROLES.all] } })但是不能符合多少的角色以及角色變更
以下想法是基於J2EE,apache shiro.目前想到的只是通過sae.js模塊化載入..伺服器後端通過shiro標籤過濾生成angularjs的js和jsp模版..用戶訪問的url已經是過濾完的內容.已達到許可權控制的效果..不知道有人嘗試過么
角色,用戶,許可權。
我們自己做的是每一個角色給他不同的許可權,許可權包括模塊和按鈕。
直接存成json串保存在DB中,載入的時候依據角色來判斷模塊和按鈕的顯示。
提交請求的時候統一有過濾器來判斷是否有許可權。
我的理解,不知道對不對,一般來說不應該通過選擇渲染相關DOM與否,或disable相關DOM組件來控制許可權,也就是說前端其實是不可控的,不要做後端應該做的事。
你的後台服務,應該可以在用戶可以隨意控制你的DOM,JS,http請求,知道所有對外service API的假設下,仍然保證不泄露信息,不執行未許可操作。哎知乎的編輯對代碼格式太不友好了,我懶得改了,見諒
同意 @Acceyuriko
後端只用於登陸時返回用戶許可權,前端記錄用戶許可權並反映與頁面上我這裡就只提供一點乾貨來解釋一下流程如果你想要在前端控制許可權,那麼最簡單的做法就是註冊一個service, service內記錄用戶的資料許可權angular.module("service.userInfo",[]).service("userservice",[function(){
return{
this.user = null
}})&
& //如果user是visitor就disable &&&
app = angular.module("main",[service.userInfo]).controller("mainctr",["$scope","userservice ",function($scope,userservice){
$scope.mainCtr = {
user:userservice.user
}
//如果用戶登錄,我們依照返回情況來設置更新user
$scope.login = function(){$http.post().then(function(res){
$scope.mainCtr.user = userservice.user = res.data;
})
}
}]).run(["userservice",function(userservice){
//網頁開始時,檢查local是否保存有用戶過往登陸token,如果有就嘗試用這個token取得用戶
if(token){ $scope.login = function(){$http.post({token:localStorage.token}).then(function(res){
if(res.status == "OK"){
userservice.user = res.data;
}else{//token 過期
//用戶預設為遊客
userservice.user = {lv:"visitor"} }})
}}}])
代碼我現打的,如果有bug或者錯誤請見諒。當然,其他要考慮的變數還有很多,主要還是有關$http拿取用戶是返回同步的問題,比如說如果你網頁顯示出來的時候$http還未放回user的值。所以一般我都會用promise,只有當userservice.user != null 才會resolve.大概說一下,拋磚引玉。
我們目前是實現了一個permissionCheck服務,與之相關的有permissionCheck指令和launcher的角色。整個項目會分為幾個module,每個module都會在初始化時在permissionCheck服務中註冊相關的角色與許可權。每個與許可權有關的DOM元素都可以使用permissionCheck指令加上相關的參數來決定元素的表現形式與行為。提供一個思路
1:在資料庫和伺服器端首先設計完善的許可權分組,將管理端的介面方法按照路由和MVC的特點進行白名單的添加,調用某個方法首先判斷用戶有無該方法的許可權。
2:管理員登錄時將系統的許可權列表和用戶的許可權列表存於本地的sessionStroge。
3:將所有的調用後台的方法地址存於一個dataload服務內,每個方法有兩種返回值,一個是作為介面調用返回後台數據,一個是返回該方法對應的後台許可權(你可以根據方法的url來計算後台對應的許可權名,或者對複雜的方法指定默認的值)。
4:後台的操作按鈕,有一個ng-if的判斷許可權和一個ng-click的觸發事件。例如:
&
大功告成
PS:代碼肯定是不能跑的,就不檢查拼寫和正確性了
推薦閱讀:
※你用AngularJS 做過項目後,下一個項目還用AngularJS嗎?
※關於 AngularJS 框架的使用有哪些經驗值得分享?
※求助,用angularJs實現下圖功能?
※有了 Angular 之類的 MVC/MVVM 框架是不是可以不學 DOM 了?或者只需簡單了解一下 DOM?
※Angular js 初學者該看什麼書啊? ?
TAG:JavaScript | Apache | JavaEE | AngularJS |