web-dev-qa-db-fra.com

window.location.reload avec cache vide

Je souhaite recharger une page à l'aide de JavaScript, mais je souhaite également effacer le cache. Par conséquent, sur la page d'actualisation, la page contient les dernières versions de tout du serveur.
Les autres navigateurs, à l'exception de IE, n'obtiennent pas le dernier contenu.

Une solution pour IE9?

131
coure2011

reload() est supposé accepter un argument qui lui dit d'effectuer un rechargement forcé, c'est-à-dire en ignorant le cache:

location.reload(true);

Je ne peux pas garantir sa fiabilité, vous voudrez peut-être approfondir cette question.

204
Christian

Vous pouvez le faire de plusieurs manières. Premièrement, ajoutez simplement cette balise meta à votre head:

<meta http-equiv="Cache-control" content="no-cache">

Si vous souhaitez supprimer le document du cache, la balise méta expires doit fonctionner pour le supprimer en définissant son attribut content sur -1 comme suit:

<meta http-equiv="Expires" content="-1">

http://www.metatags.org/meta_http_equiv_cache_control

En outre, IE devrait vous fournir le dernier contenu de la page principale. Si vous rencontrez des problèmes avec des documents externes, tels que CSS et JS, ajoutez un paramètre factice à la fin de vos URL avec l'heure actuelle en millisecondes, afin que ce ne soit jamais la même chose. De cette façon, IE et les autres navigateurs vous vous serviront toujours de vous fournir la dernière version. Voici un exemple:

<script src="mysite.com/js/myscript.js?12345">

UPDATE 1

Après avoir lu les commentaires, je me rends compte que vous vouliez effacer le cache par programme et non à chaque fois. Ce que vous pourriez faire est d’avoir une fonction dans JS comme:

eraseCache(){
  window.location = window.location.href+'?eraseCache=true';
}

Ensuite, dans PHP disons, vous faites quelque chose comme ceci:

<head>
<?php
    if (isset($_GET['eraseCache'])) {
        echo '<meta http-equiv="Cache-control" content="no-cache">';
        echo '<meta http-equiv="Expires" content="-1">';
        $cache = '?' . time();
    }
?>
<!-- ... other head HTML -->
<script src="mysite.com/js/script.js<?= $cache ?>"
</head>

Ce n'est pas testé, mais devrait fonctionner. Fondamentalement, votre fonction JS, si elle est appelée, rechargera la page, mais ajoutera un paramètre GET à la fin de l'URL. Votre site aurait alors un code back-end qui recherche ce paramètre. S'il existe, il ajoute les balises méta et une variable de cache contenant un horodatage, puis les ajoute aux scripts et aux feuilles de style CSS avec lesquels vous rencontrez des problèmes de mise en cache.

UPDATE 2

La méta-tag n'effacera en effet pas le cache lors du chargement de la page . Donc, techniquement, vous devez exécuter la fonction eraseCache dans JS. Une fois la page chargée, vous devez le charger à nouveau pour que les modifications soient prises en compte. Vous devriez pouvoir résoudre ce problème avec votre langue côté serveur. Vous pouvez exécuter la même fonction JS eraseCache , mais au lieu d’ajouter les balises META, vous devez ajouter des en-têtes de cache HTTP:

<?php
    header("Cache-Control: no-cache, must-revalidate");
    header("Expires: Mon, 26 Jul 1997 05:00:00 GMT");
?>
<!-- Here you'd start your page... -->

Cette méthode fonctionne immédiatement sans nécessiter de rechargement de page car elle efface le cache avant le chargement de la page et également avant que quoi que ce soit ne soit exécuté.

54
Oscar Godson

j'ai eu ce problème et je l'ai résolu en utilisant javascript

 location.reload(true);

vous pouvez aussi utiliser

window.history.forward(1);

pour arrêter le bouton de retour du navigateur une fois que l'utilisateur s'est déconnecté de l'application.

8
yousef

Dans mon cas, reload () ne fonctionne pas car asp.net contrôle le comportement. Donc, pour résoudre ce problème, j’ai utilisé cette approche, bien que cela semble être une solution de rechange.

self.clear = function () {
    //location.reload(true); Doesn't work to IE neither Firefox;
    //also, hash tags must be removed or no postback will occur.
    window.location.href = window.location.href.replace(/#.*$/, '');
};
4
Rodrigo

J'ai écrit ce script javascript et l'inclus dans l'en-tête (avant que rien ne se charge). Cela semble fonctionner. Si la page a été chargée il y a plus d'une heure ou si la situation n'est pas définie, elle rechargera tout du serveur. Le temps d'une heure = 3600000 millisecondes peut être modifié dans la ligne suivante: if (alter> 3600000)

En ce qui concerne Birke

<script type="text/javascript">
//<![CDATA[
function zeit()
{
    if(document.cookie)
    {
        a = document.cookie;
        cookiewert = "";
        while(a.length > 0)
        {
            cookiename = a.substring(0,a.indexOf('='));
            if(cookiename == "zeitstempel")
            {
                cookiewert = a.substring(a.indexOf('=')+1,a.indexOf(';'));
                break;
            }
            a = a.substring(a.indexOf(cookiewert)+cookiewert.length+1,a.length);
        }
        if(cookiewert.length > 0)
        {
            alter = new Date().getTime() - cookiewert;

            if(alter > 3600000)
            {   
                document.cookie = "zeitstempel=" + new Date().getTime() + ";";
                location.reload(true);
            }
            else
            {
                return;
            }
        }
        else
        {
            document.cookie = "zeitstempel=" + new Date().getTime() + ";";
            location.reload(true);
        }
    }
    else
    {
        document.cookie = "zeitstempel=" + new Date().getTime() + ";";
        location.reload(true);
    }
}
zeit();
//]]>
</script>
4
Birke