ホームページ >ウェブフロントエンド >H5 チュートリアル >Web 側アプリケーションはバック フォース リフレッシュを実装します

Web 側アプリケーションはバック フォース リフレッシュを実装します

php中世界最好的语言
php中世界最好的语言オリジナル
2018-03-27 15:44:432968ブラウズ

今回は、Web 側アプリケーションがバックと強制リフレッシュを実装するための注意事項を紹介します。以下は実際のケースです。見てみましょう。具体的なコードは次のとおりです:

<script>
  //生成uuid
  var uuidChars = "0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz".split("");
  function uuid() {
    var r;
    var uuid = [];
    uuid[8] = uuid[13] = uuid[18] = uuid[23] = "-";
    uuid[14] = "4";
    for (i = 0; i < 36; i++) {
      if (!uuid[i]) {
        r = 0 | Math.random() * 16;
        uuid[i] = uuidChars[(i == 19) ? (r & 0x3) | 0x8 : r];
      }
    }
    return uuid.join("");
  }
  // 兼容 android
  history.replaceState(null, null, "/currentURL?a="+uuid());
  // 兼容 ios
  $(function () { 
     var isPageHide = false; 
     window.addEventListener(&#39;pageshow&#39;, function () { 
      if (isPageHide) { 
       window.location.reload(); 
      } 
     }); 
     window.addEventListener(&#39;pagehide&#39;, function () { 
      isPageHide = true; 
     }); 
  })
</script>

•Android 側で使用される h5 の history オブジェクト は、ページが読み込まれた後に現在の URL を変更します (UUID または乱数を結合します)。そのため、ページに戻るたびに、現在の URL がブラウザのキャッシュに存在しない場合、ブラウザは再読み込みされます。 history.replaceState(null, null, "/currentURL?a="+uuid());•ただし、iOS側は上記の方法をサポートしていないため、jqueryコードを使用して解決しました。

この記事の事例を読んだ後、あなたはその方法をマスターしたと思います。さらに興味深い情報については、php 中国語 Web サイトの他の関連記事に注目してください。

推奨読書:

Vueレンダリングとプラグイン読み込みの操作順序

nodejsクローラーフレームワークスーパーエージェント

vueプロジェクトでueditorを使用する方法

以上がWeb 側アプリケーションはバック フォース リフレッシュを実装しますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。