Отображение времени на сайте с учётом часового пояса

10 September 2014, 03:17 MSK
Всем привет. Предлагаю довольно простой способ показать посетителю сайта время некоего события с учётом часового пояса посетителя. Способ используется во многих рабочих проектах уже несколько лет.
В качестве примера рассмотрим время создания этой заметки. По Москве — 10 сентября 2014, 03:17. При этом посетитель из Финляндии увидит время 02:17. Проверить это легко — достаточно перевести время на вашем компьютере на час назад.
К сожалению, без помощи джаваскрипта не обойтись — браузеры ничего не сообщают серверу о часовом поясе клиента. И так, в базе данных время этой заметки хранится в виде «2014-09-10 03:17:00» (время на сервере — московское, но это не имеет никакого значения). PHP-скрипт преобразовывает эту строку в таймштамп, а затем в следующий HTML-код:
<span class="fg-time" data-time="xxxxx" data-format="j F Y, H:i">
    9 September 2014, 23:17 GMT
</span>
Здесь xxxxx — это разница между текущим временем и таймштампом. j F Y, H:i — это формат, в котором выводится дата, а внутри тэга span — время по Гринвичу (выведено через PHP-функцию gmdate).
Далее при помощи следующего джаваскрипта (используется jQuery) проходимся по всем таким тэгам и выполняем преобразование:
$('.fg-time').each(function(){
     var time = $(this).data('time'),
          format = $(this).data('format');
     $(this).text(fgDate(format, time));
});
Исходный код функции fgDate, позволяющей красиво оформить дату и время (аналог PHP-функции date) можно скачать из моего github-репозитория.
Таким образом, суть метода заключается в том, чтобы на сервере посчитать разницу между временем события и текущим временем, передать эту разницу клиенту и при помощи джаваскрипта вывести время с учётом часового пояса клиента (для этого нужно вычесть переданную разницу от текущего времени).
Поделиться
Телеграмнуть
Вотсапнуть
Тэги: JSPHPwebdev