What should OAuth2 Grant use for the secure AngularJS site that draws from an API


I am looking for suggestions on best strategy with this project.

I am building a SaaS service in which a client (tenant) may be able to access the service using an iPad app or the service website. The service website is to be written in AngularJS and laravel. Authorization is to be oAuth 2. Users logging into the website will have different roles for and different abilities. In the future we may expand services and apps, all using the same user accounts.

I am having problems working out a good authentication and authorization strategy for the services website. Since the website will run AngularJS and will connect to our own services API, I am not sure what the best way would be to handle AUTH for the user and also AngularJS. I understand that the iPad app probably will use something like "Resource Owners Grant", but what about the AngularJS website and code? Should it use "Implicit Grant", "JWT" or something else? When a user logs in, should they be given a TOKEN that authorizes all the pages on the AngularJS website? If so, do I use something like "Authorization Code Grant" and automatically authorize the request without doing some sort of redirect for the user ?

I am also considering having a "login.php" page that authorizes the user and gives the token. It could embed the users profile on the "angularjs" page and if the AngularJS page doesn't have the embedded profile, it redirects to login. But with this solution, I am still trying to figure out how to best securely connect the AngularJS page to the API.

I am quite confused since the AngularJS website is more or less an interface for our API. But I don't think the user should have to go through the "request authentication" process, they should just log in..

Thanks for any suggestions or direction.. -John

For your service website, you should use the Implicit Grant Type. This grant type is optimized for scripts in browsers and AngularJS is designed to send API request (see http and resource modules).

Your iPad app could use Authorization Code Grant Type or Resource Owner Password Credntials Grant Type.

But do not forget that OAuth2 is an Authorization protocol, not an Authentication one. If you want to authenticate users using OAuth2, I recommand you to implement OpenID Connect (http://openid.net/connect/). In fact, the authentication is done using a JWT stored in a cookie or the local storage.

You should look at the following pages ; Google uses the same protocol to authenticate users and authorized API calls: