JSP에서 수정된 CSS, JS 파일 캐시 방지하기

안녕하세요 WONY입니다.

오늘은 JSP에서 CSS, JS 파일을 작성하고 서버에 업로드 후 작성한 JSP 페이지를 확인할 때 CSS, JS 파일이 캐시로 인해 적용이 바로 안될 때가 있는데 이를 방지하는 방법을 알아보도록 하겠습니다.

강력한 새로고침 [CTRL]+[SHIFT]+[R] 하는 방법도 있지만.

제가 알려드릴 방법은 CSS, JS 파일이 서버에 업로드된 시간을 가져와 실시간으로 캐시를 방지할 수 있는 방법입니다.

 

아래의 방법은 CSS만을 예로든 소스이며 JS 파일에도 똑같이 적용할 수 있습니다.

 

<%@ page import="java.io.*, java.util.*" %>
 
<%
	/* CSS/JS 파일 캐시 방지 */
	String styleCss = application.getRealPath("/css/style.css");
	File style = new File(styleCss);
	Date lastModifiedStyle = new Date(style.lastModified()); 
 
	SimpleDateFormat fmt = new SimpleDateFormat("yyyyMMddhhmmssSSS");
%>

<link rel="stylesheet" type="text/css" href="tyle.css?ver=<%=fmt.format(lastModifiedStyle)%>" />

 

실제 적용 후 웹에서 소스보기를 하면 아래와 같습니다.

 

<link rel="stylesheet" type="text/css" href="/css/style.css?ver=20180427122255000" />

 

위와 같은 방법을 적용하면 단순히 [F5], [CTRL] + [R]으로 캐시를 방지할 수 있고 언제 수정하였는지도 쉽게 알 수 있습니다.

 

이상 WONY 였습니다.