JavaScript countdown sync with servertime - javascript

I need to develop a countdown, which synchronizes with the time on the server.
The job is pretty easy, I have a Form divided in 3 steps, the first step need to be filled and posted in 2 minutes, the last step in two hours.
I have to show the user the countdown but I also need to do this job on the server because we can't rely on the user's local time, we need to secure this countdown with the server time to prevent user's tricks. (we are on iis with asp.net webforms)
I also can't use a database to store time's information, I need to do this with session/cache variables (PM Orders)
any suggestions?

You can send your server time to client and get a difference in client time and server time and save this time difference, and also save the starting time stamp of timer.
You can verify this timer accuracy latter by hitting the server for server time and calculate new difference between client and server time, if it find any discrepancy, correct the timer.

Related

Stop Manipulation JS timer Client side

I am developing an quiz application which requires to calculate the exact time taken by user to give an answer for an question.
I can not implement timer for that on server side because of latency issues which may arise because for different users and their different network/service provider.
If I implement timer at client side , there are highly chances that user can edit and manipulate the time.
is there a way to create a secure timer at client side that user can not manipulate.
you can manage this storing a timestamp at the backend side when the user starts the quiz, then, with this timestamp, you can implement a client side timer, once the user finishes the quiz, the client sends an event to the backend and a "finish" timestamp is generated, so you can know how much time does the user took to answer the questionnaire by subtracting both timestamps.

Implement a timer for user logout after timeout in the frontend

I was wondering what the best way of implementing a timer in the frontend would be.
The idea is to notify the user after 13 minutes of inactivity (= not made a request to the backend) that he will be logged out in 2 minutes.
My first attempt was to just use a Timer which is executed every second (I am doing this with Flutter web but it shouldn't make a difference) and counts down from 15 minutes.
Then we tested this internally and noticed that the Browser somehow stops JavaScript execution if the user switches to a different tab for a long time or if the computer goes into stand by such that the timer stops.
We already have a session timeout after 15 minutes from the backend, this is just to make the user experience better.
How would this be correctly implemented?
For short, I think it's impossible for only using frontend
As you examine, the javascript code will be stop whenever switching tab or close tab, computer stands by. So that it will not be good to use a timeout or something like that.
I used an idea before but not implemented it yet because I switched to simpler idea with sessionStorage. But you could see and somehow success with it: when last request is made, created a cookie with expire time is 13 minutes. If next request is made, clear old cookie and add a new cookie with 13 minutes too. If the request will not made during 13 minutes, when cookie expire, fire a event to annouce to user. To listening cookie change, I think there are a lot solutions out there. But for me, this idea is not so good so I forgot it.
If you can use a nodejs backend, you could try to use Server Send Event - SSE. This will create one-way sending data. Therefore you can stream a chunk of data. And the frontend will listen that streaming and decide whether to annouce to user.

Auction site Timed out event

I am creating an auction site in which the auction has a particular end date/time.
I have a javascript timer displaying the remaining time to the user and when this countsdown it fires and event to update the back end mongodb database to say the auction has completed and it informs the winning user and fires a CLOSE function.
How would you recommend doing this for auctions that aren't physically open in a browser at the time so the Timer event never creates this CLOSE event.
I wouldn't recommend this approach at all. Once I was working on a website and I needed to implement auctions. The project was in php so I wrote a php script which checks all auction rows in the database and looks for those with the timeEnd >= current time and sets their status to closed(The auctions table had int column for the status).
Then I set that php script to run as a cron job once every hour. So now the server automatically runs this server side script every hours and checks for out-dated auctions. The interval depends on the business logic of the app. For this project the auctions could only end or start to the beginning of every hour. This approach is far better than using javascript code that triggers the server script. One reason is that you can't trust client side code. Hackers could potentially get access to that javascript file and easily modify it. You should never let your server code depend on your client side code.
However, note that my approach is not the most ideal because depending on how much auctions your db have, the server script will still need time to process it and might take from a few seconds to couple of minutes to execute it.
For example if you have some auction that ends at 10:00:00 and the server script start executing at 10:00:00 and it takes 40 seconds to execute, the users could potentially find a way to place bid on those auctions in the interval of that 40 seconds. Your client side code should only take care for resetting the interface right at 10:00:00 so that users are not able to place bids. However, you should also make sure that the server-side code that handles your POST requests for placing bids, should also check if the auction end time is in the past before proceeding. If it only checks the status of the auction (opened or closed) it might get auctions that are ended with their status set to opened. The reason is that the cron job might still be processing the auctions and changing their status.
Another similar approach is to create service that runs on operative system level (probably c or c++ app) that would run constantly in the background and do the checks.
The good thing with the first approach is that most of the hosting companies already offer setting up cron jobs. One example is Bluehost.
For setting up windows based "cron jobs" read additional info on this post
I hope this makes it more clear to you how to handle the auctions.

Using node.js and socket.io to broadcast every second

I am currently working on an auction script using node.js and socket.io.
The site will have 500-1000 logged in users viewing a single page during the auction. Only one item will be on sale at any one time, similar to a real auction held in an auction house.
I will be broadcasting a countdown timer to all of the signed in users from the server to the client. On the server side I will be using setInterval() of 1 second to countdown to the auction end time. Apart from this the only other message being sent across will be the current bid being passed from a single client to the server then broadcast to all.
Will this be a reliable way to do this? And will it be able to handle the usage on the server?
If not is there a way which would be better?
Thanks Shane
For timer value, keep updating your local timer per second on server side itself. Whenever any user comes in, give him this value and also total value of timer. Then client will start their own timers locally as per comment by dandavis, but keep some interval like 15 or 10 seconds on server side on which server will broadcast the current timer value so that client will sync accordingly.
In short, server will broadcast every after 10(n:you decide) seconds but it will be updating timer variable per second locally. Whenever client comes in, it will get total timer value and current timer value.
Rest functionality of broadcasting the current bid can be done in normal way.

AJAX time spent on a website

We do an online survey so we want to calculate the time spent. using javascript and php we have discovered the time spent is not 100% accurate.
The original script is sending server requests every 5 seconds and updates the time in the database.
I made a research and discovered setTimeOut and setInterval are not accurate at all. So what's the best way to do that?
I replaced the Ping function with another one that calculates the difference between previous packet timestamp and now(); however it's not accurate at all.
Please advice if there are any other solutions to the problem described.
Why don't you listen 'onunload' event of the document and send a single message in order to know when a user is leaving your page. Consider this; When a user starts filling your server you send a message and when he/she leaves your page, you send another one and measure the time between these messages in order to sum up the total time
I imagine most implementations of setTimeout and setInterval are set to wait at least the amount of time you specify. If you want accurate readings of how long the browser is open, use javascript's date functions to calculate it on the client side, then send to the server.
If you want to send requests to the server every 5 seconds, you can send the current time (using new Date().getTime()) in the request that is sent from client to server.
Save the time the 1st request was sent in the database. This is the time the user started the survey.
When each subsequent packet arrives, subtract the time the 1st request was send to get the total time the user has spent on the survey so far. When the user clicks the button to finish the the survey you could send a final request indicating the survey is complete.
You may also want to send requests on document blur and focus events. These events track when the user leaves and comes back to your page without closing the page down.

Categories