[Javascript] タブレット端末などでWebブラウザを落としたかの判別処理

 2022年7月12日

最近色々とこねくり回していると,古いブラウザでは,タブレット端末が一度スリープ(や,別アプリに遷移)した場合,ダウンロードしていたデータに「保持されないことがある」ことが分かった。

そこで,スリープから復帰した際に,もう一度データを読み込めば良い。

その「スリープから復帰した際」かどうかを,いかにチェックすれば良いか。

そのためには,setInterval() をつかって,ブラウザ内部でカウントしている値にズレがないかどうかを確認すれば良い。

JavaScriptでスマホがスリープから回復した時にカウントアップ(ダウン)を調整する

上のページが参考になる。

自分の場合は,10msごとにチェックするタイマーがあるので,そこで,下のような関数を走らせることにした。

checkTimeout() {
    const Limit = 500; // 500ms
    const Now = Date.now();
    const Diff = Now - this.$TimeChecker; // $TimeChecker は setInterval で 10msごとに 10 加算される

    if (Diff > Limit) {
      // 500msec 以上のズレが生じた場合
      // ~~ ここでスリープからの復帰処理
    }
    // 比較する DateTime を更新
    this.$TimeChecker = Date.now();
}