> 웹 프론트엔드 > 프런트엔드 Q&A > 브라우저 캐싱 정적 파일을 방지하는 방법

브라우저 캐싱 정적 파일을 방지하는 방법

青灯夜游
풀어 주다: 2018-12-25 13:05:01
원래의
5777명이 탐색했습니다.

브라우저가 정적 리소스를 캐싱하는 것을 방지하는 방법은 무엇입니까? 이 글은 브라우저가 정적 리소스를 캐싱하는 것을 방지하는 몇 가지 방법을 소개합니다. 이는 특정 참고 가치가 있으므로 도움이 필요한 친구에게 도움이 되기를 바랍니다.

브라우저 캐싱 정적 파일을 방지하는 방법

브라우저 캐시를 피해야 하는 이유는 무엇인가요?

작업 중 많은 시나리오에서는 브라우저 캐싱을 피해야 합니다. 예를 들어 CSS, js, 이미지 등을 변경하고 웹 페이지를 새로 고칠 때 이는 전혀 효과가 없습니다.

따라서 js나 css를 자주 변경해야 할 경우 브라우징과 캐싱을 방지해야 합니다.

브라우저 캐시가 정적 파일을 캐싱하는 것을 방지하는 방법은 무엇입니까?

이제 브라우저의 캐싱을 방지하는 방법을 소개하겠습니다.

1. 요청 시 캐싱을 비활성화하려면 요청 헤더를 설정하세요.

Cache-Control: no-cache, no-store, must-revalidate
로그인 후 복사

2 버전 번호를 높이세요. 요청한 리소스 번호에 버전을 추가합니다. 이는 일반적인 관행입니다. 예:

<link rel="stylesheet" type="text/css" href="../css/style.css?version=1.8.9"/>
<script type="text/javascript" src="../js/jquery.min.js?version=1.7.2" ></script>
로그인 후 복사

이것의 장점은 캐시해야 할 때 정적 파일을 실제로 캐시하고 로드 및 업데이트 시기를 자유롭게 제어할 수 있다는 것입니다. 최신 캐시 리소스.

3. HTML을 사용하여 캐싱 비활성화

HTML은 캐싱을 비활성화할 수도 있습니다. 즉, 페이지의 head 태그에 메타 태그를 추가할 수도 있습니다. 예:

<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate"/>
로그인 후 복사

참고: 캐싱을 비활성화할 수 있지만 일부 브라우저에서만 이를 지원하며 프록시는 HTML 문서를 구문 분석하지 않기 때문에 프록시 서버는 이 방법을 지원하지 않습니다.

4. 난수 사용

간단한 예를 들어 브라우저 캐싱을 방지하기 위해 난수를 사용하는 방법을 살펴보겠습니다.

// 方法一: 
document.write( " <script src=&#39;jquery.min.js?rnd= " + Math.random() + " &#39;></s " + " cript> " )
 
// 方法二: 
var  js = document.createElement( " script " )
js.src = " jquery.min.js " + Math.random()
document.body.appendChild(js)
로그인 후 복사

참고: 위의 예에서와 같이 난수를 사용하면 js 파일이 캐시되지 않습니다. 아무것도 변경되지 않은 경우에도 매번 서버에서 다시 로드해야 합니다.

요약

: 위 내용은 이 글의 전체 내용입니다. 모든 분들의 공부에 도움이 되었으면 좋겠습니다.

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

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