[js/css] js파일, css파일, img파일 사용시 캐시 방지 팁

---

프로젝트 진행 중 css, js파일을 수정하게 되는 일이 많습니다.

 

이때 코드 수정을 완료하고, 화면을 확인할때, 브라우저가 수정하기 전 css/js파일을 캐싱하고 있으면,

 

코드를 아무리 수정해도 변경된 코드가 반영이 되지 않을때가 있다. 

 

이때 코드에는 문제가 없지만 화면에 적용이 안된 상황을 보고, 괜히 코드를 수정하는 불상사가 발생할 수 있습니다.

 

이를 방지하기 위한 방법이 여러가지가 있는데,

 

1. 수동으로 브라우저 캐시를 삭제한다.

 

2. 크롬 시크릿모드로 테스트 한다.

 

3. jsp파일에서 스크립트 사용시 뒤에 version이나 날짜를 붙여준다.

ex)  <script src="/js/testscript.js?version=1"></script>
        <script src="/js/testscript.js?date=20201005"></script>

 

해당 방법은 css, js, img파일 모두 동일하게 적용이 가능한 방법입니다.

 

개인적으로 혼자만 테스트를 진행하는 경우는 1, 2번 방법으로 하더라도 큰 상관이 없어보이는데,

 

여러 사람들이 같이 테스트하는 경우에는 3번 방법으로 진행하는게 깔끔하고 좋은방법인 것 같습니다.