在Spring Web应用程序中使用计时器跟踪用户操作

Question

I am developing a management application in Spring Hibernate wherein I need to implement a timer system.

USE CASE

1. User clicks on an activity or an event on the UI(jsp). The timer starts, it displays the countdown on the UI. Only after the stipulated timer count is over the user can perform that event again.

2. I need to persist the time in the db because if the user closes the browser the timer count should continue in the server. Just like how we encounter in web based social media games.

I searched for a solution on the web but didn't come across anything. I tried Spring Scheduling but that didn't seem to solve the purpose plus it has a lot of limitations.

Can anyone suggest me any solution? Thanks

Answer 1

To answer this question, I'll assume the following:

1. On the back-end you have the ability to run asynchronous background jobs
2. A JavaScript timer on the front-end is sufficient to give a countdown (regardless of being slightly off with the background job

The basic idea is that you send off a date stamp to the server, start a countdown on the front-end, and any time there is an interaction to try the activity again, you ask the server (the same background task) if the time interval has completed.

The solution below is the beginnings, and is by no means a complete version of what it would take to manage such an interaction.

On the front-end you could imagine doing something like:

function restoreAndStartTimer(response, initialLoad){
   var secondsToCountDown = 10;
   //Here we can use the server response to tell us if there's already
   //a timer running
   if(response.timerRunning){
      secondsToCountDown = response.secondsRemaining;
   }
   //Now kickoff the front-end timer
   function countdown(){
      //Add code here to display stuff to the screen, etc
      if(secondsToCountDown !== 0){
         secondsToCountDown--;
         setTimeout(countdown, 1000);
      }
   };
   if(initialLoad){
      if(response.timerRunning) countdown();
   } else {
      countdown();
   }
};

//Click handler, assuming you use jQuery
$('#myActivityButton').on('click', function(){ 
   $.ajax({
      url: 'https://...',
      type: 'POST',
      //Grabs the time of the click and sends it off to the server
      data: { currentTime: new Date() },
      success: function(response){
         restoreAndStartTimer(response, false);
      }
   });
});

$(function(){
   //On document ready
   //This should be wrapped as a function to avoid repetition, but for the sake of
   //expediency using this editor...
   $.ajax({
      url: 'https://...',
      type: 'POST',
      data: { currentTime: new Date() },
      //If a user had reloaded the page while a timer was running, it will get picked
      //up here, otherwise it does nothing.
      success: function(response){
         restoreAndStartTimer(response, true);
      }
   });
});

As for the back-end, you would have some method that runs as a background thread. That thread would get the time from the initial time-stamp sent by the front-end and return any of the following responses depending on state:

1. response.timerRunning = true and response.secondsRemaining = #ofSeconds given that the time interval has not completed
2. response.timerRunning = false when the time interval is finally complete