1

I created a little script to keep the PHP session active even if the user does not refresh the page.

Here is the Javascript I'm using via PHP to keep the session alive:

echo 'setInterval(function(){$.post(\'/refreshTheSession.php\');},90000);';

It works fine, but I've noticed that it will keep calling the refreshTheSession.php script even if the page is not in focus, which I don't want because it means someone can leave a tab open with that page and keep the session alive indefinitely even if they are on a different tab doing something else.

I only want the session to stay alive if the user is still actively on the page in question.

Is it possible to do that? If so, how can I modify my code above to do that?

ProgrammerGirl
  • 3,157
  • 7
  • 45
  • 82
  • 2
    Possible duplicate of https://stackoverflow.com/questions/3479734/javascript-jquery-test-if-window-has-focus – Constantin Groß Oct 27 '17 at 16:16
  • Also check out https://developer.mozilla.org/en-US/docs/Web/API/Page_Visibility_API – Constantin Groß Oct 27 '17 at 16:17
  • @Connum: That didn't really answer my question. I tried wrapping my Javascript in `if(document.hasFocus()){ }` and it did not work, it just kept calling the `refreshTheSession.php` script even if the page was not in focus. – ProgrammerGirl Oct 27 '17 at 23:49

1 Answers1

2

You don't tell me what "did not work" exactly, but the second link I commented, the Page Visibility API, will definitely do what you're asking for, as can be seen in this working example:

function isDocumentVisible() {
 return !(document.hidden || document.webkitHidden || document.msHidden);
}

// this is what you'd output via PHP:
setInterval(function(){
 if (isDocumentVisible()) {
   $.post('/refreshTheSession.php');}
  }
 , 90000);

// for the sake of demonstrating that this example is indeed working:
window.setInterval(function() {
console.log(isDocumentVisible() ? "document is visible, refresh session" : "document is not visible, don't refresh session");
}, 1000);

Update: Using document.setFocus(), it would look like this:

// this is what you'd output via PHP:
setInterval(function(){
 if (document.hasFocus()) {
   $.post('/refreshTheSession.php');}
  }
 , 90000);

// for the sake of demonstrating that this example is indeed working:
window.setInterval(function() {
console.log(document.hasFocus() ? "document has focus, refresh session" : "document does not have focus, don't refresh session");
}, 1000);
Click into and out of the result iframe to see the focus change.
Constantin Groß
  • 10,719
  • 4
  • 24
  • 50
  • The problem with your solution is that it accounts for visibility but not focus. So, for example, one can split the screen and have two browsers side by side and be active on the one that doesn't have my site while leaving the one that does visible next to it, and your solution would continue to refresh my site's session even though the user is active on a different site. Wouldn't something like `if(document.hasFocus()){$.post('/refreshTheSession.php');}` using a `setInterval` to call it be better in this case? (This is for a mobile site, so that would need to be taken into account.) – ProgrammerGirl Oct 29 '17 at 09:51
  • Updated my answer to use `document.hasFocus()` as an alternative as requested. – Constantin Groß Oct 29 '17 at 11:22