Django python + javascript обратный отсчет - время сбивается на 3 часа

Я относительно новичок и просто программист-любитель. В данный момент я пытаюсь работать над небольшим Django проектом, где я хочу установить дату и время в будущем через форму и после того, как пользователь нажмет кнопку "Отправить", на странице будет показан обратный отсчет времени от настоящего момента до установленной даты и времени.

Поэкспериментировав немного с модулем datetime, я столкнулся с неловкой проблемой. У меня есть два поля в форме: 1. дата и 2. время. С помощью timestamp = datetime.datetime.combine(date, time).strftime('%s') я объединяю эти две информации и получаю на выходе секунды. Затем я передаю timestamp в мой .js файл с помощью {{ timestamp|json_script:'timestamp'}}.

В javascript я делаю следующее:

function timer() {
    
    var now = new Date();
    console.log(now.getTimezoneOffset());

    const timezone = Intl.DateTimeFormat('en-GB', { dateStyle: 'full', timeStyle: 'long' }).format(now);

    const setTime = JSON.parse(document.getElementById('timestamp').textContent);

    var difference = setTime * 1000 - now.getTime();

    date = new Date(difference);
    datevalues = [
        date.getYear() - 70,
        date.getMonth(),
        date.getDate() - 1,
        date.getHours(),
        date.getMinutes(),
        date.getSeconds(),
    ];
    document.getElementById("clock").innerText = datevalues[0] + "years"
        + datevalues[1] + "months"
        + datevalues[2] + "days"
        + datevalues[3] + "hours"
        + datevalues[4] + "minutes"
        + datevalues[5] + "seconds"
        + setTime * 1000 + " ... "
        + now.getTime() + " ... "
        + difference

    let t = setTimeout(function () { timer() }, 1000);
}

Вот мой .HTML код:

<body>
  {% load static %}
  <html>
    <form method="post" enctype="multipart/form-data">
      {% csrf_token %} {{ form.as_p }}
      <button type="submit">Submit</button>
    </form>

    {% if inst %}

    <center><h3>Success</h3>
    <div id="clock"></div></center>

    {{ timestamp | json_script:'timestamp'}}

    <script src="{% static 'js/timer.js' %}"></script>
    {% endif %}
  </html>
</body>

Если теперь я устанавливаю setTime только 2 минуты в будущем, мой обратный отсчет показывает 4 часа, а difference - 3 часа.

Я понимаю, что существуют различия в часовых поясах и DST, но из того места, где я нахожусь, ничто не добавит 3 или 4 часа.

Прошу прощения, если это все слишком непрофессионально и просто непрофессиональное описание моей проблемы. Я был бы признателен сообществу за помощь, поскольку я пытаюсь стать лучше и понять все эти глубинные процессы.

Большое спасибо!

Я только что решил это!!!

Вот мой код .js

var countDownDate = JSON.parse(document.getElementById('timestamp').textContent);

var newDate = new Date(countDownDate * 1000);

// Get NOW
var now = new Date();

// Get Timezone offset from imported date
var tzDifference = newDate.getTimezoneOffset();

// calculate the new offset time
var offsetNewTime = new Date(newDate.getTime() + tzDifference * 60 * 1000)

var x = setInterval(function () {

    var now = new Date();
    
    // console.log(now.getTime());
    var difference = offsetNewTime - now;

    var days = Math.floor(difference / (1000 * 60 * 60 * 24));
    var hours = Math.floor((difference % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
    var minutes = Math.floor((difference % (1000 * 60 * 60)) / (1000 * 60));
    var seconds = Math.floor((difference % (1000 * 60)) / 1000);

    document.getElementById("clock").innerHTML = days + "d " + hours + "h "
        + minutes + "m " + seconds + "s ";

    if (difference < 0) {
        clearInterval(x);
        document.getElementById("clock").innerHTML = "<h1>EXPIRED!</h1>";
    }

}, 1000);

С помощью этого сообщения: добавить или вычесть разницу часовых поясов в javascript Date

Каким-то образом я получил два разных смещения времени от python и javascript. Поэтому я использовал getTimezoneOffset();, чтобы учесть это и добавить это смещение к импортированному datetime.

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

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

Вернуться на верх