Why you shouldn’t use access tokens in your front-end any more (2024)

And how to move authentication to the server-side

To obtain authorization for API-endpoints, many Single-Page Applications use OAuth2. Word has it, lately, you should not use access_tokens in the front-end any more. Why is that?

Read this article to learn:

  • How a Single Page Application obtains authorization at the client-side
  • How this may be a risk
  • What the alternative is

Modern web applications authenticate users with Single Sign-On. Medium is a good example of this: You can log-in with your Google account, at Spotify you can log in with Facebook, and so forth.

This means the log-in page is not part of a modern web application anymore. This has some implications:

  • When you log-in, you are logged into Google, for example. When you log in with Google, they issue some sort of token which represents your session at Google.
  • When you want to log-in at, say Medium, you will have to leave Medium.com, navigate to Google to authenticate, and then navigate back to Medium.com.

This is schematically displayed in the following diagram:

Why you shouldn’t use access tokens in your front-end any more (2)
Why you shouldn’t use access tokens in your front-end any more (2024)

FAQs

Why you shouldn’t use access tokens in your front-end any more? ›

The token is stored at the client-side. This makes it easier for an attacker to obtain the access token.

Why you shouldn t use JWTs as session tokens? ›

JWTs which just store a simple session token are inefficient and less flexible than a regular session cookie, and don't gain you any advantage. The JWT specification itself is not trusted by security experts.

Where should I store access token in front end? ›

Option 1: Store your access token in localStorage : prone to XSS. Option 2: Store your access token in httpOnly cookie: prone to CSRF but can be mitigated, a bit better in terms of exposure to XSS. Option 3: Store your refresh token in httpOnly cookie: safe from CSRF, a bit better in terms of exposure to XSS.

Is it safe to keep access token in local storage? ›

XSS attack: storing JSON web tokens in LocalStorage makes them susceptible to a XSS attack. Lack of Encryption: LocalStorage does not provide built-in encryption, encrypted tokens make the stored data virtually inaccessible if an attacker gains access to the user's device.

Is it okay to store access token in database? ›

If the request to the 3rd party API is through your server, store the access token in the database tied to the user, encrypted with a key that is stored as an environment variable. If the database is compromised, the tokens are safe.

What are the criticism of JWT? ›

The criticisms of JWT seem to fall into two categories: (1) Criticizing vulnerabilities in particular JWT libraries, as in this article. (2) Generally criticizing the practice of using any "stateless" client tokens. Because there's no great way to revoke them early while remaining stateless, etc.

What are the disadvantages of JWT tokens? ›

Disadvantages of JWT Authentication:

Limited Token Expiry Control: Once issued, JWTs remain valid until they expire. Revoking a JWT before expiration requires additional complexity, such as token blacklisting. Security Risks: If the secret key used to sign JWTs is compromised, attackers can create forged tokens.

Should you store access token in session? ›

If your app needs to call APIs on behalf of the user, access tokens and (optionally) refresh tokens are needed. These can be stored server-side or in a session cookie. The cookie needs to be encrypted and have a maximum size of 4 KB.

What is the safest way to store access tokens? ›

However, they do not need to be stored in the client because the back end performs the API calls. We recommend storing tokens on the server, as this offers traditional web apps the maximum level of security. If this cannot be done, you should use encrypted session cookies so the client cannot read token values.

Should I store a JWT token in a cookie? ›

In choosing either JWT or cookies storage, functionality, needs and target should be considered before concluding on what to use. However, JWT can be stored inside Cookie. This method is safer because attackers won't be able to steal your user's token easily.

What is the vulnerability of storing JWT in local storage? ›

Vulnerability to XSS Attacks: The primary security concern with Local Storage is its susceptibility to Cross-Site Scripting (XSS) attacks. If an attacker can inject malicious scripts into your web application, they can access Local Storage and retrieve the stored JWTs, leading to potential security breaches.

Is it safe to store JWT in sessionstorage? ›

To reiterate, whatever you do, don't store a JWT in local storage (or session storage). If any of the third-party scripts you include in your page is compromised, it can access all your users' tokens. To keep them secure, you should always store JWTs inside an httpOnly cookie.

How do I protect my access tokens? ›

Embrace HTTPS: Do not send tokens over non-HTTPS connections as those requests can be intercepted and tokens compromised. Consider all of your authorization use cases: Adding a secondary token verification system that ensures tokens were generated from your server may be necessary to meet your requirements.

Is JWT obsolete? ›

The JWT app type will be completely deprecated as of June 2023. New and current users have 12 months to migrate their JWT based solutions to the Server-to-Server OAuth app type.

