javascript - React user session automatic logout after one hour - Stack Overflow

I want to logout the session of the current user after one hour of his login as well as on click of a b

I want to logout the session of the current user after one hour of his login as well as on click of a button. I tried storing the current time stamp of the user as soon as he login using his auth-token. But got confused in achieving the proper result.

Here is the code :

Get from LocalStorage:

export default function setLocalData(key, value) 
{
    var responseStatus = false;

    switch (key) 
    {
        case 'currentUser':
            const currentDateTime = new Date();
            const updateDateTime = new Date();
            const expireDateTime = new Date(updateDateTime.setHours(updateDateTime.getHours() + 2));
            const currentTimestamp = Math.floor(currentDateTime.getTime() / 1000);
            const expireTimeStamp = Math.floor(expireDateTime.getTime() / 1000);

            const initialState = {
                isLogin: true,
                loginTime: currentTimestamp,
                expirationTime: expireTimeStamp,
                userInfo: value
            };
            localStorage.setItem(key, btoa(JSON.stringify(initialState)));

            responseStatus = true;

            break;

        default:
            responseStatus = false;

            break;
    }

    return responseStatus;
}

set to LocalStorage:

export default function getLocalData(key, type='all')
{
    var responseObject = null;

    try 
    {   
        if(localStorage.getItem(key))
        {   
            var response;

                response = JSON.parse(atob(localStorage.getItem(key)));

            switch (type) 
            {
                case 'all':
                    responseObject = (response) ? response : null;

                    break;

                default:
                    responseObject = null;

                    break;
            }
        }
    } 
    catch (e) 
    {
        responseObject = null;
    }

    return responseObject;
}

This is my ponent file where the automatic logout function needs to trigger:

class DefaultLayout extends Component {

  ponentDidMount(){
    let token = LocalData.getLocalData('currentUser');
    console.log(token);

    setTimeout(()=> {
      this.signOut();
    }, token.expirationTime);
  }


  //this is triggered on clicking on logout() button
  signOut(e) {
    e.preventDefault();
    localStorage.clear();
    this.props.history.push('/login')
  }

  render() {
    //console.log(this.props)
    return ( ......
          ......
  }
}

On console.log(token), the result achieved is:

{
   expirationTime: 1575286437
   isLogin: true
   loginTime: 1575279237
   userInfo: "eyJhbGciOiJIUz11NiIsInR5cCI6IkpXVCJ9.....
}

I am not sure if am implementing this correctly. Kindly help to figure this out.

I want to logout the session of the current user after one hour of his login as well as on click of a button. I tried storing the current time stamp of the user as soon as he login using his auth-token. But got confused in achieving the proper result.

Here is the code :

Get from LocalStorage:

export default function setLocalData(key, value) 
{
    var responseStatus = false;

    switch (key) 
    {
        case 'currentUser':
            const currentDateTime = new Date();
            const updateDateTime = new Date();
            const expireDateTime = new Date(updateDateTime.setHours(updateDateTime.getHours() + 2));
            const currentTimestamp = Math.floor(currentDateTime.getTime() / 1000);
            const expireTimeStamp = Math.floor(expireDateTime.getTime() / 1000);

            const initialState = {
                isLogin: true,
                loginTime: currentTimestamp,
                expirationTime: expireTimeStamp,
                userInfo: value
            };
            localStorage.setItem(key, btoa(JSON.stringify(initialState)));

            responseStatus = true;

            break;

        default:
            responseStatus = false;

            break;
    }

    return responseStatus;
}

set to LocalStorage:

export default function getLocalData(key, type='all')
{
    var responseObject = null;

    try 
    {   
        if(localStorage.getItem(key))
        {   
            var response;

                response = JSON.parse(atob(localStorage.getItem(key)));

            switch (type) 
            {
                case 'all':
                    responseObject = (response) ? response : null;

                    break;

                default:
                    responseObject = null;

                    break;
            }
        }
    } 
    catch (e) 
    {
        responseObject = null;
    }

    return responseObject;
}

This is my ponent file where the automatic logout function needs to trigger:

class DefaultLayout extends Component {

  ponentDidMount(){
    let token = LocalData.getLocalData('currentUser');
    console.log(token);

    setTimeout(()=> {
      this.signOut();
    }, token.expirationTime);
  }


  //this is triggered on clicking on logout() button
  signOut(e) {
    e.preventDefault();
    localStorage.clear();
    this.props.history.push('/login')
  }

  render() {
    //console.log(this.props)
    return ( ......
          ......
  }
}

On console.log(token), the result achieved is:

{
   expirationTime: 1575286437
   isLogin: true
   loginTime: 1575279237
   userInfo: "eyJhbGciOiJIUz11NiIsInR5cCI6IkpXVCJ9.....
}

I am not sure if am implementing this correctly. Kindly help to figure this out.

Share Improve this question asked Dec 2, 2019 at 9:46 program_bumble_beeprogram_bumble_bee 3053 gold badges30 silver badges69 bronze badges 2
  • Use a JWT as the authentication token and set its expiry to +1 hour from the time you create it. The user will be logged out when trying to use the token after it expires – JMadelaine Commented Dec 2, 2019 at 9:49
  • Can you help explain using some example code? – program_bumble_bee Commented Dec 2, 2019 at 9:52
Add a ment  | 

2 Answers 2

Reset to default 4

I think the problem is here

setTimeout(()=> {
      this.signOut();
    }, token.expirationTime);

You are setting the timeout value to the expiration time. It should be an interval in milliseconds. So if you want the function to be triggered after 1 hr then the value should be 60 * 60 * 1000 or some calculation based on the expiration time stamp.

Look at this

class DefaultLayout extends Component {

  ponentDidMount(){
    let token = LocalData.getLocalData('currentUser');
    console.log(token);
    if(token.expirationTime>==token.loginTime){
       this.signOut();
    }    
  }


  //this is triggered on clicking on logout() button
  signOut() {    
    localStorage.clear();
    this.props.history.push('/login')
  }

  render() {
    //console.log(this.props)
    return ( ......
          ......
  }
}

发布者:admin,转转请注明出处:http://www.yc00.com/questions/1744177831a4561837.html

相关推荐

发表回复

评论列表(0条)

  • 暂无评论

联系我们

400-800-8888

在线咨询: QQ交谈

邮件:admin@example.com

工作时间:周一至周五,9:30-18:30,节假日休息

关注微信