Время SSR узлов J и React JS на сервере и клиенте не совпадает

Question

Я имею дело с Node js и React js Server Rendering. Я столкнулся с проблемой. Я экономлю время в формате ISO на MongoDB, поэтому мне нужно преобразовать его в обычный формат, и результат преобразования различен для сервера и клиента из-за разницы часового пояса сервера и часового пояса клиента (мне нужно MM/dd/YYYY HH: формат мм). Конечно, реакция бросает предупреждение об этом. Я использовал moment.js и toLocalString(). У вас, ребята, есть какие-то возможные решения для решения этой проблемы?

Большое вам спасибо, ребята.

Answer 1

As you said, the problem is due to the difference between the server's timezone and the client's timezone. One way to fix this is to render the ISO timestamp on the server and later replace it with local time on the client-side in componentDidMount().

React docs say that componentWillMount() is the only lifecycle method called on server rendering so it's safe to write timezone related logic in componentDidMount().

document.querySelectorAll('...').forEach(el => {
  const timestamp = Number(el.textContent)
  const timezoneOffset = new Date().getTimezoneOffset() * 60 * 1000 // milliseconds
  const localDate = new Date(timestamp - timezoneOffset)
  el.textContent = formattedDate(localDate, 'my-custom-format') // use custom formatting here
})