Can I use Authorization Code grants for an SPA tig

问题:

I am building an Angular (version 5) app that only talks to one backend, my API (flask application on a web server), which in turn talks to my database. The application is for data entry and visualization, where data is constantly loaded and saved to/from the backend. I have control over all three parts.

I am thinking of using Auth0 to handle the auth/user management.

My question is, can I treat this application as a 'regular' web app and use Authentication Code Grants, instead of implicit grants as is usually recommended for SPA's? That is:

1. The SPA would get an Authorization Code from auth0 through a /login endpoint redirecting to the appropriate auth0 page
2. Authorization Code is passed to the API through some endpoint (probably the /callback endpoint).
3. API talks to Auth0 to exchange exchanges AC for a token.
4. Token is passed to database with every request, and rejects if token is not valid (Token validity checking is possible in-database with postgresql)
5. The association between the token on the API server and the user is done through encrypted cookies (Flask's 'session' variable)

Reading through the a lot of the discussion around Implicit Grants vs Authentication Code Grants, it seems the main difference is that in a true SPA application, there is no single server controlled by the Resource Provider which could store the Client Secret or token. But, with my situation, can't I just think of the SPA application as a traditional (ajax-heavy) web page?

I found this post in the auth0 forums which hints that this may be " brittle because in practice you have an OAuth2 flow being handled by what should be two independent components," but I do not understand how independence between the components should make any difference.

回答1:

Yes, you can use the Authentication Code grant. If you use it, there are some design implications:

• Your backend will have the role of OAuth2 client, not the SPA
• If you pass a token from the backend to your SPA and use it for authentication (if that's what you meant with the point 4 in your question), the token will expire after some time and the user will have to go through the authentication process again, which can be annoying.

So I would suggest:

• To perform authentication, the backend should have two endpoints - one for redirecting to the OAuth2 server and one for accepting the redirect from the OAuth2 server (containing the auth code). There is no need to get the code to your SPA.
• Backend exchanges the code for tokens. The tokens can be kept in a backend session if needed or just keep the user info in the session - you probably don't need the tokens anymore.

So the main difference between using the two grants is that with the Implicit grant, your SPA needs to be able to renew tokens before expiring (see the OpenID Connect Session Management) and wiith the Authentication Code grant, the backend needs to be stateful - to keep a session for its client.