184 votes

window.location.reload avec effacement du cache

Je veux recharger une page en utilisant JavaScript, mais je veux aussi vider le cache, de sorte que lors du rafraîchissement de la page, celle-ci dispose des dernières versions de tout ce qui se trouve sur le serveur.
Les autres navigateurs, sauf IE, ne reçoivent pas le dernier contenu.

Une solution pour IE9 ?

6 votes

Des choses horribles peuvent se produire lorsque les utilisateurs sont assis derrière des proxies. Pour être sûr que la page se recharge, il suffit d'ajouter une valeur aléatoire à votre url.

1 votes

window.location.href = window.location.href

0 votes

1)J'ai enregistré une page HTML avec une DIV - MainDIV avec de nombreuses DIVS à l'intérieur. 2) Lorsque j'assigne du HTML à cette DIV, comment puis-je effacer ce qui se trouve dans la DIV et assigner la valeur de la DIV sauvegardée ? 3) Avez-vous une idée sur la façon de résoudre ce problème ?

268voto

Christian Points 12142

reload() est censé accepter un argument qui lui indique de faire un rechargement complet, c'est-à-dire d'ignorer le cache :

location.reload(true);

Je ne peux pas me porter garant de sa fiabilité, vous devriez peut-être vous renseigner davantage.

0 votes

Cela fonctionne-t-il pour le navigateur Android webkit ?

0 votes

@prongs Je ne vois pas pourquoi ça ne pourrait pas. Bien sûr, je n'ai pas de webkit basé sur Android pour le tester...

29 votes

fonctionne dans IE et FF mais pas dans Chrome, Safari. Quelqu'un sait-il comment faire pour que cela fonctionne dans Chrome, Safari ?

80voto

Oscar Godson Points 6070

Vous pouvez le faire de plusieurs façons. Premièrement, il suffit d'ajouter cette balise méta à votre site Web. head :

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

Si vous voulez supprimer le document du cache, expires devrait permettre de le supprimer en définissant son paramètre content à l'attribut -1 comme ça :

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

http://www.metatags.org/meta_http_equiv_cache_control

De plus, IE devrait vous donner le dernier contenu de la page principale. Si vous rencontrez des problèmes avec des documents externes, comme les CSS et les JS, ajoutez un paramètre fictif à la fin de vos URL avec l'heure actuelle en millisecondes afin qu'elle ne soit jamais la même. De cette façon, IE, et les autres navigateurs, pourront toujours vous servir la dernière version. Voici un exemple :

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

MISE À JOUR 1

Après avoir lu les commentaires, j'ai compris que vous vouliez effacer le cache de façon programmatique et non pas à chaque fois. Ce que vous pourriez faire est d'avoir une fonction en JS comme :

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

Ensuite, en 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>

Ceci n'a pas été testé, mais devrait fonctionner. En gros, votre fonction JS, si elle est invoquée, recharge la page, mais ajoute un paramètre GET à la fin de l'URL. Votre site devrait alors avoir un code back-end qui recherche ce paramètre. S'il existe, il ajoute les métabalises et une variable de cache qui contient un horodatage et l'ajoute aux scripts et CSS avec lesquels vous avez des problèmes de cache.

MISE À JOUR 2

La balise méta n'efface pas le cache. au chargement de la page . Donc, techniquement, vous devriez exécuter la fonction eraseCache en JS, une fois la page chargée, vous devriez la charger à nouveau pour que les changements aient lieu. Vous devriez être en mesure de résoudre ce problème avec votre langage côté serveur. Vous pourriez exécuter le même effacerCache JS, mais au lieu d'ajouter les métabalises, vous devez ajouter les en-têtes HTTP Cache :

<?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 qu'il soit nécessaire de recharger la page, car elle efface le cache avant le chargement de la page et avant toute exécution.

6 votes

Corrigez-moi si je me trompe, mais la balise meta cache-control empêchera la mise en cache de la page en cours de chargement. Elle n'effacera pas le cache déjà enregistré dans le navigateur du client.

2 votes

De plus, l'ajout du temps en millisecondes à la fin de votre attribut src ne permettra jamais à ce fichier javascript d'être mis en cache... ce qui n'est pas conseillé. J'ai compris de la question que coure06 veut être capable de vider le cache du navigateur sur demande - et non pas assurer de façon permanente que le fichier ne sera jamais mis en cache. Peut-être qu'une solution combinée consiste à créer un lien vers la même page avec un paramètre GET inclus qui forcera l'inclusion de l'heure actuelle dans le javascript.

1 votes

Je vais continuer à ajouter des commentaires au fur et à mesure que je pense à de nouvelles choses apparemment. Ajouter les millisecondes au chemin du fichier en fonction de certains événements ne fonctionnerait pas aussi facilement qu'on l'imagine, car après que cela ait été fait une fois - le chemin du fichier ne peut jamais revenir à seulement myscript.js parce que le navigateur reviendrait simplement au fichier mis en cache.

11voto

yousef Points 487

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

 location.reload(true);

vous pouvez également utiliser

window.history.forward(1);

pour arrêter le bouton de retour du navigateur après que l'utilisateur se soit déconnecté de l'application.

0 votes

Où est-ce que ce location.reload(true); être placé dans les fichiers javascripts ?

0 votes

Oui, vous pouvez le placer dans n'importe quel fichier js.

0 votes

@FedericoCapaldo Il suffit de le placer dans la fonction qui est appelée lorsque vous voulez que la page de l'utilisateur soit rechargée.

8voto

Rodrigo Points 1

Dans mon cas, reload() ne fonctionne pas à cause du comportement des contrôles asp.net. Donc, pour résoudre ce problème, j'ai utilisé cette approche, bien que cela semble être un contournement.

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(/#.*$/, '');
};

5voto

Birke Points 11

J'ai écrit ce javascript script et l'ai inclus dans l'en-tête (avant tout chargement). Il semble fonctionner. Si la page a été chargée il y a plus d'une heure ou si la situation est indéfinie, il rechargera tout depuis le serveur. Le temps d'une heure = 3600000 millisecondes peut être modifié dans la ligne suivante : if(alter > 3600000)

Avec mes salutations, 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>

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X