Managing jwt expiration in Single Page Applications

After receiving a JWT from the backend where even the public key is encrypted, I am left with only the encoded token. This token is appended to all of my app's http calls, but there are only 5 such calls - 4 get requests and 1 put request. The issue arises in that I can only verify the token's validity during the first 4 http calls; once the data is cached, I lose control over monitoring the token's expiration. How can I ensure that the user is logged out automatically when the token becomes invalid? Would implementing an interval to check the token's validity at regular intervals on a specific endpoint be a feasible solution?

The token expires in 3 hours, so would it make sense to periodically check the token's validity every 20 minutes by pinging the server?

Answer №1

Here are a couple of options to address your issue :

  • Request the backend team to provide the token's expiration date along with the token.
  • The token is simply a base64 encoded string, so you have the option to decode it and retrieve the expiration date stored within.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

How do I inform Jest that spaces should be recognized as spaces?

Here is some code snippet for you to ponder: import { getLocale } from './locale'; export const euro = (priceData: number): string => { const priceFormatter = new Intl.NumberFormat(getLocale(), { style: 'currency', currenc ...

Angular 2 Ahead-of-Time compiler: all clear on the error front, yet a nagging feeling of

I've spent the last 72 hours trying to figure out how to make Ahead-of-Time compilation work for my Angular 2 rc.6 application. Currently, my application runs smoothly using Just-in-Time compilation. I've made sure to install all necessary depe ...

All you need to know about the impressive world of HTML5

When the server sends coordinates for a shape like a rectangle, rhombus, circle, trapezium, or polygon and I am uncertain about which one will be received, how should I decide on the figure to draw on the canvas using the Angular framework? ...

Angular Group Formation Issue

I keep encountering the following error: formGroup expects a FormGroup instance. Please pass one in. This is how it looks in HTML: <mat-step [stepControl]="firstFormGroup"> <form [formGroup]="firstFormGroup"> And in my Typ ...

Remember to always call "done()" in Typescript + Mocha/Chai when dealing with async tests and hooks. Additionally, when returning a Promise, make sure it resolves correctly

It seems like I'm facing an old issue that I just can't seem to resolve, despite trying everything in my power. The error message reads: Error: Timeout of 2000ms exceeded. For async tests and hooks, ensure "done()" is called; if returning a Pro ...

Is the relevance of Angular 1.x still prevalent in today's development landscape

Considering I have several projects in angular 1.x, I'm contemplating whether it's truly essential and efficient to upgrade them to angular 4 or a later version. The smaller dashboards do not necessarily require an update since they are only use ...

The process of setting up a dynamic cursor in ReactFlow with Liveblocks for precise zooming, panning, and compatibility with various screen resolutions

The challenge lies in accurately representing the live cursor's position on other users' screens, which is affected by differences in screen resolutions, zoom levels, and ReactFlow element positioning as a result of individual user interactions. ...

Exploring the power of Angular 2 looping functionality

I am struggling to create a for loop to iterate through my array efficiently. Below is the code snippet that I have and its functionality explained. export class BookingService { private config: Object; public domainSettings: Object = {}; co ...

Ensuring Mongoose Schema complies with an external API

My database schema includes a mongoose User schema with the following structure: const User: Schema = new Schema({ // some other fields email: {type: String, unique: true, require: true, validate: [myValidator, 'invalid email provided'], // some ...

Why are UI changes delayed when using Angular2 Google Maps events?

I am working on an Angular2 application that integrates the Google Maps JS API. When loading Google Maps, I include the script like this: <script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY"></script> To listen to events on ...

Unlocking Column Data Tooltips in Angular Datatables: A Step-by-Step Guide

I have a single datatable and was wondering how to implement tooltips for when hovering over table cells. I tried the following code snippet, which successfully populated the tooltips. However, I am interested in achieving the same functionality using Angu ...

Steps to resolve the error message 'Uncaught Error: Unable to find all parameters for AuthService: (?)'

An issue is arising when the application is initiated. No errors are displaying in the terminal, but they appear in the browser console. The last action taken was importing JwtHelperService from '@auth0/angular-jwt'. The project involves Nodejs, ...

Ensure the cursor is continually grabbing while moving items within a list using the @angular/cdk/drag-drop functionality

I have an example on stackblitz where I am using @angular/cdk/drag-drop in my project. I am attempting to change the cursor to cursor:grabb and cursor:grabbing when the cursor is over an element and when I drag a picked element. Here is the CSS line I am ...

How come the Angular 2 router is updating the template but not the URL after a manual change?

I have a few different paths in my application setup: [ { path: "admin", component: ContentComponent, canActivate: [ CanActivateIfAuthenticated ], children: [ { path: "", path ...

Using TypeScript TSX with type parameters

Is it possible to define type parameters in TypeScript TSX syntax? For instance, if I have a class Table<T>, can I use something like <Table<Person> data={...} /> ...

Retrieving targeted information from the store following the retrieval of data from an API

In my project, I have set up an RXJS effect that loads an organization from the server upon a certain action. Once the organization is loaded, I attempt to select a bookmark from the NGRX store based on the organization ID. Finally, I dispatch a success ac ...

At what point in the process does Angular/PrimeNG switch the CSS classes from 'p-' to 'ui-'?

So I've encountered quite a peculiar problem. I've managed to create a customized PrimeNG component that seems to be functioning properly, but there are a couple of issues at hand: Despite using ViewEncapsulation.None, just like with other Pri ...

Updating a signal based on an input signal in Angular 17.1: A step-by-step guide

In my development project, I am utilizing an angular service that utilizes signals for implementation. export class MyService { private idSignal = signal(0); setId(id: number) { this.idSignal.set(id); } } Withi ...

How can I access the parameter value for the tooltip callback function within echarts?

I am attempting to retrieve the value for this specific Apache EChart from within the callback function of the tooltip formatter. When I manually input the value, the formatting function operates correctly: formatter: (params:any) => `$ ${Math.round(pa ...

Issues with Typescript function overloads when dealing with union types

I'm struggling to make function overloads work properly in TypeScript. My challenge involves a basic union type and a function that is capable of handling either type. I have defined overloads to deal with them separately. type A = { type: "a", x: n ...