Установите обратный отсчет до даты и времени с часовым поясом клиента - PullRequest
Новая
       108

Установите обратный отсчет до даты и времени с часовым поясом клиента

0 голосов
/ 14 ноября 2018 
var countDownDate = new Date("March 5, 2019 05:00:00").getTime();

var x = setInterval(function() {

    var now = new Date().getTime();
    var distance = countDownDate - now;
    var days = Math.floor(distance / (1000 * 60 * 60 * 24));
    var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
    var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
    var seconds = Math.floor((distance % (1000 * 60)) / 1000);
    document.getElementById("countdown").innerHTML = days + "d " + hours + "h " + minutes + "m " + seconds + "s ";
    if (distance < 0) {
        clearInterval(x);
        document.getElementById("countdown").innerHTML = "EXPIRED";
    }
}, 1000);

Date - это когда обратный отсчет заканчивается в московском часовом поясе, но я хочу, чтобы таймер обратного отсчета учитывал часовой пояс для других пользователей: так, если он заканчивается в 5:00 мск, то он должен заканчиваться в 10:00 по восточному времени дляпользователи в этом регионе и т. д.

1 Ответ

0 голосов
/ 15 ноября 2018

Суть проблемы сводится к вашей первой строке кода: 

var countDownDate = new Date("March 5, 2019 05:00:00").getTime();

Строка, передаваемая объекту Date, имеет нестандартный формат и не содержит никакой информации о смещении часового пояса, поэтому она всегда будет интерпретироваться в местном часовом поясе пользователя.

Если вы уверены, что знаете, что пользователь находится в UTC + 3 в эту дату в это время, то вы можете просто изменить свою входную строку на формат ISO 8601 со смещением часового пояса: 

var countDownDate = new Date("2019-03-05T05:00:00+03:00").getTime();

Однако здесь это работает только потому, что в настоящее время в Москве не наблюдается переход на летнее время. Это было в прошлом, хотя , а другие Русские время зоны имеют переключено смещений в недавно лет , поэтому жесткое кодирование смещения не обязательно является лучшим подходом. Это определенно не будет работать для часовых поясов, имеющих DST, если вы не определяете правильное смещение в коде на стороне сервера.

Если вам нужен подход, который будет работать правильно в любом часовом поясе, вам нужно будет использовать библиотеку , как описано здесь .

Например, используя расширение date-fns-tz до date-fns : 

zonedTimeToUtc("2019-03-05 05:00:00", "Europe/Moscow").getTime();

Или используя Luxon : 

DateTime.fromISO("2019-03-05T05:00:00", { zone: "Europe/Moscow" }).toMillis()
...