Comment vider le cache du navigateur dans AngularJs-js tutoriel-php.cn

Comment vider le cache du navigateur dans AngularJs

亚连

Libérer： 2018-06-23 17:31:47

original

1751 Les gens l'ont consulté

Cet article présente principalement la méthode de vidage du cache du navigateur dans angulaireJs. L'éditeur pense que c'est plutôt bon, je vais donc le partager avec vous maintenant et le donner comme référence. Suivons l'éditeur et jetons un coup d'œil

Chapitre sur le cache

Un cache est un composant qui peut stocker des données de manière transparente afin de pouvoir répondre aux demandes plus rapidement à l'avenir. L'obtention répétée de ressources peut entraîner une duplication des données et prendre du temps. Par conséquent, la mise en cache convient à certaines données peu variables. Plus le cache peut traiter de requêtes, plus les performances globales du système peuvent être améliorées.

Cache du navigateur, nous en avons parfois besoin, car il peut améliorer les performances du site Web et la vitesse du navigateur, ainsi que les performances du site Web. Mais parfois, nous devons vider le cache, car le cache peut causer des problèmes et des données erronées peuvent apparaître. Par exemple, les sites Web boursiers sont mis à jour en temps réel. Ces sites Web n'ont pas besoin d'être mis en cache. Certains sites Web sont rarement mis à jour, il est donc préférable d'avoir un cache.

Ce qui suit est la méthode traditionnelle pour vider le navigateur

méthode méta

//不缓存 
<META HTTP-EQUIV="pragma" CONTENT="no-cache">  
<META HTTP-EQUIV="Cache-Control" CONTENT="no-cache, must-revalidate">  
<META HTTP-EQUIV="expires" CONTENT="0">

Copier après la connexion

Vider le cache temporaire du formulaire

<body onLoad="javascript:document.yourFormName.reset()">

Copier après la connexion

Ajax vider le cache

$.ajax({ 
   url:&#39;www.haorooms.com&#39;, 
   dataType:&#39;json&#39;, 
   data:{}, 
   cache:false,  
   ifModified :true , 
 
   success:function(response){ 
     //操作 
   } 
   async:false 
 });

Copier après la connexion

Utiliser des nombres aléatoires Les nombres aléatoires sont également un très bon moyen d'éviter la mise en cache !

Ajouter "?ran=" + Math.random(); //Bien sûr, le paramètre exécuté ici peut être choisi arbitrairement

Utiliser une heure aléatoire, la même qu'un nombre aléatoire.

Ajoutez "?timestamp=" + new Date().getTime(); après le paramètre URL ;

Utilisez le backend php pour nettoyer

Ajouter un en-tête("Cache-Control: no-cache, must-revalidate"); et ainsi de suite côté serveur (comme en php)

Ce qui suit est une introduction à la méthode de nettoyage du navigateur. dans le projet angulaireJs Bien sûr, ce qui précède est la méthode traditionnelle. La méthode est également applicable, mais pour angulaireJs, les éléments suivants doivent être ajoutés :

1. Vider le cache du modèle<. 🎜>

.run(function($rootScope, $templateCache) {  
      $rootScope.$on(&#39;$routeChangeStart&#39;, function(event, next, current) {  
        if (typeof(current) !== &#39;undefined&#39;){  
          $templateCache.remove(current.templateUrl);  
        }  
      });  
    });

Copier après la connexion

2. html Ajouter des paramètres aléatoires

.state("content", { 
        url: "/", 
        views:{ 
          "bodyInfo":{templateUrl: &#39;tpls/bodyInfo.html?&#39;+ +new Date(), 
            controller:&#39;bodyInfoCtrl&#39;}, 
          "header":{templateUrl: &#39;tpls/header.html?&#39;+ +new Date(), 
            controller:&#39;headerCtrl&#39; 
          }, 
          "footer":{templateUrl: &#39;tpls/footer.html?&#39;+ +new Date(), 
            controller:&#39;footerCtrl&#39; 
          } 
        } 
      })

Copier après la connexion

<link rel="stylesheet" href="stylesheets/main.css?version=1.0.3" rel="external nofollow" >

Copier après la connexion

3. 🎜>D'accord...c'est tout S'il existe d'autres méthodes, n'hésitez pas à nous donner des conseils !

.config([&#39;$stateProvider&#39;, &#39;$urlRouterProvider&#39;,&#39;$locationProvider&#39;,&#39;$httpProvider&#39;,function($stateProvider, $urlRouterProvider,$locationProvider,$httpProvider) { 
//     $urlRouterProvider.when("", "/home"); 
      $urlRouterProvider.otherwise(&#39;/&#39;); 
       if (!$httpProvider.defaults.headers.get) { 
       $httpProvider.defaults.headers.get = {}; 
      } 
      $httpProvider.defaults.headers.common["X-Requested-With"] = &#39;XMLHttpRequest&#39;; 
      $httpProvider.defaults.headers.get[&#39;Cache-Control&#39;] = &#39;no-cache&#39;; 
      $httpProvider.defaults.headers.get[&#39;Pragma&#39;] = &#39;no-cache&#39;;

Copier après la connexion

J'ai compilé ce qui précède pour vous, j'espère que cela vous sera utile à l'avenir.

Articles associés :

Comment implémenter des références circulaires entre les composants dans Vue.js

Il existe des exemples de composants asynchrones dans Vue

Comment résoudre l'erreur maximale de pile d'appels dans nodejs

Comment implémenter une plateforme de gestion de blog dans Vue+SpringBoot

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!