Session Inactivity Timeout

(Stoke Master Jack) #1

How do you handle this in a React SPA?

In the old non-spa app I am replacing, the server handled this. Each time the user navigated to a new page, the server would check to see if he was still logged in. If not, user is redirected to a login page.

Thinking about how to implement same function on SPA, and it doesn’t seem obvious. How are you guys handling this?

(Alexei) #2

To be ownest it’s not clear what do you behind “Inactivity”. But I know how to implement your example using react-router, redux and react-router-redux. Because each user navigation will cause dispatching of special event and you can handle this event in middleware analyze it and so on.
It’s the way which I prefer.

But if you are not using redux, only react-router(because I don’t know other robust routing library), you can listen to history.

Does it help? If not please clarify your problem.

(Kurt Ericson) #3

In our case, we expect the server to generate a 401 response if the session hits an inactivity or expiration limit. In the client, the response handler checks the status code on every request and, in the case of a 401, dispatches a REAUTHENTICATE action which leads to login modal reappearing (similar to how GitHub handles elevated permission checks when changing repo settings). The client could also mirror the timeout internally with an in-app timer (e.g. setTimeout and clearTimeout) that get’s reset on relevant UI actions. If that timer ever reaches 0, the same REAUTHENTICATE action is dispatched.

(Arnold) #4

Timers and multiple tabs never work together. You should take into account users might use multiple tabs