1. ホーム
  2. Web プログラミング
  3. AJAX関連

Ajaxキャッシュ処理例解析

2022-01-15 22:37:19

この記事では、Ajaxがキャッシュを処理する例について説明します。参考のため、以下のように共有します。

キャッシュ

ブラウザは、1つのリクエストのためにサーバーから多くのcss、img、jsおよびその他の関連ファイルを取得する必要があり、各要求が一度に関連リソースファイルをロードする場合、帯域幅、サーバーリソースとユーザーの待ち時間の深刻な損失がある、ブラウザは最適化処理、そのcss、img、jsおよび他のファイルをローカルでキャッシュバックアップしておくために最初の成功した要求で、後続 各次の要求は大幅にユーザのアクセス速度を上げることができます自分自身で関連キャッシュリソース-ファイルを取得します。

css、img、jsなどの静的ファイルはキャッシュできるが、phpファイルなどの動的プログラムファイルはキャッシュできないし、キャッシュできたとしても、そのキャッシュ効果はいらない。

動的アプリケーションファイルのブラウザキャッシュを無効にする方法。

(1) 要求されたアドレスに乱数を設定する【推奨】。
/{br (2) 動的プログラム用のヘッダーヘッダーの設定

要求されたアドレスに乱数を設定し、キャッシュの影響を回避する。

<! --10-cache.html-->
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title></title>
    <script type="text/javascript">
      function f1(){
        var xhr = new XMLHttpRequest();
        xhr.open('get', '. /10.php?' + Math.random());//guarantee that the address is different for each request
        xhr.send(null);
      }
    </script>
  </head>
  <body>
    <h2> ajax initiates the server-side request (cache handling) </h2>
    <input type="button" value="trigger" onclick="f1()">
  </body>
</html>


10.php

<?php
$fp = fopen(". /10.txt", "a");//append way to open 10.txt file (file does not exist will be created automatically)
fwrite($fp,"java");//write content to the file
fclose($fp);//close the file
? >


動的プログラム用のヘッダーヘッダー情報を設定します。

10.php

<?php
//set the header header to disable the browser from caching the current page
header("Cache-Control:no-cache");
header("Pragma:no-cache");
header("Expirse:-1");
$fp = fopen(". /10.txt", "a");//append way to open 10.txt file (file does not exist will be automatically created)
fwrite($fp,"java");//write content to the file
fclose($fp);//close the file
? >


ajax関連のコンテンツについては、興味のある読者はこちらのトピックを参照してください。" jqueryにおけるAjaxの使用法まとめ 》、《その JavaScriptでのajax操作テクニックまとめ 》, 《 PHP+ajaxのTipsと応用例まとめ asp.net ajaxのスキルまとめトピック

この記事がajaxプログラミングのお役に立てれば幸いです。