在 angular 8 中授权资源的最佳方式是什么

Question

I am trying to handle resource (or claim) based authorization in angular 8. I found an CASL angular actions abilitiy management.

So,I want to protect all crud actionswith using action based authorization in angular 8.

It should be also claims based authorization. But, I don't know which is the best way to use.

What is the best way to make action based authroization in angular 8?

Thanks

Answer 1

CASL seems to be ACL and is done on the server side. It defines permission per resource server side. Angular is a client side framework.

"What is the best way" questions usually get closed pretty quickly as it's subjective.

There is no difference how you access a resource if it's protected by ACL, RBAC or whatever. If the http request returns an error, you might handle the response and output whatever messages you wish. "claims" based auth you're probably thinking openid-connect/oauth2 or your own JWT claim sending auth that is on the server side.

Your own implementation is simpler to understand since you wrote it, right? But it takes longer to write and do right.

I'm only aware of 2 open source openid connect servers, that's keycloak and identityserver4

There are libraries for Angular, but it's all very shaky. There's a general purpose oidc/oauth2 library for Angular by Manfred Steyer, but it has issues with code flow, only password flow and implicit flow really work and then it gets more and more complicated finding out why silent refresh doesn't work. Chrome doing a cookie security SameSite update soonTM which will break many sites.

There's a keycloak js adapter and a ngx-keycloak repo but they also have their issues, especially again token refresh before expiration.

There are commercial providers with their libraries that I have not tested, like auth0 and okta.

Developing your own auth thing, which is separate from the ACL and/or RBAC, takes time on both the server and the client side, but you have control over everything. You could mimic some of the oauth2/oidc features, like a token info endpoint, since you're sending out JsonWebTokens (JWT).

The more distributed, the less monolithic your app is the more complicated it also is.

What is the best? It always depends.

Answer 2

CASL is isomorphic, so can be used on both backend and frontend. There is a separate package for Angular @casl/angular which helps to integrate CASL easier.

Currently the overall phylosophy of CASL is spinning around actions (or claims) and subjects. I'm working right now on CASL v4 which will have better TypeScript support and will have support for claim based authorization.

You can use CASL even right now, look at this comment for information of how to configure Ability to use claim base authorization

Update : by the way there is an example of integration between CASL and Angular . Related article is in README