자바스크립트 캐시 지우기

웹 사이트를 방문하면 브라우저가 페이지의 일부를 넘겨받아 컴퓨터의 하드 드라이브에 저장합니다. 브라우저는 종종 한 번의 방문으로 변경되지 않는 웹사이트 부분의 소위 “정적 자산"을 저장합니다.

오늘 포스팅에서는 자바스크립트에서 캐시를 지우는 방법을 알아보겠습니다.

JavaScript에서 캐시 지우기

브라우저는 모든 간단한 캐시를 저장하도록 설계되었습니다. 캐시 메모리는 웹 사이트가 더 빨리로드되는 주요 원인이기 때문입니다.

따라서 HTML의 특정 인코딩이 변경되지 않는 한 캐시를 영구적으로 지우는 직접적인 방법은 없습니다. 이를 수행하는 몇 가지 다른 방법이 있을 수 있지만 이 두 가지가 가장 간단하고 효과적입니다.

웹 브라우저는 모바일 애플리케이션처럼 캐시를 지우는 것을 허용하지 않습니다. 전체 클라이언트 브라우저 캐시를 지울 수는 없지만 HTML 코드 내의 meta 태그를 사용하여 캐싱 없이 웹 페이지를 로드하는 것은 여전히 ​​가능합니다.

이를 수행하는 유일한 방법은 브라우저가 캐시 메모리에 불과한 최근에 로드된 메모리를 기억하지 못한다는 코드를 변경하는 것입니다.

다음 두 가지 예에서는 캐시를 지우는 방법을 설명합니다. 다음 코드는 있는 그대로 실행할 수 없으며 출력이 없습니다.

출력을 보려면 기존 코드에 추가해야 합니다.

접근법 1

<meta http-equiv='cache-control' content='no-cache'>
<meta http-equiv='expires' content='0'>
<meta http-equiv='pragma' content='no-cache'>

HTML 코드의 이 부분을 추가하여 브라우저가 캐시 메모리를 기록하지 않도록 합니다.

접근법 2

script 태그 내의 파일 이름에 매개변수를 업로드합니다. 레코드를 교환할 때 교환하십시오.

이것이 문서의 이름이 되도록 하십시오. 이 페이지를 로드할 때마다 스크립트 버전을 교체합니다.

<script src = "oldFile.js?version = 0.1"></script>

다음에 이 페이지를 로드하면 다음과 같이 표시되어야 합니다.

<script src = "newfile.js?version = 0.2"></script>