2

I am currently learning Angularjs for an application that will need role-based access control logic. There are scenarios where the logic will be necessary to restrict access to certain pages based on your user role. There are other scenarios where I will have to restrict access to a section of a page or certain fields on a form based upon a users role. If Angularjs is a client side methodology, this seems to present a problem if I don't want the client to have any access to an item they aren't suppose to have access to.

What is the current approach for handling these scenarios from the server without interfering with Angularjs?

I know I have access to razor to restrict page section access but what problems would this present for Angularjs and would this be a good idea to mix razor and angular view syntax?

In my transition to Angularjs, I am having a problem wrapping my mind around how to handle this.

halfer
  • 19,824
  • 17
  • 99
  • 186
user1790300
  • 2,143
  • 10
  • 54
  • 123

3 Answers3

0

You can request views using ajax from MVC and handle any access restriction with a response.

I don't have good example now but it might set you in the right way?

Using knockout I have used a template enginge to retrieve partial views from MVC.

Same thing should work here and you can keep the access restriction on the server side (which you should).

NeutronCode
  • 365
  • 2
  • 13
0

One of the methods would require setting up a service to check if a user is authorized for the page (in angular), then setting params on a route

{
    "/admin": {
        templateUrl: 'partials/admin.html', 
        controller: 'AdminCtrl', 
        requireLogin: true//THIS
}

and then canceling navigation with in a controller by handling the $locationChangeStart event

(This is all shown in the article I posted below).

My suggestion would be to create views for each logical page element with individual controllers and handle access the same way as the example. Instead of per page, it will be per view.

In the case of adding/removing inputs from your forms, maybe there would be some way you could also handle this inside the service you created and then ng-show/hide the element depending on the access level.

A quick google search for 'Role Based Access Control in Angular' will pull up tons of useful tutorials/articles.

See This

And This (more in-depth with the same examples)

dannypaz
  • 1,294
  • 1
  • 12
  • 16
0

You need to think about it in two parts:

  1. Securing your API (ASP.NET Web API)
  2. Using security/role information to present an appropriate UI (available options and routes, elements enabled / disabled etc. -> AngularJS)

You should assume that API clients are malicious - they aren't necessarily your application.

In terms of authentication / authorisation options: HTTP header tokens, such as JWT are a common option but HTTP only cookies are still a good option, especially if your clients are all web-based. The other advantage of JWT is that you can allow the client (AngularJS) to read the payload, and easily share information about what the user is allowed to access. If you use cookies you generally have to supply that information in another way (server side injection or API call, for example).

How your generate the token / cookie (and what they contain in terms of claims) depends how you need to authenticate people. It can be your own ASP.NET MVC login form, with credentials stored in a database if necessary.

You can use MVC views as AngularJS templates if you like, though I tend not to see many advantages beyond the layout.

Nat Wallbank
  • 1,377
  • 12
  • 12