자바 스프링과 JSP를 사용하는 환경에서 기존에 사용되던 자바스크립트를 수정하던 중, 문제가 발생했다.
기존에 사용하던 고객분께서 캐시데이터를 삭제하지 않으면, 변경된 자바스크립트가 반영되지 않는 문제였다.
관련해서 문제를 알아봤는데, 결과부터 말하자면 브라우저의 정적자원 캐싱 메커니즘이 문제라고한다.
브라우저는 매번 서버에서 용량이 큰 JS, CSS파일 등을 받아오면 속도가 느려지기 때문에, 한 번 받은 파일은 컴퓨 로컬 저장소에 저장하고 사용한다고 한다.
때문에, 파일명이 동일할경우 과거버전과 수정 후 버전을 브라우저에서 인식하지 못하는 문제가 발생한다.
해결방법은 생각보다도 간단하다.
자바스크립트를 호출할때, 자동으로 바뀔 수 있도록 인자값을 넣어주면 된다.
예시)
<script src="<c:url value='/js/test.js' />?v=${now}"></script> /* 날짜를 통해 버전명을 동적으로 부여하는 방법 */
<script src="<c:url value='/js/a1b2c3.test.js'"/></script> /* 빌드 도구(Webpack, Vite, Jenkins 등)를 사용하여 파일 이름에 해시코드를 섞는방법 */
그 밖에도 방법은 많으니 자유껏 사용하면 된다.
