Je crée une application en utilisant node et express. j'implemente une solution pour l'authentification des utilisateurs à partir leurs roles et en utilisant JWT et cookie pour les sessions , tout va bien mais de que je commence à développer des autres fonctions  je perds ma session suite à une actualisation de la page de navigateur ou aprés ajouter quelques modifications dans ma code , céci ma scénrio : de que un admin a authentifié , il a passé vers la page de tableau de bord , dans ma cas lorsque je perds ma session je reste en tableau de bord et je ne redirecte pas vers la page de connexion ..

Je vais fournir mon fichier auth.js à partir de mon dossier de routage. Je peux en rajouter si besoin.

ps : j'utilise redux pour gérer les états

comment je peux résoudre cette probléme ?

ceci mon code de route auth.js :

const express = require('express');
const router = express.Router();
const User = require('../../models/user');
const jwt = require('jsonwebtoken');




router.post('/admin/signin', validateSigninRequest, (req, res) => {
    User.findOne({ email: req.body.email })
        .exec((error, user) => {
            if (error) return res.status(400).json({ error });
            if (user) {

                if (user.authenticate(req.body.password) && user.role === 'admin') {

                    const token = jwt.sign({ _id: user._id, role: user.role }, process.env.JWT_SECRET, { expiresIn: '1h' });
                    const { firstName, lastName, email, role, fullName } = user;
                    //create cookie
                    res.cookie('token', token, { expiresIn: '1h' });
                    res.status(200).json({
                        token,
                        user: {
                            firstName, lastName, email, role, fullName
                        }
                    });
                } else {
                    return res.status(400).json({
                        message: 'Invalid Password !'
                    })
                }

            } else {
                return res.status(400).json({ message: 'something went wrong ' })
            }

        });

});

router.post('/admin/signout', requireSignin, (req, res) => {
    res.clearCookie('token');
    res.status(200).json({
        message: 'Signout Successfully ...!'
    })


});




module.exports = router;

auth.action.js code :

import axios from "../helpers/axios";
import { authConstants } from "./constants"

export const login = (user) => {

    console.log(user);


    return async (dispatch) => {

        dispatch({ type: authConstants.LOGIN_REQUEST });

        const res = await axios.post('/admin/signin', {
            ...user

        });

        if (res.status === 200) {
            const { token, user } = res.data;
           
            localStorage.setItem('token', token);
            localStorage.setItem('user', JSON.stringify(user));
            dispatch({
                type: authConstants.LOGIN_SUCCESS,
                payload: {
                    token, user
                }
            });
        } else {
            if (res.status === 400) {
                //dispatch error
                dispatch({
                    type: authConstants.LOGIN_FAILURE,
                    payload: { error: res.data.error }
                });
            }
        }

    }
}



export const isUserLoggedIn = () => {
    return async dispatch => {
        const token = localStorage.getItem('token');
        if (token) {

            const user = JSON.parse(localStorage.getItem('user'));
            dispatch({
                type: authConstants.LOGIN_SUCCESS,
                payload: {
                    token, user
                }
            });

        } else {

            dispatch({
                type: authConstants.LOGIN_FAILURE,
                payload: { error: 'Failed to login' }
            });

        }


    }
}


export const signout = () => {
    return async dispatch => {
        dispatch({ type: authConstants.LOGOUT_REQUEST });
        const res = await axios.post(`/admin/signout`);

        if (res.status === 200) {
            localStorage.clear();
            dispatch({ type: authConstants.LOGOUT_SUCCESS });

        } else {
            dispatch({
                type: authConstants.LOGOUT_FAILURE,
                payload: { error : res.data.error }
            });

        }




    }
}

mon App.js :

import React, { useEffect } from 'react';
import './App.css';
import { BrowserRouter as Router, Route, Switch } from 'react-router-dom'
import Home from './containers/Home';
import Products from './containers/Products';
import Orders from './containers/Orders';
import Signin from './containers/Signin';
import Signup from './containers/Signup';
import PrivateRoute from './components/HOC/PrivateRoute';
import { useDispatch, useSelector } from 'react-redux';
import { isUserLoggedIn } from  './actions';
import Category from './containers/Category';
function App() {

  const dispatch = useDispatch();
  const auth = useSelector(state => state.auth);
  //check if user authenticating or not and if the token exists in local stoorage or not
  useEffect(() => {
  

    if (!auth.authenticate) {
      dispatch(isUserLoggedIn);
    }

  }, []);



  return (
    <div className="App">
      <Router>
        <Switch>
          <PrivateRoute path="/" exact component={Home} />
          <PrivateRoute path="/category" component={Category} />
          <PrivateRoute path="/products" component={Products} />
          <PrivateRoute path="/orders"  component={Orders} />

          <Route path="/signin" component={Signin} />
          <Route path="/signup" component={Signup} />
        </Switch>
      </Router>

    </div>
  );
}

export default App;