As the title says, I am building a simple project using React and Node/Express.js.
To tell the client if a user is logged in, I am using express.session cookies and receiving these in the client using 'universal-cookie'.
However, I am running into an issue where I have to click logout twice in order for the cookie to be cleared from the chrome dev tools > network > cookies tab. Any ideas why?
Express route:
const express = require('express');
const logoutRouter = express.Router();
logoutRouter.get('/', (req, res) => {
req.logout();
res.clearCookie('currentsession').redirect('/');
});
module.exports = logoutRouter;Logout Component (React):
const Nav = () => {
const logout = async () => {
await fetch('/logout', {
headers : {
'Content-Type': 'application/json',
'Accept': 'application/json'
}
});
}
return (
<nav className='nav-bar'>
<p className='title'>The Football Shop</p>
<div className='nav-links'>
<Link to='/login'>
<button>Login</button>
</Link>
<button onClick={() => logout()}>Logout</button>
</div>
</nav>
);
};index.js (Express):
app.use(session({
name: 'currentsession',
secret: process.env.SESSION_SECRET,
resave: false,
saveUninitialized: false,
cookie: {
maxAge: 21600000,
sameSite: false,
httpOnly: false,
}
}));