Blog/NotesConcept

Notes for Web Authorization Techniques - Session & JWT

Understand important web authorization techniques to enhance role-based authentication for any web application with popular techniques like Session & JSON Web Token (JWT)

intermediate

Anuj Sharma

Last Updated Aug 29, 2024


Authorization is about validating the user's permission to access the resources, in case of failure HTTP code "403 Forbidden" is returned.

Authorization Techniques

2 Major techniques for authorizations

1. Session-based authorizations - using session id

Authorization flow
  1. The client sends a username & password to the server. The server validates credentials against existing credentials stored in the DB

  2. On successful authentication server generates a unique session id (signed) and stores session_id on the server.

  3. The server sends back session_id which will be set as part of a cookie

    HTTP OK 200 set-cookie
  4. All subsequent HTTP calls include session_id and request as part of the COOKIE request header.

  5. The server validates session_id as part of the cookie against the stored cookie if valid then authorize the user to process that HTTP request.

Major drawbacks
  1. Hard to load balance - Since this is a stateful mechanism, it requires the server to store the session id, but in the case of multiple servers, this session is invalidated if the request is routed to another server by an API gateway or load balancer.

    How to solve - The above problem can be solved using common caching like Redis where all the servers will store and access session_id from Redis cache.

  2. Session-based authentications are prone to CSRF attacks. This can be prevented by using the
    X-CSRF-Token header.

  3. Pros - Cookies can be secured using HTTP-Only, same-origin options along with a Set-Cookie header so that it can't be accessible through JavaScript code.

2. Token-based authorization (Stateless) - JWT token

Authorization flow
  1. The client sends a username & password to the server. The server validates credentials against existing credentials stored in DB

  2. On successful authentication server generates a unique Token, which contains data(payload) related to the user and signs that token.

  3. This Token is sent back to the user as part of a successful HTTP response with the Authentication HTTP header

    HTTP 200 OK Authentication: Bearer [Token]
  4. Users save this token in a cookie or local storage

  5. The user sends this token along with API requests in subsequent requests as part of the Authentication header.

  6. If the token is valid then the server authenticates that token and processes the API request.

Major drawbacks
  1. Secret must be shared between servers so that the server can extract the user details.

  2. In case of invalid Tokens(forgot password), requires a list of invalid tokens which makes a more sort of stateful kind.

  3. Token-based authentications are prone to XSS attacks.

  4. The token is not opaque and contains payload information, and this can be extracted from the token.

  5. No sensitive information can be mentioned as part of the payload.

  6. The generation of a new signature is essential a frequent intervals to avoid Resource Forgery attacks

Flaunt You Expertise/Knowledge & Help your Peers

Sharing your knowledge will strengthen your expertise on topic. Consider writing a quick Blog/Notes to help frontend folks to ace Frontend Interviews.

Other Related Blogs

What is CORS ? Cross-Origin Resource Sharing Explained [For Interviews]

Anuj Sharma

Last Updated Nov 16, 2024

A brief explanation of Cross-Origin Resource Sharing (CORS) concept to enable client application accessing resources from cross domain and HTTP headers involved to enable resource access.

Ultimate guide to REST API calls using Fetch: Machine Coding Essential

Vivek Chavan

Last Updated Sep 15, 2024

You will get a clear understanding about working with any rest api and common concepts asked during interviews

5 Ultimate Rules to master this keyword in JavaScript

Anuj Sharma

Last Updated Aug 29, 2024

Easy to understand 5 rules, that cover the behaviour of the "this" keyword in different contexts and helps you to master this keyword for any javascript interview.

Understand Bind method and It's Polyfill implementation Step by Step

Ram V

Last Updated Sep 20, 2024

Let's dive into how the function's bind method works to bind the context to any function and understand its internal workings by exploring bind method polyfill.

Best Frontend System Design Interview Cheat Sheet 📒

Anuj Sharma

Last Updated Sep 3, 2024

Most comprehensive frontend system design cheat sheet to help in approaching the system design interview in the best-structured way. Covered 7 most important frontend system design interview topics.

Notes to Master Promises Methods - all(), allSettled(), race(), any()

Anuj Sharma

Last Updated Aug 31, 2024

Understanding promise's methods is important to call APIs in parallel and it's an important concept to know for any machine coding interview.

FrontendGeek
FrontendGeek

© 2024 FrontendGeek. All rights reserved