How to clear browser cache in angularJs-JS Tutorial-php.cn

How to clear browser cache in angularJs

亚连

Release： 2018-06-23 17:31:47

Original

1707 people have browsed it

This article mainly introduces the method of clearing the browser cache in angularJs. The editor thinks it is quite good. Now I will share it with you and give it as a reference. Let’s follow the editor and take a look

Caching

A cache is a component that can store data transparently so that it can serve requests faster in the future. . Obtaining resources repeatedly may cause data duplication and consume time. Therefore, caching is suitable for some data with little variability. The more requests the cache can serve, the more the overall system performance can be improved.

Browser cache, sometimes we need it, because it can improve website performance and browser speed, and improve website performance. But sometimes we have to clear the cache, because the cache may cause problems and some erroneous data may appear. For example, stock websites are updated in real time. Such websites do not need to be cached. Some websites are rarely updated, so it is better to have cache.

The following is the traditional method of clearing the browser

meta method

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

Copy after login

Clear the temporary cache of the form

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

Copy after login

ajax clear cache

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

Copy after login

Use random numbers. Random numbers are also a very good way to avoid caching!

Add "?ran=" Math.random(); //Of course the parameter ran here can be chosen arbitrarily

Use random time, the same as random number.

Add "?timestamp=" new Date().getTime(); after the URL parameters

Use php backend to clean up

Add header("Cache-Control: no-cache, must-revalidate"); and so on on the server side (such as in php)

The following is an introduction to the method of clearing the browser in the angularJs project. Of course, the above traditional method is It is also applicable, but for angularJs, the following items need to be added:

1. Clear the template cache

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

Copy after login

2. Add random parameters to html

.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; 
          } 
        } 
      })

Copy after login

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

Copy after login

3. Clear the route cache

.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;;

Copy after login

Okay...that’s all

If there are other methods, please give me some advice !

The above is what I compiled for everyone. I hope it will be helpful to everyone in the future.

How to implement circular references between components in Vue.js

There are examples of asynchronous components in Vue

How to solve the maximum call stack error in nodejs

How to implement the blog management platform in Vue SpringBoot

The above is the detailed content of How to clear browser cache in angularJs. For more information, please follow other related articles on the PHP Chinese website!