프론트

[Javascript] js/css 파일 캐시 날리고 새로고침 기능 넣기

혜미 2022. 3. 25. 09:49
반응형

 

우리회사 같은 경우 실시간으로 데이터를 주고 받는 관제시스템이기때문에

페이지에 쌓이는 캐시로 인해 페이지로 로드가 느려지고

css나 js변경시 잘 이뤄지기가 어렵다, 그래서 그 css나 js파일에 version에 시간을 넣어서 자동으로 새로고침할 수 

있는 기능을 넣었다.

version=<%=sf.format(nowTime)%>"

실제 현장에서 css나js파일은 html파일이라 변경하고 바로 반영되는 걸 확인해야하는데 실제로 해보면 브라우저에 저장되어있던 캐시때문에 바로 반영되어 인터넷으로 확인해보기가 쉽지 않다는 것을 알 수 있다.

이런 팁을 사용하면 그러한 문제를 좀 방지 할 수 있다. 

또한, 

setInterval(function() {
typeTrans('A')
}, 600000);



	function typeTrans( didType ){ 
			$("#didType").val( didType );
			
			if( "A" == didType ){
				document.fm.target = "_self";
				document.fm.action = "/did/doMain.do";
				document.fm.submit();				
			}
		}

이런식으로 페이지 전체를 새로 고침해주는 함수를 만들었는데

이유는 실제로 f5버튼으로 새로고침하면 내가 셀렉트 조회했던 값이 아닌 우리가 기본 값으로 설정해두었던 시설의 값으로 

조회가 되는데,

저렇게 폼 서브밋으로 날리게 되면 현재 선택된 페이지의 셀렉트 값으로 조회가 되면서 새로고침하기 때문에

편법으로 함수를 만들어서 매 약 5분마다 실행할 수 있도록 한다. 

 

참조 : 

 

[Front] js/css 파일 캐시 방지 처리

웹사이트를 운영하다보면 jsp단에서 css또는 js파일을 수정하는 일이 종종 있는데, 파일을 수정 후 새로 배포를 해도 브라우저에서 js/css파일을 캐시로 저장하기 때문에 수정한 파일이 아닌 브라

yongdev91.tistory.com

 

반응형
BIG