Comment vider le cache du navigateur par programmation?

Je recherche un moyen de vider par programmation le cache du navigateur. Je fais cela parce que l'application met en cache des données confidentielles et j'aimerais les supprimer lorsque vous appuyez sur "se déconnecter". Cela se produirait via le serveur ou JavaScript. Bien sûr, l'utilisation du logiciel sur un ordinateur étranger / public est toujours déconseillée car il y a plus de dangers comme les enregistreurs de frappe que vous ne pouvez tout simplement pas vaincre au niveau du logiciel.

C'est possible, vous pouvez simplement utiliser jQuery pour remplacer la `` balise meta '' qui fait référence à l'état du cache par un gestionnaire / bouton d'événements, puis actualiser, facile,

$('.button').click(function() {
    $.ajax({
        url: "",
        context: document.body,
        success: function(s,x){

            $('html[manifest=saveappoffline.appcache]').attr('content', '');
                $(this).html(s);
        }
    }); 
});

REMARQUE: cette solution repose sur le cache d'application qui est implémenté dans le cadre de la spécification HTML 5. Il nécessite également une configuration de serveur pour configurer le manifeste App Cache. Il ne décrit pas une méthode par laquelle on peut effacer le cache du navigateur «traditionnel» via un code côté client ou serveur, ce qui est pratiquement impossible à faire.

Il n'y a aucun moyen qu'un navigateur vous laisse vider son cache. Ce serait un énorme problème de sécurité si cela était possible. Cela pourrait être très facilement abusé - la minute où un navigateur prend en charge une telle «fonctionnalité» sera la minute où je la désinstalle de mon ordinateur.

Ce que vous pouvez faire est de lui dire de ne pas mettre en cache votre page, en envoyant les en-têtes appropriés ou en utilisant ces balises meta:

<meta http-equiv='cache-control' content='no-cache'>
<meta http-equiv='expires' content='0'>
<meta http-equiv='pragma' content='no-cache'>

Vous pouvez également envisager de désactiver la saisie semi-automatique sur les champs de formulaire, même si j'ai bien peur qu'il existe un moyen standard de le faire ( voir cette question ).

Quoi qu'il en soit, je tiens à souligner que si vous travaillez avec des données sensibles, vous devez utiliser SSL. Si vous n'utilisez pas SSL, toute personne ayant accès au réseau peut détecter le trafic réseau et voir facilement ce que voit votre utilisateur.

En utilisant le protocole SSL permet également certains navigateurs n'utilisent la mise en cache , sauf si explicitement dit. Voir cette question .

utilisez html lui-même. Il y a une astuce qui peut être utilisée. L'astuce consiste à ajouter un paramètre / une chaîne au nom de fichier dans la balise de script et de le modifier lorsque vous modifiez le fichier.

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

Le navigateur interprète la chaîne entière comme le chemin du fichier même si ce qui vient après le "?" sont des paramètres. Donc, la prochaine fois que vous mettez à jour votre fichier, changez simplement le numéro dans la balise de script sur votre site Web (exemple <script src="myfile.js?version=1.0.1"></script>) et le navigateur de chaque utilisateur verra que le fichier a changé et en récupérera une nouvelle copie.

La meilleure idée est de créer un fichier js avec le nom + un hachage avec la version, si vous avez besoin de vider le cache, générez simplement de nouveaux fichiers avec un nouveau hachage, cela déclenchera le navigateur pour charger de nouveaux fichiers

Au départ, j'ai essayé diverses approches programmatiques dans mon html, JS pour vider le cache du navigateur. Rien ne fonctionne sur le dernier Chrome.

Enfin, je me suis retrouvé avec .htaccess:

<IfModule mod_headers.c>
    Header set Cache-Control "no-cache, no-store, must-revalidate"
    Header set Pragma "no-cache"
    Header set Expires 0
</IfModule>

Testé dans Chrome, Firefox, Opera

Référence: https://wp-mix.com/disable-caching-htaccess/

location.reload (vrai); rechargera durement la page actuelle, ignorant le cache.
Cache.delete () peut également être utilisé pour les nouveaux Chrome, Firefox et Opera.

Sur Chrome, vous devriez pouvoir le faire en utilisant l'extension d'analyse comparative. Vous devez démarrer votre chrome avec les commutateurs suivants:

./chrome --enable-benchmarking --enable-net-benchmarking 

Dans la console de Chrome, vous pouvez désormais effectuer les opérations suivantes:

chrome.benchmarking.clearCache();
chrome.benchmarking.clearHostResolverCache();
chrome.benchmarking.clearPredictorCache();
chrome.benchmarking.closeConnections();

Comme vous pouvez le voir à partir des commandes ci-dessus, cela efface non seulement le cache du navigateur, mais également le cache DNS et ferme les connexions réseau. Ils sont parfaits lorsque vous effectuez une analyse comparative du temps de chargement des pages. De toute évidence, vous n'avez pas à les utiliser tous s'ils ne sont pas nécessaires (par exemple, clearCache () devrait suffire si vous avez besoin de vider le cache uniquement et que vous ne vous souciez pas du cache DNS et des connexions).

Vous pouvez maintenant utiliser Cache.delete ()

Exemple:

let id = "your-cache-id";
// you can find the id by going to 
// application>storage>cache storage 
// (minus the page url at the end)
// in your chrome developer console 

caches.open(id)
.then(cache => cache.keys()
  .then(keys => {
    for (let key of keys) {
      cache.delete(key)
    }
  }));

Fonctionne sur Chrome 40+, Firefox 39+, Opera 27+ et Edge.

Imaginez que les .jsfichiers sont placés dans/my-site/some/path/ui/js/myfile.js

Donc, normalement, la balise de script ressemblerait à:

<script src="/my-site/some/path/ui/js/myfile.js"></script>

Maintenant changez cela en:

<script src="/my-site/some/path/ui-1111111111/js/myfile.js"></script>

Maintenant, bien sûr, cela ne fonctionnera pas. Pour que cela fonctionne, vous devez ajouter une ou quelques lignes à votre .htaccess La ligne importante est: (.htaccess entier en bas)

RewriteRule ^my-site\/(.*)\/ui\-([0-9]+)\/(.*) my-site/$1/ui/$3 [L]

Donc, cela supprime en quelque sorte le 1111111111du chemin et les liens vers le chemin correct.

Alors maintenant, si vous faites des changements, il vous suffit de changer le numéro 1111111111 pour que vous voulez. Et quelle que soit la manière dont vous incluez vos fichiers, vous pouvez définir ce nombre via un horodatage lorsque le fichier js a été modifié pour la dernière fois. Le cache fonctionnera donc normalement si le nombre ne change pas. S'il change, il servira le nouveau fichier (OUI TOUJOURS) parce que le navigateur obtient une nouvelle URL complète et croit simplement que ce fichier est si nouveau qu'il doit aller le chercher.

Vous pouvez l' utiliser pour CSS, faviconset ce que jamais gets mis en cache. Pour CSS, utilisez simplement comme ça

<link href="http://my-domain.com/my-site/some/path/ui-1492513798/css/page.css" type="text/css" rel="stylesheet">

Et cela fonctionnera! Simple à mettre à jour, simple à entretenir.

Le .htaccess complet promis

Si vous n'avez pas encore de .htaccess, c'est le minimum dont vous avez besoin:

<IfModule mod_rewrite.c>
    RewriteEngine On
    RewriteBase /

    RewriteRule ^my-site\/(.*)\/ui\-([0-9]+)\/(.*) my-site/$1/ui/$3 [L]
</IfModule>