Closed4

date-fnsのformat関数を使用しているが、2月に1回ほど時間がずれているとの報告がある

けんけん

現状考えられる原因

  • ユーザーの地域やブラウザによる差異
  • date-fnsに渡しているDateオブジェクト
`${format(new Date(date), "yyyy年MM月dd日")} ${time} ~`
けんけん

地域による返り値の変更は無さそう

JavaScript の Date オブジェクトは、単一の瞬間の時刻をプラットフォームに依存しない形式で表します。
Date オブジェクトは協定世界時 (UTC) の 1970 年 1 月 1 日からの経過ミリ秒数を表す Number の値を含んでいます。
Date - MDN

ブラウザの種類やバージョンによって解釈が異なることがある

文字列を日付・時刻(Date型)に変換する場合、 ブラウザの種類やバージョンによって解釈が異なる場合があります。
例えば、次のコードはどちらも「2021年7月1日」を指定しています。
ですが時刻がスラッシュ区切りとハイフン区切りでは異なって解釈されています。

// スラッシュ区切り
console.log(new Date('2021/07/01'));
// 実行結果
Date Thu Jul 01 2021 00:00:00 GMT+0900 (日本標準時)

// ハイフン区切り
console.log(new Date('2021-07-01'));
// 実行結果
Date Thu Jul 01 2021 09:00:00 GMT+0900 (日本標準時)
けんけん

ハイフン区切りの日付のみを渡していた

// ハイフン区切り
${format(new Date('2021-07-01'), "yyyy年MM月dd日")}

上記の表示にて記載通りの差異を確認したため
以下のように修正を実施

// ハイフン区切り
${format(new Date('2021-07-01T00:00:00'), "yyyy年MM月dd日")}

これでしばらく様子を見てみようと思う。

けんけん

修正後にクライアントへ確認を取ると、表示が治ったとのこと。
やはり、原因はハイフン区切りの日付のみを渡していたことでした。

言語仕様や下調べが足りなかった点に反省しています。
問題解決を体系的に学べるプログラミングはやはり楽しいですね。

このスクラップは2022/03/29にクローズされました