Quick Lecture Overview
Subscribing gives you access to a brief, insightful summary of each lecture to stay on track.
HTTP State Management Mechanisms
Loading...
Loading...
With all these ways to authenticate, it's important to know how to handle user sessions and data on both the user's device and the server. This is where state management techniques come into play.
HTTP is a stateless protocol, meaning it does not maintain state between requests. However, web applications often require maintaining state to manage user sessions, track user preferences, and personalize user experiences.
To address this, various state management mechanisms have been developed, including cookies, local storage, session storage, and more.
Cookies are small pieces of data stored in the user's web browser by the server. They are commonly used for session management, tracking user preferences, and personalizing user experiences.
Client sends cookies with every request to the same server, allowing the server to identify the user and maintain state across requests. It happens automatically once the cookie is set by the server making it a convenient way to manage user sessions.
Local storage is a web storage mechanism that allows data to be stored in the user's web browser. It provides a simple key-value storage interface and is commonly used for persisting user preferences, caching data, and storing application state.
It provides a larger storage capacity than cookies (typically up to 5-10MB per domain) and is accessible via JavaScript APIs.
Local storage is commonly used for caching static assets, storing user preferences, and offline data storage in progressive web applications (PWAs).
Session storage is similar to local storage but is cleared when the user's session ends (i.e., when the browser is closed). It is commonly used for storing temporary data that should not persist across sessions.
Using session storage can help improve security by ensuring that sensitive data is not stored beyond the user's session.
It is often used for temporary data storage, such as form data and shopping cart items, that should not persist across browser sessions
IndexedDB is a low-level API for client-side storage of significant amounts of structured data, including files/blobs.
It provides a more powerful and flexible storage solution compared to local storage and session storage but requires more complex programming logic.
It is commonly used for storing large datasets, offline data synchronization, and complex data querying in web applications.
Some of the above options are used to store session data on the client side, while others are used for more general data storage and caching.
The choice of state management mechanism depends on factors such as the type of data being stored, the application's requirements, and the user experience.
While implementing authentication, we'll also have to verify the user's identity and ensure that they have the necessary permissions to access the requested resources for each request. That's where authorization comes into play.
This process involves validating user credentials, managing user sessions, and enforcing access control policies based on the user's role and permissions.
There are several methods commonly used to store session tokens for verifying each request from the client to the server:
A session token is a unique identifier used to authenticate a user's session. It is typically generated during the authentication process and is used to associate a user with their session data on the server.
It's a common practice to store session tokens on the client side and send them with each request to authenticate the user.
Do keep in mind that session tokens are not associated with session based authentication only, they can be used with token based authentication as well in the form of bearer tokens like JSON Web Tokens (JWT).
Here, it's a general term used to refer to the unique identifier used to authenticate a user's session.
Cookies
Session tokens are often stored as cookies on the client's browser. The server sets a cookie containing the session token during the authentication process, and the client automatically sends this cookie with each subsequent request.
Pros:
Cons:
Authorization headers (Bearer tokens)
Bearer tokens, such as JSON Web Tokens (JWT), are another common method for storing session tokens.
After successful authentication, the server generates a token containing user information and signs it. This token is then sent to the client, typically in the response body, and the client includes it in the Authorization header of subsequent requests.
Pros:
Cons:
Local Storage
Session tokens can also be stored in the client's local storage, a mechanism for persistently storing data on the client side beyond the duration of a session.
Pros:
Cons:
Session Storage
Similar to local storage, session tokens can be stored in session storage, a web storage mechanism that stores data only for the duration of the browser session.
Pros:
Cons:
Further, I have added some resources below for you to read and understand more about the topic. Do check them out.
Ciao 👋🏼
By logging in, you'll unlock full access to this and other free tutorials on JSM Pro.
Why? Logging in lets us personalize your learning experience, track your progress, and keep you in the loop with new workshops, coding tips, and platform updates.
You'll also be the first to know about upcoming launches, events, and exclusive discounts.
No spam—just helpful content to level up your skills.
If that sounds fair, go ahead and log in to continue →
Enter your name and email to get instant access
##Looks like we found a thief monkey By the way, I liked the trick how you reached till here. You have a good sense of humor. You will improve a lot if you join our course with this passion.
var (function-scoped, outdated)let (block-scoped, modern and recommended)const (block-scoped, cannot be reassigned)_, or $let let = 5; is invalid)myVar and myvar are different)string, number, boolean, null, undefined, bigint, symbolObjects, Arrays, FunctionsSubscribing gives you access to a brief, insightful summary of each lecture to stay on track.
00:00:02 Similarly, as in the last lesson, I want to tell you a bit about HTTP state management mechanisms.
00:00:08 There are many different ways to authenticate, so it's important to know how to handle user sessions properly, and how to handle the data both on the user's
00:00:18 device and the server.
00:00:19 And this is where different state management techniques come into play.
00:00:22 Of course, cookies are something you're going to hear about often.
00:00:26 they allow you to store data in the user's browser sent by the server, commonly used for session management, tracking user preferences,
00:00:34 and personalizing user experiences.
00:00:37 The client sends cookies with every request to the same server, allowing the server to identify the user and maintain state across requests.
00:00:46 Local storage is a different web storage mechanism that allows data to be stored in the user's web browser, provides a very simple key value storage.
00:00:55 You can think of it like a basic JavaScript object stored in your user's browser, where users can also define their preferences,
00:01:02 cache data, and store application state.
00:01:05 It has a larger capacity than a cookie, which makes it useful for caching different static assets, and even be used as offline data storage in PWAs.
00:01:14 But it's not super secure.
00:01:16 There's also session storage, which is similar to local storage, but it's cleared when the user session ends, when the browser is closed.
00:01:24 It is commonly used for storing temporary data that should not persist across sessions, which makes it particularly useful to improve security by ensuring
00:01:33 that sensitive data is not stored beyond user session.
00:01:37 So, how are we going to store sessions for authorization?
00:01:40 Well, there's a few different ways.
00:01:43 First of all, there is a session token, which is a unique identifier used to authenticate a user's session.
00:01:50 It's typically generated during the authentication process, and it is used to associate a user with their session data on the server.
00:01:58 It is a common practice to store session tokens on the client side and send them with each request to authenticate the user.
00:02:05 Keep in mind that session tokens are not associated with session-based authentication only.
00:02:11 They can also be used with token-based authentication in form of a bearer tokens like JSON web tokens or JWTs.
00:02:20 And now each one of these like cookies, authorization headers, local storage, session storage have their own pros and cons.
00:02:29 So make sure to read the text below as well as some additional documents, which I decided to provide right below.
00:02:35 After that, you can move to the next lesson.
