프런트 엔드 인터페이스가 js 및 css 파일의 캐시를 자동으로 지우도록 만드는 방법
- php中世界最好的语言원래의
- 2018-01-16 09:41:0216197검색
웹 프로젝트 개발 과정에서 CSS, js 파일을 자주 참조하는데, 파일을 업데이트한 후 캐싱 문제가 자주 발생합니다. (코드는 분명히 변경되었으나 브라우저에서 접속하면 아무런 변화가 없습니다.) 다음 두 가지 해결 방법을 사용하세요.
1. 브라우저 캐시를 수동으로 삭제합니다.
2. 버전 번호를 추가합니다(예:layout.css?v=1).
개인적으로는 2번 방법이 더 빠르다고 생각합니다. 브라우저 캐시 응답을 삭제합니다. 하지만 매번 버전 번호를 변경하는 것은 귀찮기 때문에 버전 번호를 자동으로 추가하는 방법을 찾아야 합니다.
제가 수집한 방법은 다음과 같습니다.
방법 1: html에 버전 번호를 자동으로 추가할 수 있습니다. js를 통해
<script type="text/javascript">
document.write("<link rel='stylesheet' type='text/css' href='/css/layout.css?v="+new Date().getTime()+"'>");
</script>방법 2: jsp 페이지인 경우 java 코드를 사용하여 타임스탬프를 생성할 수 있습니다(jsp 페이지인 경우 방법 1을 사용할 수도 있지만 이 방법이 더 편리합니다)
<link rel="stylesheet" type="text/css" href="/css/layout.css?v=<%=System.currentTimeMillis() %>">
방법 3: node.js 자동 구성 등을 사용하는 등 다른 방법을 사용하여 버전 번호를 추가하세요.
ps : 캐시를 지우는 목적은 페이지를 온라인에 올릴 때 페이지 업데이트를 제때에 확인하는 것입니다. , 정식 환경에 배포하면 더 이상 변경되지 않습니다), 캐시된 페이지에 더 빠르게 액세스할 수 있으므로 버전 번호를 수정한 다음 업데이트가 필요할 때 고정된 버전 번호를 변경하는 것이 좋습니다.
이 사례를 읽으신 후 방법을 마스터하셨다고 생각합니다. 더 흥미로운 정보를 보려면 PHP 중국어 웹사이트의 다른 관련 기사를 주목하세요!
관련 읽기:
localStorage 및 sessionStorage 사용 방법
위 내용은 프런트 엔드 인터페이스가 js 및 css 파일의 캐시를 자동으로 지우도록 만드는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!