指定日時でリダイレクト＆リロードしたい（日時によってはエラーが発生する）

Question

前提

JavascriptとjQeryを用いて、
指定した日時に自動的に別ページへ遷移する仕様のキャンペーンページを作成しています。
自動リダイレクトと、自動リロードのスクリプトを組み合わせて、リダイレクト先とタイミングを指定した上で、その時刻を跨ぐタイミングにページを見ていた人でも、自動的に指定日時にリロードがかかり、別ページへ遷移するようにしたく実装を進めていました。

以前は問題なく動いていたのにも関わらず、指定日時を変えることで挙動がおかしくなるエラーが発生しました。

発生している問題・エラーメッセージ

前回（3月ごろ）は特に問題なく動いていたのですが、
今回、指定日時を「2022年5月21日20時」にすると、なぜか
リロードが延々と繰り返されるようになってしまいました。

実現したいこと

ここに実現したいことを箇条書きで書いてください。

• 2022年5月21日20時に別の同ディレクトリ内ページへ自動的に遷移する
• その時刻を跨ぐタイミングでページを見ていた人でも強制的に別ページへ遷移するようにする

該当のソースコード

/*時限遷移管理*/
var now = new Date();
jQuery.each({
	// リダイレクト先 : (開始日時、終了日時)
	'./archive1.html':new Array('2022/5/21 20:00:00','2999/12/31 23:59:59'),
},function(rd,dt){
	if(new Date(dt[0]) <= now && now <= new Date(dt[1]))
		document.location.href = rd;
});

/*自動リロードするタイミング*/
window.onload = function()
{
var nowTime = new Date();
var targetTime = new Date("2022/5/21 20:00:00");

var refreshTime = targetTime.getTime() - nowTime.getTime();
 
if(refreshTime>0) {
    setTimeout(function(){location.reload(true)},refreshTime);
}
};

試したこと

以前、2022年3月6日17時で指定した時は問題なく動いていましたが、
今回、2022年5月21日20時にすることでリロードが繰り返されるエラーが発生しました。

そこで、どの日付ならOKもしくはNGなのか、2022年5月21日前後で検証してみました。

2022年5月10日20時：○
2022年5月11日20時：○
2022年5月12日20時：○
2022年5月13日20時：○
2022年5月14日20時：○
2022年5月15日20時：×
2022年5月16日20時：×
2022年5月17日20時：×
2022年5月18日20時：×
2022年5月19日20時：×
2022年5月20日20時：×
2022年5月21日20時：×

というように、なぜか2022年5月14日を境にエラーが起こる現象を確認しました。

補足：なぜか2022年6月9日20時以降は○になるようです

補足情報

自動リダイレクトと自動リロードは下記の記事を参考にしました。

Javascript/jQuery にて指定の日時でページを更新する
https://www.t3a.jp/blog/web-develop/javascript-time-refresh/

指定日時でリダイレクト
https://q.hatena.ne.jp/1265810141

以上、どなたか原因と解決策がわかる方がいらっしゃいましたら、ご教示のほど、よろしくお願いいたします。

「実現したいこと」の2つの条件が叶うなら、全く別の方法でも構いません。
よろしくお願いします。

Answer 1

https://html.spec.whatwg.org/multipage/webappapis.html#windoworworkerglobalscope

long setTimeout(TimerHandler handler, optional long timeout = 0, any... arguments);

setTimeout() の時間引数はWebIDL の long、つまり符号付き32ビット整数で、上限値は 2,147,483,647 です。さきほど 2022/5/21 20:00:00 に対して targetTime.getTime() - nowTime.getTime() を計算してみましたら、2,688,443,252 でした。おそらくオーバーフローして負の値が渡されているのでしょう。

refreshTime があまり大きいようだったら24時間後にリロード、とかするのはいかがでしょうか。

refreshTime = Math.min(refreshTime, 1000 * 60 * 60 * 24);

Comments

[kliz]

ご回答ありがとうございます！
こちらの知識が乏しく、一部理解が難しい箇所もございましたが、大枠のエラーの原因について把握いたしました。

誠にありがとうございます！

24時間後にリロードする以外（その時刻に一緒にリロードをかけること）
は難しいと思いますでしょうか…！？

お手数ですがご教示いただけますと幸いです。
よろしくお願いします！

[int32_t]

無駄なリロードが許容できないようでしたら、たとえば、
・ refreshTime が24時間より小さい場合、従来どおり refreshTime 後にリロード
・ 大きい場合、24時間後に window.onload に登録している関数を再実行する
こんな感じでリロードは回避できるでしょう。

[kliz]

ご回答ありがとうございます！
すみません、私の知識不足で理解が追いつかずでして…
お手数なのですが、教えてください…m(_ _)m

/*時限遷移管理*/
var now = new Date();
jQuery.each({
// リダイレクト先 : (開始日時、終了日時)
'./archive1.html':new Array('2022/5/21 20:00:00','2999/12/31 23:59:59'),
},function(rd,dt){
if(new Date(dt[0]) <= now && now <= new Date(dt[1]))
document.location.href = rd;
});

/*自動リロードするタイミング*/
window.onload = function()
{
var nowTime = new Date();
var targetTime = new Date("2022/5/21 20:00:00");

var refreshTime = Math.min(refreshTime, 1000 * 60 * 60 * 24);

if(refreshTime>0) {
setTimeout(function(){location.reload(true)},refreshTime);
}
};

上記コードでの挙動は

2022年5月21日20時にリダイレクト自体は行われる

リロードは、2022年5月22日20時に行われる
という意味になるのでしょうか？

それとも、アクセスしてから24時間後にリロードが行われる
という意味になりますでしょうか？

[int32_t]

> var refreshTime = Math.min(refreshTime, 1000 * 60 * 60 * 24);

変数 refreshTime を初期化するのに refreshTime を参照しているので意味不明なコードです

[kliz]

すみません、JSの基本的な知識がなく、書き方がわからないので、
完成形のコードをどのように書けばよいか、教えていただいてもよろしいでしょうか！？

お手数をおかけしますが、よろしくお願いします。