허당 레몬도리

이번 글의 주제 캐싱입니다.

 

프로그램 소스 html, css, script 등을 변경해서 서버에 반영을 했는데.

특정 사람들에 한하여 반영된 소스가 안보일 경우가 있습니다.

보통 같은 파일명의 파일에 내부소스를 변경하거나 추가했을시 적용되지 않을것처럼 헝클어지거나, 어긋나 보이는 현상이기도 하지요.

 

 

가서 확인을 해보면 임시 인터넷 폴더에 해당 파일(캐싱)이 존재해서 인데요.

 

 

개발자 입장에서 쉽게 해결하는 방법

 

1. Ctrl + F5를 입력하라고 한다.

   - 입력할 경우 캐싱된 파일들을 날리고 새로 받습니다.

2. 인터넷 설정에서 임시인터넷 파일 설정을 웹 페이지를 열 때마다로 변경 한다.

 

이 두 가지는 정말 개발자 입장에서 처리한 것 이라서 사용자가 난 그리 못하겠다고 하면 답이 없습니다.

최초 유효방문자도 사이트가 하자가 있게 느껴지기 때문에 나름 고충아닌 고충입니다.

 

그래서 제가 찾아보고 테스트해본 해결 방법을 알려드리겠습니다.

 

 

1. html 파일(asp, jsp, php, asp.net 포함)

 

head 안에 meta tag를 입력해주시면 됩니다.

 

<meta http-equiv="pragma" content="no-cache"/>

<meta http-equiv="pragma" content="no-store"/>

<meta http-equiv="cache-control" content="no-cache"/>

<meta http-equiv="Expires" content="-1"/>

 

하지만 이 방법은 생각보다 잘 안될 때가 많습니다.(해결책 asp.net 기준 작성)

해결책은 Page_Load 안에 다음 코드 추가 해주시면 됩니다.

 

Response.AddHeader("pragma", "no-cache");

Response.AddHeader("pragma", "no-store");

Response.AddHeader("cache-control", "no-cache");

Response.AddHeader("Exipres", DateTime.Now.AddDays(-1).ToShortDateString());

 

※ 확인방법은 임시인터넷파일 폴더에 해당 파일명.html이 존재하는지 체크해보시면 됩니다.

 

2. css, script 파일

 

css나 script 파일은 파일 내부에 meta tag를 작성 할 수 없기 때문에 다른 방법으로 해결해주셔야 합니다.

(html 파일 내부에 존재하는 css, script는 상관없습니다.)

 

해결 방법으로는 파일의 파일명을 변경하면 되는데 그렇게 되면 파일은 계속 늘어나고 누군가 캐싱이 되어있을 경우 예전 파일을 호출을 할 수 도 있기 때문에 추천하는 방법은 아닙니다.

 

제가 추천 드리는 방법은 파일명 뒤에 파라 미터를 강제적으로 붙이는 방법입니다.

(파라 미터를 붙인다고 하여서 파일에 지장이 있지는 않습니다.)

파라 미터를 붙이게 되면 임시인터넷폴더에는 파라 미터까지 해서 한파일로 인식되기 때문에 원하는 파일을 불러올 수 있습니다.

 

<link rel="stylesheet" type="text/css" href="text.css?version=00000001" />

<script src="test.js?version=00000001" type="text/javascript"></script>

 

상단 코드 중에 빨간색으로 표시된 부분의 version 값들을 파일이 변경될 때마다 값을 변경하여주시면 됩니다.

 

 

Tip)

저렇게 하면 올릴 때마다 version 관리를 해줘야 하고 css, js파일이 속한 파일마다 찾아서 값을 변경해줘야 해서 번거롭습니다.

그래서 저는 이렇게 변경하였습니다.(Asp.Net 기준)

<link rel="stylesheet" type="text/css" href="text.css?version=<%=DateTime.Now.ToString("yyyyMMddHHmmss") %>" />

vserion값에 현재시간을 입력했습니다.

 

제 글이 도움이 되셨다면 덧글 한개 부탁 드리겠습니다.

출처 : http://nuricle.com/80176271486

profile

허당 레몬도리

@LemonDory

포스팅이 좋았다면 "좋아요❤️" 또는 "구독👍🏻" 해주세요!