[java/jsp] js 파일 안에서 아무리 소스를 수정해도 브라우저에 바로바로 반영이 안된다면?

저도 이것 때문에 많이 헤맸습니다.

아무리해도 js 파일에서 소스를 고쳐도 화면에서 반영이 되어 보이질 않더라구요.

html, jsp 파일은 오히려 바뀐 소스가 잘 반영되더라구요.

html, jsp 파일 안에서 코딩한 자바스크립트 소스도 잘 반영됩니다.

그런데, js 파일만은 반영이 안 되네요 ㅠ

2015/05/29 - [인터넷/컴퓨터/구글] - [구글] Google 크롬(chrome) 브라우저에서 캐시 무시하고 화면 불러오기 (강제 캐시 삭제 X)

이 방법도 안 먹히더라구요 ㅠ

그런데, 정말 생각보다 간단한 방법이 있더라구요.

System.currentTimeMillis()

자바의 현재시간을 표시해주는 내부함수를 이용하면 됩니다.

<script type="text/javascript" src="/scripts/amcharts/amcharts.js?v=<%=System.currentTimeMillis() %>"></script>
<script type="text/javascript" src="/scripts/amcharts/serial.js?v=<%=System.currentTimeMillis() %>"></script>
<script type="text/javascript" src="/scripts/contents/stats-util.js?v=<%=System.currentTimeMillis() %>"></script>
<script type="text/javascript" src="/scripts/contents/stats-selectbox.js?v=<%=System.currentTimeMillis() %>"></script>
<script type="text/javascript" src="/scripts/contents/stats-link-selectbox.js?v=<%=System.currentTimeMillis() %>"></script>
<script type="text/javascript" src="/scripts/contents/stats-table.js?v=<%=System.currentTimeMillis() %>"></script>
<script type="text/javascript" src="/scripts/contents/stats-search.js?v=<%=System.currentTimeMillis() %>"></script>
<script type="text/javascript" src="/scripts/contents/stats-layerpopup.js?v=<%=System.currentTimeMillis() %>"></script>
<script type="text/javascript" src="/scripts/contents/stats-widget.js?v=<%=System.currentTimeMillis() %>"></script>
<script type="text/javascript" src="/scripts/contents/stats-searchpopup.js?v=<%=System.currentTimeMillis() %>"></script>
<script type="text/javascript" src="/scripts/contents/searchbox-autocomplete.js?v=<%=System.currentTimeMillis() %>"></script>

이런식으로 js 파일을 링크하는 곳에 붙여보세요.

?v=<%=System.currentTimeMillis() %>

<script type="text/javascript" src="/scripts/amcharts/amcharts.js?v=1478868915880"></script>
<script type="text/javascript" src="/scripts/amcharts/serial.js?v=1478868915880"></script>
<script type="text/javascript" src="/scripts/contents/stats-util.js?v=1478868915880"></script>
<script type="text/javascript" src="/scripts/contents/stats-selectbox.js?v=1478868915880"></script>
<script type="text/javascript" src="/scripts/contents/stats-link-selectbox.js?v=1478868915880"></script>
<script type="text/javascript" src="/scripts/contents/stats-table.js?v=1478868915880"></script>
<script type="text/javascript" src="/scripts/contents/stats-search.js?v=1478868915880"></script>
<script type="text/javascript" src="/scripts/contents/stats-layerpopup.js?v=1478868915880"></script>
<script type="text/javascript" src="/scripts/contents/stats-widget.js?v=1478868915880"></script>
<script type="text/javascript" src="/scripts/contents/stats-searchpopup.js?v=1478868915880"></script>
<script type="text/javascript" src="/scripts/contents/searchbox-autocomplete.js?v=1478868915880"></script>

소스보기를 하면 이런식으로 보일텐데요.

현재시각은 계속해서 바뀌기 때문에 이 숫자가 바뀌면 브라우저가 js 파일을 저장했다가 보여주는 게 아니라 다시 호출해서 화면에 반영하기 때문에 바뀐 소스가 바로바로 화면에 나타나게 됩니다.

정말 프로그래밍 할때는 아주 유용합니다^^