Angularjsでページアクセス権限を設定する方法

以前のプロジェクトでは、フロントエンドとバックエンド間の連携の一般的な方法は、フロントエンドがページとUIに少しDuangDuangDuang効果を提供し、バックエンドがフレームワークのデータ構造とデータ対話を構築するというものでした（データ対話には、フロントエンドとバックエンド）、.net、Java、PHP のいずれでも、1 対多のフロントエンド サービスを提供できますが、新しい形式ではフロントエンド フレームワークがプロジェクトで使用され、開発状況が異なります。たとえば、私が言いたいのは、この開発は Angular フレームワークの下で完了し、モードはバックエンドによって提供され、ページとデータの対話と論理処理はフロントによって完了します。フロントエンドは完全なプログラマのようなものです。このプロセスでは、ページのアクセス許可の制御など、これまで予期せぬ問題に遭遇することになります。これらの設定を行うフロントエンドの方法。このデータ、つまりこれらのアクセス許可の「マーク」は、バックエンドの実行中に直接取得できるため、つまり、クリックするだけでフィールド データを取得できます。しかし、フロントエンドは 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 の実行に状態監視を追加します (ここでは an-route-ui を使用します)。ルート ジャンプが検出されたときに検出が実行されます。ここで想定されている「マークされた」ステータス配列には、各レベル/ステージでアクセス可能なページ/ルートが含まれています。たとえば、ステータスは、検出する必要がある完全なセットです。status0、1、および 2 は、異なるレベル/ステージのアクセス許可セットです。 、ng のルート ジャンプのハッシュ値。これは、アクセス可能なページも表します。この検出方法を使用すると、アクセス権を持つユーザーが特定のページにアクセスできないことはありません。たとえば、ユーザー a の階層ステージ構成は、ユーザーを含めて status1 です。 .c および user.d。InitObj.getStatus() はステータス コード 1 を返します。ユーザー .a ページにアクセスしたい場合、initObj.getStatus()=="1" の判定が入りますが、その設定はアクセス可能ですページには user.a が含まれていません。つまり、!status1.contains(toState.name)(toState.name ジャンプしたいページに戻り (ここでは user.a に戻ります)、次の操作を入力して、パブリック ページまたはプロンプト ページの原理は基本的に次のとおりです

もちろん、この方法は安全ですが、プロジェクト内のスクリプトが圧縮されていても厳密ではありません。難読化されているため、注意して参照すると、ここで設定の痕跡を見つけることができます。また、スクリプトは実行前に編集可能ですが、これにより大きな脆弱性が生じます。ただし、これらの設定を一部の小規模なプロジェクトで使用するだけで十分であり、たとえ誰かが変更したとしてもです。ステータス設定、データなどはバックエンドからリクエストされます。ステータスが正しくない場合、データをリクエストすることはできません。そのため、フロントエンド スクリプトのインターセプトは単なる遊びとテストのためのものです。