블로그 스킨을 수정하다 보면 javascript 파일과 CSS 파일을 수정할 일이 많습니다.
하지만 브라우저 캐싱(웹 캐시) 때문에 파일을 수정해도 즉시 변경된 사항이 보이지 않는 경우가 많습니다.
예전에도 몇가지 캐시를 삭제하는 방법에 대해서 알려드린 적이 있습니다.
캐시 무시하고 페이지 로드하기
외부 JS파일과 CSS 파일을 수정하면 캐시를 삭제를 해줘야지
정상적으로 바뀌는 것을 확인 할 수 있습니다
Ctrl + ⇧Shift + Delete키를 눌러서
삭제를 하고 봐도.. 로고나 기타 이미지파일은 쉽게 변경되는데
js나 CSS파일은 방법을 해도 바로바로 변하지 않는게 보입니다.
아마 티스토리 서버의 캐시(?) 프록시 캐시(?) 때문인 것으로 보이는데
그럴경우에는 두가지 해결방법이 있습니다.
캐시_무시하고 새로고침
새로고침을 할 때 아예 캐쉬를 무시하고 하는 방법입니다.
윈도우의 경우 Ctrl + F5 누르면 됩니다. 익플,크롬,파이어폭스
맥OS의 경우 ⌘ Cmd + Shift + F5 누르면 됩니다. 크롬, 파이어폭스
사파리 브라우저는 Shift + 상단 메뉴의 '새로 고침' 누르면 됩니다.
서버의 캐시 무시하고 불러오기
action=purge를 사용하면 됩니다.
예) http://cocosoft.kr/387?action=purge
.
.
.
하지만
.
.
이런 방식은 수정하는 본인에게는 Ctrl + F5만 눌러서 쉽게 변경사항을 확인할 수 있지만
일반 방문자에게 일일히Ctrl + F5를 강요 할 수는 없습니다..
마냥 시간이 지나면 갱신되겠지 기다릴수는 없겠지요.
그래서 간단한 방법이 파일명 뒤에 버전정보 ?ver=1.0.0 를 쿼리스트링으로 붙여주는 방법을 사용했습니다.
쿼리스트링으로 URL 변경해 브라우징캐시 무시하기
<link rel="stylesheet" href="./images/reset.css">
<script src="./images/main.min.js"></script>
skin.html에 적혀있는 해당 코드를 아래와 같이 수정을 해주었습니다.
<link rel="stylesheet" href="./images/reset.css?ver=1.0.0">
<script src="./images/main.min.js?ver=1.0.0"></script>
이렇게 하면 스킨 꾸미기를 위해서 js 나 css파일을 수정하더라도 ver값만 변경을 해주면 새로운 URL을 갖게 되어
브라우징 캐시가 발생하지 않게 됩니다. 해당 변수값은 파일에는 영향을 주지 않고 새로운 주소를 받게 되는 것이죠.
파일명을 매번 바꿔주는 방식보다는 더쉽게 사용가능합니다.
브라우징 캐싱은 빠른 웹페이지 로드를 위해서 필요하다고는 생각하나
개발할 때는 많이 ㅠ_ㅠ 귀찮은 것은 사실입니다.
그래서 저는 꾸미기를 할때는 Ctrl + F5를 눌러서 변경 사항을 확인하고
코드 변경이 완료되면 ver 값을 변경해줘서 일반방문자들도 방문시 바로 적용이 될 수 있게 해주고 있습니다.
ver값을 현재 날짜로 해서 매번 바꿔지는 방법도 있는 것 같은데 따로 티스토리는 치환자가 없어서..
그렇게 하는 방법은 찾지 못했네요.
암튼 저는 빌드번호를 1.0.0 으로 메이저,준메이저,마이너 로 관리를 하고 있는데
그냥 ver=1 2 3 4 5 로 해도 상관없습니다.
꾸미기 많이 하시는 분들은 설정하면 매우 유용할 것 같습니다!!
