Before we start, what the heck actually is Oauth?!!

What is Oauth?

Oauth2 is a authorization protocol that allows an application to authenticate itself to another. To make it simple, you know when you are logging in in some platform and you use "Login with Google" or Facebook (Meta, whatever is the name of it haha), so you are using Google as a Oauth provider to this other application. Oauth Grant types The protocol has different ways to allow the client to get an access token, those are called "Grant types". Oauth defines four grant types: Authorization Code Grant (which we will talk more about it) Implicit Grant Resource Owner Password Credentials Grant Client Credentials Grant

Authorization Code Grant

This is the most used grant for web applications because of its flow of redirection. This grant is used to obtain access tokens and refresh tokens in a secure way between all the parts. In order to do that, we have some roles to understand first: Resource owner: The entity that has the control of the resources. Resource server: Is the API that host the data. Client: The outside application that want to has access to the data of the Resource server. Authorization server: The server that generates the tokens and allow the Client to access the data of the resource server. It doesn't necessarily needs to be a different server, it can the inside the Resource server.

Auth Flow

Don't worry about the specifics of the flow, we will go deeper on it. But here is the basic idea of it:

• The client starts the process when the user gets redirected to oauth process. The first page is a permit page, which is a frontend page showing to the users what they are allowing the clients to access from the resource owner. This url should look something like: myfrontend.com/response_type=code&clien.. (we will dig deeper on this too)
• When the user allow it, the frontend will send a GET /authorize request to the Authorization Server sending the same info the frontend received
• The Authorization Server will check the credentials sent and if everything is OK it will return a Authorization Code
• The frontend will do a redirect to the callback_uri sending the state flag back (this state flag is really important for checking against CSRF attacks) and the authorization code in the url
• The client will check the state and if it matches with the state sent in the beginning, it will do a POST /token to the Authorization server
• The Authorization Server will check again the authentication information sent (client secret is really important at this step to ensure the client has access to get an access token) and then will generate a new access token and return it to the Client
• DONE! Now the client can have access to the resource server using the access token sent in the last step

How keep this safe

Ok, now we know how it works. But how do we use it in order to have a safe flow against attackers. Since we are doing some redirects in the flow, the first thing is always make sure that we are protected against CSRF attacks. (Cross-site request forgery) Our flow has two points that can have an attack: 1. the first redirect to the frontend and 2. the token request to the api. Here is how we can keep it safe:

1. The client before doing the redirect to the frontend generates a random string, save it somewhere in the client (database/cache) and send it in the url &state=randomstring , the frontend must pass this string back to the Client on the redirect_uri so the Client can check if this string is matching with the saved on. (remembering that this state can only be used once, so delete it after matching and set a TTL to expire it)
2. Here is pretty simple, we just need to send the client_secret to the Authorization server so they can make sure that this is the same one we have saved on the database

So, that's it! Hope you are understanding Oauth2 process a little better than before and in the future I can share some coding explaining how to do it with Rails or NodeJS.

Here its some links that might help you:

• datatracker.ietf.org/doc/html/rfc6749.html
• en.wikipedia.org/wiki/OAuth
• oauth.com/playground
• https://auth0.com/docs/authorization/flows/authorization-code-flow-with-proof-key-for-code-exchange-pkce