发表新帖
发表新帖

Force browser to clear cache

后端 未结
关注
17 2053
夕颜
夕颜 2020-11-22 05:04

Is there a way I can put some code on my page so when someone visits a site, it clears the browser cache, so they can view the changes?

Languages used: ASP.NET, VB.N

相关标签:
17条回答
  • 滥情空心
    2020-11-22 05:43

    Not as such. One method is to send the appropriate headers when delivering content to force the browser to reload:

    Making sure a web page is not cached, across all browsers.

    If your search for "cache header" or something similar here on SO, you'll find ASP.NET specific examples.

    Another, less clean but sometimes only way if you can't control the headers on server side, is adding a random GET parameter to the resource that is being called:

    myimage.gif?random=1923849839
    0 讨论(0)
  • 孤独总比滥情好
    2020-11-22 05:43 
    <meta http-equiv="pragma" content="no-cache" />

    Also see https://stackoverflow.com/questions/126772/how-to-force-a-web-browser-not-to-cache-images

    0 讨论(0)
  • 天涯浪人
    2020-11-22 05:43

    Force browsers to clear cache or reload correct data? I have tried most of the solutions described in stackoverflow, some work, but after a little while, it does cache eventually and display the previous loaded script or file. Is there another way that would clear the cache (css, js, etc) and actually work on all browsers?

    I found so far that specific resources can be reloaded individually if you change the date and time on your files on the server. "Clearing cache" is not as easy as it should be. Instead of clearing cache on my browsers, I realized that "touching" the server files cached will actually change the date and time of the source file cached on the server (Tested on Edge, Chrome and Firefox) and most browsers will automatically download the most current fresh copy of whats on your server (code, graphics any multimedia too). I suggest you just copy the most current scripts on the server and "do the touch thing" solution before your program runs, so it will change the date of all your problem files to a most current date and time, then it downloads a fresh copy to your browser:

    <?php
   touch('/www/sample/file1.css');
   touch('/www/sample/file2.js');
?>

    then ... the rest of your program...

    It took me some time to resolve this issue (as many browsers act differently to different commands, but they all check time of files and compare to your downloaded copy in your browser, if different date and time, will do the refresh), If you can't go the supposed right way, there is always another usable and better solution to it. Best Regards and happy camping. By the way touch(); or alternatives work in many programming languages inclusive in javascript bash sh php and you can include or call them in html.

    0 讨论(0)
  • 半阙折子戏
    2020-11-22 05:44

    I had similiar problem and this is how I solved it:

    1. In index.html file I've added manifest:

      <html manifest="cache.manifest">

    2. In <head> section included script updating the cache:

      <script type="text/javascript" src="update_cache.js"></script>

    3. In <body> section I've inserted onload function:

      <body onload="checkForUpdate()">

    4. In cache.manifest I've put all files I want to cache. It is important now that it works in my case (Apache) just by updating each time the "version" comment. It is also an option to name files with "?ver=001" or something at the end of name but it's not needed. Changing just # version 1.01 triggers cache update event.

      CACHE MANIFEST
# version 1.01
style.css
imgs/logo.png
#all other files

      It's important to include 1., 2. and 3. points only in index.html. Otherwise

      GET http://foo.bar/resource.ext net::ERR_FAILED

      occurs because every "child" file tries to cache the page while the page is already cached.

    5. In update_cache.js file I've put this code:

      function checkForUpdate()
{
    if (window.applicationCache != undefined && window.applicationCache != null)
    {
        window.applicationCache.addEventListener('updateready', updateApplication);
    }
}
function updateApplication(event)
{
    if (window.applicationCache.status != 4) return;
    window.applicationCache.removeEventListener('updateready', updateApplication);
    window.applicationCache.swapCache();
    window.location.reload();
}

    Now you just change files and in manifest you have to update version comment. Now visiting index.html page will update the cache.

    The parts of solution aren't mine but I've found them through internet and put together so that it works.

    0 讨论(0)
  • 名媛妹妹
    2020-11-22 05:45

    There is one trick that can be used.The trick is to append a parameter/string to the file name in the script tag and change it when you file changes.

    <script src="myfile.js?version=1.0.0"></script>

    The browser interprets the whole string as the file path even though what comes after the "?" are parameters. So wat happens now is that next time when you update your file just change the number in the script tag on your website (Example <script src="myfile.js?version=1.0.1"></script>) and each users browser will see the file has changed and grab a new copy.

    0 讨论(0)
  • 名媛妹妹
    2020-11-22 05:47

    I implemented this simple solution that works for me (not yet on production environment):

    function verificarNovaVersio() {
    var sVersio = localStorage['gcf_versio'+ location.pathname] || 'v00.0.0000';
    $.ajax({
        url: "./versio.txt"
        , dataType: 'text'
        , cache: false
        , contentType: false
        , processData: false
        , type: 'post'
     }).done(function(sVersioFitxer) {
        console.log('Versió App: '+ sVersioFitxer +', Versió Caché: '+ sVersio);
        if (sVersio < (sVersioFitxer || 'v00.0.0000')) {
            localStorage['gcf_versio'+ location.pathname] = sVersioFitxer;
            location.reload(true);
        }
    });
}

    I've a little file located where the html are:

    "versio.txt":

    v00.5.0014

    This function is called in all of my pages, so when loading it checks if the localStorage's version value is lower than the current version and does a 

    location.reload(true);

    ...to force reload from server instead from cache.

    (obviously, instead of localStorage you can use cookies or other persistent client storage)

    I opted for this solution for its simplicity, because only mantaining a single file "versio.txt" will force the full site to reload.

    The queryString method is hard to implement and is also cached (if you change from v1.1 to a previous version will load from cache, then it means that the cache is not flushed, keeping all previous versions at cache).

    I'm a little newbie and I'd apreciate your professional check & review to ensure my method is a good approach.

    Hope it helps.

    0 讨论(0)
 看不清?
提交回复
热议问题