Реализация 15-минутного тайм-аута при проблемах с реакцией

#reactjs

Вопрос:

Я реализую функцию сохранения в форме, которую я создаю в React. Когда пользователь нажимает сохранить в форме, я хочу, чтобы они вводили имя пользователя / пароль. В следующий раз, когда тот же пользователь попытается сохранить, если прошло менее 15 минут, я хочу, чтобы им не нужно было подписывать имя пользователя / пароль для сохранения. Если он превышает 15, я хочу, чтобы они снова прошли аутентификацию.

Я наткнулся на этот код в другом вопросе stackoverflow о таймаутах.

    calculateHours(date1 , expireTime){
            const dateOne = date1;
            const dateTwo = new Date();
            const dateOneObj = new Date(dateOne);
            const dateTwoObj = new Date(dateTwo);
            const hours = Math.abs(dateTwoObj - dateOneObj)/ 36e5;
            const minutes = hours/ 36e5;
            return expireTime > hours ? true : false
        }

Код для определения 15-минутного тайм-аута в настоящее время.

   if(this.calculateHours(localStore.time , 15)){
                            this.wrappedClickHandler()

Это для 15-минутного тайм-аута, но код действительно неаккуратный и уродливый, и мне было интересно, есть ли у кого-нибудь лучший способ реализовать это?

Ответ №1:

Если вы не используете библиотеку для обработки времени, получить лучший код не так просто: вы можете сделать несколько лучших имен, но операция аналогична:

 const isExpired = (startDate, minutes) => {
  startDate = startDate instanceof Date ? startDate : new Date(startDate)
  const diff = new Date() - new Date(startDate)
  const minutesDiff = Math.floor((diff/1000)/60);
  return minutesDiff >= minutes
}

1. Я подумал, что без дополнительных библиотек это может быть лучшим способом обработки функции тайм-аута. Но приведенный выше код — гораздо более чистый способ реализации. Большое вам спасибо за вашу помощь.

Ответ №2:

Вы можете использовать setTimeout . Функция будет выполнена через заданное время

 setTimeout(() => {

     ...your necessary code for requiring user to enter username amp; password...

}, 15 * 60 * 1000) // since time is to be written in milliseconds

Ответ №3:

Когда дело касается времени, я всегда использую epochMilli. new Date().getTime() тогда плюс 15 минут (15*60*1000 ) миллисекунды должны быть эпохальными, которые где-то хранятся (redux?) А затем вы используете функцию isExpired для проверки каждого нажатия пользователем кнопки сохранить.

 const isExpired = (epochExpiresAt) => epochExpiresAt > new Date().getTime()