How do I store API tokens safely? ›

When using a personal access token in a script, consider storing your token as a GitHub Actions secret and running your script through GitHub Actions. You can also store your token as a Codespaces secret and run your script in Codespaces.

Should access tokens be cached? ›

After retrieving a token, store it in an in-memory cache, like Memcached, or a built-in ASP.NET cache service. By default, Access Tokens are valid for 60 minutes, but we recommend setting the expiration time to around 50 minutes to allow for a buffer.

Can JWT be used for session? ›

JWTs for session management are a great solution if: Your performance needs require that your app needs to be able to validate sessions without an external network request on every call. You're using Stytch session management to authorize actions outside of your app and that authorization works via JWTs.

Is it safe to store JWT in session storage? ›

Any way,you shouldn't store a JWT in local storage (or session storage). If you store it in a LocalStorage/SessionStorage then it can be easily grabbed by an XSS attack. If the answer is helpful, please click "Accept Answer" and upvote it.

Is it safe to use JWT tokens? ›

JWTs aren't encrypted

If your web application needs to store sensitive information in tokens, the website needs to handle them with caution. Generally, you should avoid storing sensitive information in tokens because it is very difficult to protect them against all possible cybersecurity attacks.

Why use token instead of session? ›

Choosing a proper method

If your application handles sensitive data or requires rapid revocation, session-based authentication may be the better choice. If your application needs fast, efficient authorization or requires more interaction between the client and server, token-based authentication may be more suitable.

Top Articles
You can't add a PayPal account to Apple Pay, but you can add it to your Apple ID — here's how
What Is Commercial General Liability?
English Bulldog Puppies For Sale Under 1000 In Florida
Katie Pavlich Bikini Photos
Gamevault Agent
Pieology Nutrition Calculator Mobile
Hocus Pocus Showtimes Near Harkins Theatres Yuma Palms 14
Hendersonville (Tennessee) – Travel guide at Wikivoyage
Compare the Samsung Galaxy S24 - 256GB - Cobalt Violet vs Apple iPhone 16 Pro - 128GB - Desert Titanium | AT&T
Vardis Olive Garden (Georgioupolis, Kreta) ✈️ inkl. Flug buchen
Craigslist Dog Kennels For Sale
Things To Do In Atlanta Tomorrow Night
Non Sequitur
Crossword Nexus Solver
How To Cut Eelgrass Grounded
Pac Man Deviantart
Alexander Funeral Home Gallatin Obituaries
Energy Healing Conference Utah
Geometry Review Quiz 5 Answer Key
Hobby Stores Near Me Now
Icivics The Electoral Process Answer Key
Allybearloves
Bible Gateway passage: Revelation 3 - New Living Translation
Yisd Home Access Center
Pearson Correlation Coefficient
Home
Shadbase Get Out Of Jail
Gina Wilson Angle Addition Postulate
Celina Powell Lil Meech Video: A Controversial Encounter Shakes Social Media - Video Reddit Trend
Walmart Pharmacy Near Me Open
Marquette Gas Prices
A Christmas Horse - Alison Senxation
Ou Football Brainiacs
Access a Shared Resource | Computing for Arts + Sciences
Vera Bradley Factory Outlet Sunbury Products
Pixel Combat Unblocked
Movies - EPIC Theatres
Cvs Sport Physicals
Mercedes W204 Belt Diagram
Mia Malkova Bio, Net Worth, Age & More - Magzica
'Conan Exiles' 3.0 Guide: How To Unlock Spells And Sorcery
Teenbeautyfitness
Where Can I Cash A Huntington National Bank Check
Topos De Bolos Engraçados
Sand Castle Parents Guide
Gregory (Five Nights at Freddy's)
Grand Valley State University Library Hours
Hello – Cornerstone Chapel
Stoughton Commuter Rail Schedule
Nfsd Web Portal
Selly Medaline
Latest Posts
Article information

Author: Terence Hammes MD

Last Updated:

Views: 6651

Rating: 4.9 / 5 (49 voted)

Reviews: 88% of readers found this page helpful

Author information

Name: Terence Hammes MD

Birthday: 1992-04-11

Address: Suite 408 9446 Mercy Mews, West Roxie, CT 04904

Phone: +50312511349175

Job: Product Consulting Liaison

Hobby: Jogging, Motor sports, Nordic skating, Jigsaw puzzles, Bird watching, Nordic skating, Sculpting

Introduction: My name is Terence Hammes MD, I am a inexpensive, energetic, jolly, faithful, cheerful, proud, rich person who loves writing and wants to share my knowledge and understanding with you.