Постоянный счетчик независимо от обновления страницы.

У меня есть этот кусок jQuery, который в настоящее время увеличивает число за один раз каждые 5 секунд. Проблема у меня в том, что ее клиентская сторона, поэтому она сбрасывается каждый раз, когда вы обновляете страницу.

Вместо этого я бы хотел, чтобы счетчик продолжался, даже если вы отсутствуете на сайте, и независимо от того, сколько раз вы обновляете страницу, поэтому я подумал, что сценарий на стороне сервера, такой как PHP, лучше подходит для моего использования. Если нет, предложите другое.

Я установил рабочую скрипту того, что у меня есть в jQuery: http://jsfiddle.net/f354bzy5/

Каким будет PHP для воссоздания этого эффекта, который включает мои требования выше?

Вот JQuery, который я использую:

//Counter var counter = 22000000000; $(".count").html(counter); setInterval(function () { $(".count").html(counter); ++counter; }, 5000); 

Проверьте этот ДЕМО

 //Counter var counter=22000000000; if(typeof(localStorage.getItem('counts'))!='object') { counter=parseInt(localStorage.getItem('counts')); } setInterval(function () { $(".count").html(counter); ++counter; localStorage.setItem('counts',counter); }, 1000); 

Выделить на localStorage

localStorage – это реализация интерфейса хранения. Он хранит данные no expiration date и очищается только через JavaScript или очищает Browser Cache / Locally Stored Data – в отличие от срока действия cookie.

Вы можете хранить счетчик в cookie.

 document.cookie = counter. 

поэтому вы можете получить последнее значение из файла cookie, если пользователь обновит страницу.

Это сводится к двум простым выборам для вас. Просто выберите правильный, который лучше соответствует вашему требованию:

Выберите «Cookie» : если вы хотите, чтобы серверная сторона имела доступ к счетчику. Помните, что файлы cookie отправляются вместе с запросами по умолчанию.

Выберите «Локальное хранилище» . Если вы не хотите отправлять счетчик вместе с запросами каждый раз, вы должны пойти на локальное хранилище.

Вы можете сделать это с помощью localStorage . Вот как я это делаю. Вы можете настроить его, как вам нужно.

 //detecting support for localStorage. if (window.localStorage) { //counterValue already exists in localStorage? Let's use that or set to zero. var counterValue = localStorage.counterValue || 0; setInterval(function() { //increment the counter and store updated vale in localStorage as well. localStorage.counterValue = ++counterValue; //put it in your HTML if you might $(".count").html(counterValue); }, 5000); } 

Как насчет использования localStorage с некоторыми функциями утилиты? Имейте в виду, что это решение на стороне клиента, и item будет удален, когда пользователь удалит кеширование / локальные данные браузера и т. Д.

 function isLocalStorage() { try { return 'localStorage' in window && window['localStorage'] !== null; } catch(e) { return false; } } function setCounter(key, val) { localStorage.setItem(key, val); } function getCounter(key) { return parseInt(localStorage.getItem(key), 10); } (function() { var key = "myCounter"; var counter = isLocalStorage() && getCounter(key) || 1; var $placeholder = $(".count"); $placeholder.html(counter); setInterval(function () { counter++; $placeholder.html(counter); isLocalStorage() && setCounter(key, counter); }, 2000); }()); 

– Демо –