Home  >  Article  >  Web Front-end  >  How to clear browser cache in angularJs

How to clear browser cache in angularJs

亚连
亚连Original
2018-06-23 17:31:471691browse

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">

Clear the temporary cache of the form

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

ajax clear cache

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

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

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; 
          } 
        } 
      })
<link rel="stylesheet" href="stylesheets/main.css?version=1.0.3" rel="external nofollow" >

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

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.

Related articles:

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!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn