I am trying to realize booking system on my site. I want to allow user to book terminal entity for 10 minutes. Entirely, flow is enough big and goes over several pages.
While user navigate on this flow he should see how many time he has to complete operation.
Please advice me how to realize cross page timer.
I think the most straightforward way would be to create a cookie or an item in the user's localStorage which contains the start time of the transaction. Upon loading the page, you check for the existence of this value and compare it to the current time, if it exists.
You can use setTimeout or setInterval to run timers in the browser. However, a browser window is not guaranteed to continue to execute when it is not active. If the user hides the browser or goes to another application, the application cannot be sure that the timer is still running.
There is a newer specification for threading called web workers, which may help to alleviate the setTimeout problem.
https://developer.mozilla.org/en-US/docs/Web/API/Worker
As an alternative, I would suggest to store the start time on the server and continuously check the current time against it with polling HTTP requests. Or maybe just check it before they submit.
Or as stated by #sholanozie, store it in a browser cookie and just keep checking that.
Related
I want to measure the time spent by a user on web pages. It's doesn't include the time when a user navigates away from the browser.
I found few open source libraries like Timejs library which can measure the time spent by a user on a web page, but when a user is watching a Youtube video on the page, these libraries don't measure that time.
.
Is there a way to handle this case or any other library which handles this case?
Actually, these libraries fail to calculate the time spent by the user inside an iFrame.What is the best way to know when a user is active in an IFrame?
How does Google/AppNexus/Motomo calculate interaction time? Is there a common design/architecture that they follow?
PS: I am trying to integrate the library with my react App. If there exists any similar method to solve this problem in React. Please let me know in comments/answers.
Thanks in advance
HTML5 Page Visibility API is the answer of your question.
You need to just listen an event as per the browser and it will be triggered every time when user will jump to another tab.
Look to Page Visibility API
There is a good and security way to do it but you need webSocket implementation.
Make special socket client and server for this feature.
When you client is disconnected you can count that your user is not anymore on page. Implement timer's for time log on server part.
Page Visibility API look like solution for local calculation(unprotected). If you work with money or some kind of value's better use server for validation.
p.s.
If you have a buggy situation with timer ( on inactive tab ) then use HackerTimer library (combination with web workers).
Just start a timer when the user enters the page (lots of ways to do this) To pause and continue the timer, try using the onunload() and unload() events (they may not work exactly as you want it to, but it is the best thing I could find. Take a look at this to help you https://www.w3schools.com/jsref/event_onunload.aspHope this helps!
I have a ASP.net MVC project. i want to make a function in js that will execute only on the first load of this page in the current run of the program. In other words, if someone goes to a different page and comes back - i don't want it to happen again. but if i re-run the project from the beginning, i want it to happen.
i did my research - but everything i found - the ideas of Cookies and localstorage won't work for me, because they only work on the first load of the page of the user - so if we go out and rerun the project from the same computer, it won't work...
Anyone have an idea?
I am not sure you have clearly defined "first" "come back" and "current run." These are not straightfoward concepts in a web application, which from a logical perspective never starts nor stops, nor is there any concept of order of access unless you have specifically written a means of maintaining workflow state, which is not necessarily trivial.
If you want a script that will only run one time regardless how many times the page is accessed from any machine, you can set an application variable after it runs. On subsequent requests for the page, check for the application variable, and omit the Javascript if the variable is present. Note that the script will run again if the application resets for any reason, e.g. app pool recycle, which may be automatic depending on your web server settings.
If you want a script that will only run one time per browser instance, set a cookie after it runs. On subsequent requests for the page, check for the cookie, and if it is present, skip the execution of the script. Note that if a user has more than one browser, he will be able to get the script to run more than once, because most browsers do not share a cookie jar.
If you want a script that will only run one time per browser session (e.g. if you close and open the browser, the script should run again), set a session cookie after it runs. On subsequent requests for the page, check for the cookie, and if it is present, skip the execution of the script.
If you want a script that will only run one time per user, you will need some means of identifying the current user. So that means you need an authentication mechanism. In that case, only run the script if the user has just authenticated-- set a flag in the user database indicating the user has witnessed the execution of the script, and check it before rendering the script again.
You're partially there.
Set a cookie A on the server response with latest project start time.
If cookie B not already present, set cookie B on the client side with first load time and latest start time (from cookie A).
On the client side, on each load, check if cookie A == cookie b's latest start time. If not equal, run your function and update cookie B with latest start time.
Or like the comments said, just use a session and expire it when the project restarts.
How would I approach this.
My idea is to limit posting with a timer. So for example,
if a user posts a question, the user will have to wait 'X' ammount of time before the user can submit another question.
I am using Meteor as my framework. I am not asking for anyone to write up the code FOR me.
I am studying by myself, and I couldn't find any tutorials/tips on what I approach I should take to accomplish this.
Any references, or pointers would be greatly appreciated!! Thank you!!!
(As of now, I am using a Meteor Method to postInsert into the mogoDB)
In the browser, when the user posts a question, you can disable the controls for posting another question and then use setTimeout(fn, x) to set a timer for x milliseconds from now at which time your fn function can then re-enable the controls to allow them to post again. Ideally, you'd probably also provide some advice on screen about how much remaining time before they can post again.
To prevent a simple browser refresh from re-enabling the controls, you could also store the time when the next post is allowed in a cookie and read that cookie whenever the page is loaded to decide if the posting controls should be enbled or not.
But, since client protections are not entirely secure (they can be bypassed, sometimes even by just opening another browser), you may also want to record the time of last post in the user session on the server whenever a user posts. If a new request to post arrives, you can check the time of the last post and decide if enough time has elapsed to allow the post or not. This assumes you have some sort of user-identifying information which you can use to know when this user last posted. If not, you would need to add such information.
I am making an online quiz app having a timer which is implemented through JavaScript. If accidentally, the browser closes due to power failure, I intend to resume the timer from the time-point when the browser was closed. Right now, I am recording time only at the end of the quiz in a database using PHP/AJAX. How can I resume from the exact time when the user closed the browser?
The issue with a power failure is that you will not be notified in advance of the power going out so there is no opportunity to save state upon the power failure.
Thus, the only way to have any idea when the power went out is to be continuously saving state every N interval of time. Then, when the power goes out and is then restored, you can look at the last saved state. It won't be perfect, but will be the best you can do.
Your three options for saving state are:
Set a cookie every minute (or some period of time with the running count of time in it).
Save the same state to local storage (newer browsers).
Do a form of "auto-save" of the running time to your server with a regular ajax call (every few minutes).
The advantage of options 1 and 2 is that it's all client-side so saves are quick and don't load your server. The disadvantage of options 1 and 2 are that they could conceivably be manipulated by a client trying to game the system.
There's a small danger that even the local state in options 1 and 2 might not be saved properly in a power outage, but as best I know most browsers do persist this to disk when it's saved so that it's reliable even if the browser later crashes.
You can subscribe to the window unload event, but I'm not 100% sure this will be fired on a power failure shutdown.
Perhaps a better solution would be to poll the user during the course of the quiz by a setInterval which can fire off every 1000ms (or however frequently) and set/update a cookie.
I've got a site where users login and are connected to NowJS on all pages. I'd like to be able to keep track of their status (online/offline) in near-realtime, but I'm not sure the best way to do this. My initial thought was to just use the connect and disconnect events, but this won't work because those get fired each time the user goes to a new page (since the socket connection is closed while the new page loads).
I've got it somewhat working where I record a timestamp in the database entry for that user on the disconnect event, and then when the connect event fires I check if they've accessed the site within the last 30 seconds. If they haven't, I can assume they are starting a new session. On the disconnect event I use setTimeout to see if they are still online 30 seconds from now, and then set their status to offline if not.
While this mostly works, it seems somewhat hacky and has several edge case issues that could be problematic (not to mention the fact that your going to have a new timeout server-side on each page view). Is there a better way to do this that I'm just overlooking?
The right way to do this depends on more than just 'whether there is an open connection'. Are you trying to display to other users whether someone is around/available for chat/whatever? Then you might also consider an inactivity timeout on the page itself (to capture the times when people walk away from their computer without closing the page). If you're doing something else, like metering usage, you might want a different mechanism.
I think the solution here is extending the timeout option for Socket.IO (NowJS uses this internally) or use your hacky solution with setTimeout.
Honestly that seems the best solution considering users can move to another page quickly.
What I ended up doing was creating a global object that holds the persistent ID for the user (so in this case their ObjectId in MongoDB) as the key and the reference to the setTimeout as the value. I then do clearTimeout on a 'connect' event and delete the key from the object when they are considered offline.