2

I have a ReactJS 17.0.2 application that made use of a couple of cookies to check if a user is logged in. I use import { useCookies } from 'react-cookie';

If the user is logged in, he/she can open another tab in the browser, and being automatically recognized. Just the same as you are logged in multiple google pages: you log in just once.

The opposite for me is not true.

When the user logs out on one of the n pages, the cookies are deleted and the user is logged out on that page/tab.

But, in the other tabs, the user remains logged in.

I would like to use some mechanism to trigger the other page that the cookie has been deleted, so that I can force a logout to the other pages too.

I don't know how, but I'd like to have some kind of listener or hook able to be activated when the cookie has been deleted.

A kind of publishing/subscribing approach, applied to cookies ....

I found nothing. The only idea in my mind is to have a react timeout and then check once a second if the cookie yet exists, but I'm not enthusiast of this approach.

Any suggestion will be welcome.

Paolo Di Pietro
  • 517
  • 3
  • 17
  • https://medium.com/swlh/react-hooks-usecookie-hook-26ac06ff36b0 maybe this will help? I searched on google "react hook for cookies" and came out with some good-looking results. – omercotkd Mar 13 '22 at 23:07
  • @omercotkd TY for your suggestsion. I gave a look and seems interesting. But it is a complete rewrite of the cookie management library. I use `'react-cookie'`, and using the approach suggested I should throw away this library to rewrite it practically from scratch. And it miss removeCoockie, secure, samesite and other stuffs like these. Secure=false and SameSite=None will be discontinued in the near future. – Paolo Di Pietro Mar 13 '22 at 23:38
  • I think you might be thinking about this from the wrong direction. It's not about detecting when the cookies are deleted, but rather, knowing the first time an invalidated cookie is used. – Drew Reese Mar 14 '22 at 04:35
  • @DrewReese You're right. But, using `react-cookie`, it looks like the cookie has been cached, so, in the second tab, it always looks valid. Do you know a method to know when a cooki has been invalidated? – Paolo Di Pietro Mar 14 '22 at 14:41
  • Cookie-based authentication schemes have fallen out of favor, generally replaced by token-based authentication. Is there a value stored in the cookie that is being used to validate a user's access? – Drew Reese Mar 14 '22 at 15:25
  • @DrewReese We have user-uuid and session-uuid, and both are used to validate the user's access into the database. There is a timer that is renewed at every user activity, and the session is closed after 60 minutes of inactivity. I could easily transform the cookie based login in an token based one. But the problems still remains: the token still is a cookie, and if I delete it in one page, it result active in the other. – Paolo Di Pietro Mar 14 '22 at 15:42
  • I suppose the point I'm trying to drive you to is that you can check the token/cookie/value when the app starts against your backend.... and if token/cookie/value is invalid take appropriate action. AFAIK there's no trivial way to externally invalidate/delete a cookie by "listening" to one being deleted elsewhere. – Drew Reese Mar 14 '22 at 16:05
  • That's exactly what I thought, and is what I'm actually doing. TY – Paolo Di Pietro Mar 14 '22 at 17:34

0 Answers0