Introduction

Token-Based Authentication Aka TBA is a security protocol that relies on the use of access tokens for authentication and authorization, this mechanism checks the user's identity for accessing a certain software application, be it a website, a desktop application, or an API. In this brief article, we will go over the following points:

1: How Token-Based Authentication works
2: How it differs from Cookie-Based Authentication

How Token-Based Authentication Works

First of all, the user attempts to sign in to their account using an email and a password, they submit the request, it goes to the server where it checks the user's credentials if they are valid credentials and match those of that specific user (Correct email and password), the server issues an access token for the user and sends it back in the response.

Secondly, through some wiring on the client-side Aka Front-end, the access token gets stored somewhere, and it's then attached with every subsequent request the user makes inside the application.

Lastly, the server validates the access token by checking its signature, expiration time, and audience. In case the token passes all the checks, the server authenticates the user and sends back the information that the user has requested. Otherwise, the server would return an error response and the application could then redirect the user to an unauthorized page, or prompt them to sign in again.

How TBA differs from Cookie-Based Authentication

Token-Based Authentication: a token is used for authenticating requests. The token is usually sent in the HTTP's Authorization header. TBA is very common when building Single Page Applications or SPAs for short, as the application might rely on multiple sources for the services the app consumes, because tokens can be sent to various domains, while cookies are scoped to a single domain.
So if you're building a project with React.Js, Vue.Js or Blazor Wasm, you might want to see how you can implement Token-Based Authentication as it's really powerful for SPAs.

Cookie-Based Authentication: a cookie is instead used for authenticating requests. The cookie gets sent by the browser on every request the user makes in the application to show the server that the user is authenticated.

The major difference however is not about what's used for authenticating the requests, it's rather about where the session information is kept.
For cookies, the session information is stored on the server, the server would put the Session ID in the cookie, before sending it to the client, and when the cookie is sent back with later requests, the server does a checkup on wether that Session ID exists or not.

Tokens on the other hand don't contain a Session ID, instead they store information on the user like claims and additional info as who issued the token, its expiration date etc...
Instead of checking for a Session ID here, the server would have a security key that it uses to validate the token, if the token however is tampered with, and is an invalid one, the server would reject it as it would fail the validation process, but if it was in fact a valid token, the server would mark the sender as authenticated, and grant access for them.

Conclusion

We've explained in this article the authentication method known as Token-Based Authentication, the purpose of this post wasn't to get you hands-on with the implementation of this authentication mechanism, it was instead mainly regarding the theory, the boring bits. But regardless of that, it's crucial to know how this protocol operates under the hood as it'd help you understand why you're doing what you're doing when it comes to implementing TBA in your applications.