> 웹 프론트엔드 > JS 튜토리얼 > AngleJs에서 브라우저 캐시를 지우는 방법

AngleJs에서 브라우저 캐시를 지우는 방법

亚连
풀어 주다: 2018-06-23 17:31:47
원래의
1708명이 탐색했습니다.

이 글에서는 주로AngularJs에서 브라우저 캐시를 지우는 방법을 소개합니다. 편집자가 꽤 좋다고 생각해서 지금 공유하고 참고용으로 올려드리겠습니다. 편집기를 따라 살펴보겠습니다.

캐시 장

캐시는 데이터를 투명하게 저장하여 향후 요청을 더 빠르게 처리할 수 있는 구성 요소입니다. 반복적으로 리소스를 획득하면 데이터가 중복되어 시간이 소모될 수 있습니다. 따라서 캐싱은 변동성이 거의 없는 일부 데이터에 적합합니다. 캐시가 처리할 수 있는 요청이 많을수록 전체 시스템 성능이 더 많이 향상될 수 있습니다.

브라우저 캐시는 웹사이트 성능과 브라우저 속도를 향상하고 웹사이트 성능을 향상시킬 수 있기 때문에 가끔 필요할 때가 있습니다. 하지만 캐시로 인해 문제가 발생하고 일부 잘못된 데이터가 나타날 수 있으므로 캐시를 지워야 하는 경우도 있습니다. 예를 들어, 주식 웹사이트는 실시간으로 업데이트됩니다. 이러한 웹사이트는 캐시할 필요가 없습니다. 일부 웹사이트는 거의 업데이트되지 않으므로 캐시를 보유하는 것이 좋습니다.

다음은 브라우저를 지우는 전통적인 방법입니다

메타 방법

//不缓存 
<META HTTP-EQUIV="pragma" CONTENT="no-cache">  
<META HTTP-EQUIV="Cache-Control" CONTENT="no-cache, must-revalidate">  
<META HTTP-EQUIV="expires" CONTENT="0">
로그인 후 복사

양식의 임시 캐시를 정리합니다

<body onLoad="javascript:document.yourFormName.reset()">
로그인 후 복사

ajax 캐시 지우기

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

난수를 사용하세요. 난수도 역시 캐싱을 피하는 방법 아주 좋은 방법입니다!

Add "?ran=" + Math.random(); //물론 여기에서 실행되는 매개변수는 임의로 선택할 수 있습니다.

난수와 마찬가지로 임의의 시간을 사용합니다.

Add "?timestamp=" + new Date().getTime();

PHP 백엔드를 사용하여 정리

Add header("Cache-Control: no-cache, must -revalidate"); on (예: php)

다음은angularJs 프로젝트에서 브라우저를 지우는 방법을 소개합니다. 물론 위의 전통적인 방법도 적용 가능하지만,angularJs의 경우 다음 항목을 추가해야 합니다.

1 . 템플릿 캐시를 삭제하세요

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

2. 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. 경로 캐시를 삭제하세요

.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;;
로그인 후 복사

알겠습니다...그렇습니다

다른 방법이 있으면 알려주세요. 조언!

위 내용은 모두를 위해 제가 정리한 내용입니다. 앞으로 모든 사람에게 도움이 되기를 바랍니다.

관련 기사:

Vue.js의 구성 요소 간 순환 참조를 구현하는 방법

Vue에 비동기 구성 요소의 예가 있습니다

nodejs에서 초과된 최대 호출 스택 오류를 해결하는 방법

Vue+SpringBoot

에서 블로그 관리 플랫폼을 구현하는 방법

위 내용은 AngleJs에서 브라우저 캐시를 지우는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