Нужен таймер обратного отсчета на js

379

08 июля 2017, 11:08

Сюда обратился, потому что в гугле не нашел толкового ответа. Там при запросе таймер js, черт ногу сломит! В общем, помогите найти или поделитесь своим таймером. Нужен таймер на JS, чтобы время задавалось в ручную: 30 минут, 1 день, 1 неделя и 1 месяц. (Таймер не должен начинаться заново после обновления страницы). После того как время вышло, нужно с помощью ajax отправить post запрос на указанный роут (laravel) что таймер закончился.

Answer 1

Я думаю можно сделать так. В сервере при загрузке страницы задать вот такой параметр js let session_timer = '<?php echo $_SESSION["session_timer"]; ?>';.

Когда все в первый раз в сервере задаем например <?php $_SESSION["session_timer"] = false; ?>.

if(!session_timer){ 
  let ajax_timer = 30*60; 
  //(пример 30минут) здесь расчет времени 
 
  let session_timer = Math.floor(new Date() / 1000) + ajax_timer; 
  //в это время должен происходить `ajax` запрос. 
   
  send_ajax_timer_to_server(); 
   
} 
 
function send_ajax_timer_to_server(){ 
    //здесь другой ajax запросом вы должны отправить таймер в сервер и там сахранить его в сессии. 
}

Потом в фронте когда задаешь время (30м, 1д и т.д.) если session_timer ровно false. Потом когда задали время или таймер из сессии уже установлен уже можно написать логику к примеру вот так.

Допустим мы задали время 30 минут и потом закрыли страницу, а потом открыли к примеру после 10 минут, сейчас мы должны рассчитать сколько времени прошло с момента установки времени.

let timeout_timer = Math.floor(new Date() / 1000) - session_timer; 
 
if(timeout_timer > 0){ 
  setTimeout(ajax_timer_func, timeout_timer*1000); 
} 
else{ 
  //когда открыли страницу позже то сразу запускаем функцию для ajax запроса 
  ajax_timer_func(); 
} 
 
function ajax_timer_func(){ 
  //здесь код вашего ajax запроса 
}

Я бы сделал так, если есть недостатки можете написать в комментариях.