I have a situation where I need to force a reload() on the server-side for a timer.
The issue we're encountering is the browser history stack allows users to navigate back and forth without hitting the server and we're losing the time spent on a tracked task. Kind of hacky, I know.
I thought something like this might be a start (it isn't working):
window.addEventListener('pageload', function () { console.log('Page loaded via back/for button'); });
The caveat, is I can only reload() when the browser back/forward functions were used. The URI will change constantly via the UI, in which case it already invokes a request to the server.
EDIT | I tried this as well (capture the back/next event and force a reload or AJAX request to server to capture context change)
(function($) {
window.addEventListener('popstate', function(event) {
console.log(event);
});
// Second solution...
window.addEventListener('popstate', function () {
console.log('URI changed');
});
const pushUrl = (href) => {
history.pushState({}, '', href);
window.dispatchEvent(new Event('popstate'));
};
})(jQuery);
Also not working, what am I missing?
Any ideas?