The user opens the site. starts a script that checks the timestamp in localStorage at a certain interval. If a certain amount of time has passed ( oldDate - currentDate > pullDelay ), then the script changes the timestamp to the current one.

 <!DOCTYPE html> <head></head> <body> <script> var pullDelay = 20000; setInterval(function () { var date = localStorage.date; if (date) { var currentDate = new Date(); var oldDate = new Date(date); var diff = currentDate.getTime() - oldDate.getTime(); if (diff < pullDelay) { console.log("Данные свежие"); } else { console.log("Данные устарели"); localStorage.date = currentDate; } console.log("oldDate:" + oldDate.getMinutes() + ":" + oldDate.getSeconds()); console.log("currentDate:" + currentDate.getMinutes() + ":" + currentDate.getSeconds()); } else { localStorage.date = new Date(); } }, pullDelay); </script> </body> </html> 

The following behavior was expected, open the first tab, the script sets the timestamp, and then each time writes that the data is outdated and changes the timestamp. And if you open the second tab (it is assumed that at the moment of opening the second tab, the data will be fresh), then the script will always output that the data is fresh.

Current behavior:

The first tab works as expected, but the second one only writes for the first time that the data is fresh, and then constantly writes that the data is out of date, and the time stamp always has the meaning that this tab sets. That is, when the first tab sets a new timestamp value, the second one does not see it and returns a value that it has previously set.

Logs:

1st tab:

 Данные устарели oldDate:49:29 currentDate:49:49 Данные устарели oldDate:49:49 currentDate:50:9 Данные устарели oldDate:50:9 currentDate:50:29 

2nd tab:

 Данные устарели oldDate:49:29 currentDate:49:53 Данные устарели oldDate:49:53 currentDate:50:13 Данные устарели oldDate:50:13 currentDate:50:33 
  • Work with events, forget about the intervals - etki
  • In fiddle, the code works as expected. - Regent

3 answers 3

LocalStorage has an onstorage event .

Example

    Code checked, works just as expected. The problem is somewhere else.

    localStorage is one of the means of tracking users in the internet. Therefore, some browser plugins or antiviruses may try to cut it. Try turning them off.

    Also, do not forget to check the basic things: on one domain are both tabs open - and are you using the incognito-or-how-he-there-called-in-your-browser mode.

    • So if localStorage was "stabbed out" or there was no interaction between tabs (incognito, domain, etc.), then in the second tab there would be no oldDate: 49: 29 . - Regent
    • IE browser, and compatibility with IE8 is necessary (I started it with the help of VIsual Studio, the domain was the same, most likely I didn't take into account something - flibustier

    In this article, on the example of VKontakte music, the solution of almost your case is considered.

    • Although the link can find the answer to the question, it is better to point out the most important thing here, and give the link as a source. If the page to which the link leads will be changed, the response link may become invalid. - From the queue of checks - Denis
    • By reference HUGE article - well, do not copy-paste it here? - M.Onyshchuk pm
    • If the link becomes inactive, your response will no longer be relevant. It is usually recommended to write the key points from the link, which will be the solution of the author's question. - Denis