Reputation: 3539
I'm wondering what the best approach in AngularJS is to secure admin pages, i.e. pages that normal users shouldn't be able to see. Obviously, there will be back-end authentication but since the AngularJS app is client-side, people could still theoretically look at the routing and go to those URLs directly and look at the admin pages.
I'm using Express, PassportJS & MongoDB (Mongoose) as my backend. Naturally, they wouldn't be able to interact with the admin pages since there is server-side authentication on creation, deletion, ... but I'd much prefer to not even serve the pages to the user if they do not have the proper access. Since the app is fully client-side JS though, I'm thinking this is kind of impossible since people can just modify the routing and whatnot. What's the best way to go about this? Thanks for any input!
Upvotes: 8
Views: 6903
Reputation: 88
You could use params
in ui-router
https://github.com/angular-ui/ui-router/tree/master
Upvotes: 0
Reputation: 1
The way I do is, put the angularJS html in JSP page and check session. If session validates provide access. I am not sure if that is right way. Another way is, dont use JSP, but with each API hit, check session at server, else return false. One more way is on first login, get a autogenerated key, store at server and client both, check on every API hit.
Upvotes: 0
Reputation: 1
I agree with Chris Russo's concerns. This is all about security issue. If you are using angular for your front-end then you need a framework that has a strong capability in securing your application if someone trying to attack your web site/application. I will recommend spring framework (spring_security) it has proven feature securing your web application. You need to have roles assign to each user such as ROLE_USER or ROLE_ADMIN. I will not dig into detail how to do it but this will help to resolved to your concerns. :)
Upvotes: -1
Reputation: 371
This question is a bit old but if anyone is looking for solution out there , I was using a resource file to store my html templates and then retrieve it with webapi while validating permission and returning the html only when user authenticated.
Upvotes: 2
Reputation: 10530
I would put a check inside routeProvider. This has to be done for every route which requires authentication. You can even write a separate method and stick it to each route to avoid duplication.
$routeProvider
.when('/profile', {
templateUrl: 'views/profile.html',
controller: 'ProfileCtrl',
resolve: {
validate: function($q, $location) {
// Either you could maintain an array of hashes on client side
// a user do not have access to without login
// Or hit the backend url to check it more securely
var validateAccess = $q.defer();
var isAllowed = ['profile', 'index', 'dashboard'].indexOf($location.hash()) !== -1;
if (!isAllowed) {
$location.path('/login');
}
validateAccess.resolve();
return validateAccess.promise;
}
}
})
.otherwise({
redirectTo: '/'
});
Upvotes: 4
Reputation: 12184
Why would you "much prefer" not to serve these pages to non-admin users? Do you have an actual reason to care about this, other than some instinct that you should stop people seeing things they're not "supposed" to see?
If your security is configured properly then non-admin users will not be able to access admin data or perform admin operations. That is what you should concentrate on, not inventing elaborate ways to stop them seeing admin screens that they can't use anyway. Any time you spend on this is basically time wasted, and you should spend it on more important things.
Upvotes: 0