CODEWITHSUNDEEP
javascriptjquerytimer
Shubham
Shubham

Reputation: 22317

How to have a timer which cannot be modified in javascript?

Basically, I am designing a quiz application with limited time. Use selects answer to a question and the next question loads using an Ajax request. All questions must be answered within a time frame of, say 2 minutes.

A clock ticks away to show how much time is left and as soon as it hits 0, results are shown. Now since the timer will be implemented using window.setTimeout(), it is possible that the value of timer variable be modified using an external bookmarklet or something like that. Anyway I can prevent this? I think this is implemented on file sharing sites like megaupload. Any forgery on the timer variable results in request for file being rejected.

Upvotes: 3

Views: 270

Answers (3)

ThinkingStiff
ThinkingStiff

Reputation: 65351

Have .setTimeout() call an AJAX method on your server to synch time. Don't rely on the client time. You could also store the start time on the server for a quiz, and then check the end time when the quiz is posted.

Upvotes: 1

RobG
RobG

Reputation: 147413

If the function runs as a immediately called function expression, then there are no global variables and nothing for a local script to subvert. Of course there's nothing to stop a user from reading your code and formulating a spoof, but anything to do with javascript is open to such attacks.

As others have said, use the server to validate requests based on the clock, do not rely on it to guarantee anything. Here's a simple count down that works from a start time so attempts to dealy execution won't work. There are no global variables to reset or modify either.

e.g.

(function (){

  // Place to write count down
  var el = document.getElementById('secondsLeft');
  var starttime,
      timeout,
      limit = 20; // Timelimit in seconds

  // Function to run about every second
  function nextTick() {
    var d = new Date();

    // Set start time the first time
    if (!starttime) starttime = d.getTime();

    var diff = d.getTime() - starttime;

    // Only run for period
    if (diff < (limit * 1000)) {
      el.innerHTML = limit - (diff/1000 | 0); 

    } else {

      // Time's up
      el.innerHTML = 0;
      clearTimeout(timeout);
    }
  }

  // Kick it off
  timeout = window.setInterval(nextTick, 1000);
}());

Upvotes: 1

lanisle
lanisle

Reputation: 21

You need to add a validation in your server side. When the client want to load the next question using an Ajax request, check whether deadline arrived.

The timer in client side js just a presention layer.

Upvotes: 1

Related Questions