Whiteship's Note


스프링 WebContentGenerator로 자바스크립트 캐싱하기

모하니?/Coding : 2009. 7. 7. 18:41


http://static.springsource.org/spring/docs/3.0.x/javadoc-api/org/springframework/web/servlet/support/WebContentGenerator.html

링크를 보면, WebContentGenerator가 해주는 일을 대략 알 수 있습니다. HTTP cache 헤더를 제어할 수 있는 옵션들을 제공해 줍니다.

여러가지 속성들에 따라 HTTP cache-control 헤더 내용이 달라지는데, 그 중 중요한 녀석으로 cacheSeconds가 있습니다. 이 녀석은 기본 값이 -1로 되어 있고, 그 내용인 즉슨 cache 관련 헤더를 전혀 사용하지 않겠다는 것입니다.

캐시를 유지할 기간만 설정해주면 캐시 관련 헤더들이 다시 설정 되는데, 이 떄 설정되는 녀석들 중 하나가 HTTP 1.1에 추가된 cache-control이라는 헤더입니다.

스펙에서는 다음과 같이 정의하고 있습니다.
The Cache-Control general-header field is used to specify directives that MUST be obeyed by all caching mechanisms along the request/response chain.
요청/응답 체인과 관련된 모든 캐싱 매커니즘이 반드시 따라야 하는 지시를 설정한다고 요약해도 될 듯 합니다.

자바스크립트가 들어있는 어떤 페이지를 요청하면, 해당 자바스크립트 파일을 브라우저가 매번 읽어오는데, 그걸 좀 더 효율적으로 개선하기 위해, 자바스크립트를 어떤 url을 통해 가져오도록 src="js.do?name=base.js" 이런식으로 설정하고, 컨트롤러에서는 요청한 자바스크립트를 찾아서 response에 write해 줍니다. 이 때 캐시를 사용하도록 하는거죠.

컨트롤러는 WebContentGenerator를 상속 받은 AbstractController를 상속받는 클래스를 하나 만들고, 내용은 name이라는 매개변수의 값에 해당하는 File을 읽어와서, HttpServletResponse에 쭉~ write() 해주고, 컨텐츠 타입을 자바스크립트로 response.setContentType("application/javascript"); 이렇게 설정해줍니다. 그리고 WebContentGenerator를 가 제공해주는 setCacheSeconds로 캐시를 유지할 시간 설정을 해 줍니다.

파폭과 live HTTP 헤더 플러긴으로 확인해본 결과, 초기 한 번 만 js를 읽어오고 그 뒤 요청 부터는 js를 읽어오지 않았습니다.

문제 1. 컨트럴러에서 자바스크립트 파일을 읽어오는 부분이 녹녹치 않더군요. @_@.. 그래서 자바스크립트가 담겨있는 폴더를 컨트롤러에 설정해줘야 합니다. 개발 환경은 사람 마다 다를테고 배포 환경도 다를텐데.. 이 값을 안 쓰는 방법(상대 경로로 웹 루트에서 부터 js 파일을 찾아가면 좋을 텐데, 제 이클립스에서 돌려보니까 이클립스 루트 폴더부터 경로를 탐색하더군요. @_@)

문제 2. 자바스크립트를 요청하는 URL이 역시 개발 환경과 배포 환경 마다 다를텐데 이건 또 어떻게 해결해야 할지.. 고민입니다.

        <script language="JavaScript" src="http://localhost:8080/js.do?name=koma.js">
        </script>

이런 URL이 되버리는데.. 개발할 때는 이렇게 써도 돌아갈테지만, 배포하면?... @_@

일단 이 두 문제가 맘에 많이 걸리네요.


top

  1. Favicon of https://helols.tistory.com BlogIcon is윤군 2009.07.08 10:24 신고 PERM. MOD/DEL REPLY

    2번은 봄싹 스타일 처럼 이렇게 해도 될 것 같은디;; 안되려나? ;;
    <script language="JavaScript" src="<c:url value="/js.do?name=koma.js"/>">
    </script>

    그리고 1번은.. 절대 경로도 괜찮을 것 같은데요~ ;;;
    웹서버랑... was 랑 다른 서버가 다른 장비에 포팅 되어 있는경우를 보면..
    상대경로로는 js 파일을 참조 할 수 없으니까요..
    그렇지 않은 경우는 상대경로가 좋긴 하겠지만요 ~

    Favicon of https://whiteship.tistory.com BlogIcon 기선 2009.07.08 11:14 신고 PERM MOD/DEL

    캬캬 2번은 그렇게 했어.
    1번도 해결했어. 영원히~

Write a comment.


[파이어폭스 플러그인]Live HTTP headers

Good Tools : 2009. 7. 7. 11:56


https://addons.mozilla.org/en-US/firefox/addon/3829

HTTP 헤더 정보를 보여주는 창을 띄울 수 있습니다. 도구 -> Live HTTP headers를 클릭하면 되죠.
그런 다음 파폭 아무 탭에서 URL을 날리면 Headers 탭에서 HTTP 헤더 정보를 보여줍니다.


전 이제 이것과 스프링의 AbstarctController와 WebContentGenerator를 보면서 HTTP 공부를 해야 하고, js 파일들을 캐싱해서 보내주는 컨트롤러를 만들어야 합니다. 오늘 안에 꼭!!! 파이팅!

이것도 http://www.w3.org/Protocols/rfc2616/rfc2616-sec14.html

top

Write a comment.


HTTP ETag

TCP/IP/HTTP : 2009. 3. 11. 13:28


참조: http://en.wikipedia.org/wiki/HTTP_ETag

ETag는 HTTP 1.1 호환 웹 서버가 반환하는 응답 헤더로 리소스가 변경 됐는지 확인하는데 필요한 정보를 제공합니다. 캐싱 기능이 있는 애플리케이션(ex 브라우저)에서 유용하며, 이 태그를 참조하여 이전에 받았던 ETag와 동일하다면 불필요하게 리소스를 다운로드 하는 작업을 줄일 수 있겠습니다. ETag의 값은 파일 크기와 파일을 수정한 날짜를 기반으로 만들거나 체크섬을 이용한다는군요.

HTTP 헤더 목록에서 다음과 같은 예제를 볼 수 있었습니다.

ETag: 737060cd8c284d8af7ad3082f209582d

'TCP/IP > HTTP' 카테고리의 다른 글

HTTP ETag  (0) 2009.03.11
Content negotiation  (0) 2009.03.11
top

Write a comment.


Content negotiation

TCP/IP/HTTP : 2009. 3. 11. 12:41


참조: http://en.wikipedia.org/wiki/Content_negotiation

컨텐츠 네고는 사용자가 서버로 어떤 요청을 보낼 때 사용자가 어떤 응답 타입을 선호하는지에 대한 정보도 같이 전달하는 매커니즘입니다. 요청 보낼 때 Accept-Language, Accept-Charset, Accept-Encoding, Accept-Ranges, Accept헤더 정보에 선호하는 응답 관련 정보를 전달하면 됩니다. 서버에서는 이 응답 타입을 보고 해당 형태의 응답을 전달할 수 있습니다.

예1. 불어로 응답을 받고 싶을 때

Accept-Language: fr

예2. 불어와 영어를 모두 받을 수 있지만 불어를 더 선호하며, text/html 형태 응답을 가장 선호하고 모든 text와 image를 받을 수 있다.

Accept-Language: fr; q=1.0, en; q=0.5
Accept: text/html; q=1.0, text/*; q=0.8, image/gif; q=0.6, image/jpeg; q=0.6, image/*; q=0.5, */*; q=0.1

스프링 웹 플로우 레퍼런스 번역 중에 나온 단어인데 모르는 내용이라 정리해 둡니다.

'TCP/IP > HTTP' 카테고리의 다른 글

HTTP ETag  (0) 2009.03.11
Content negotiation  (0) 2009.03.11
top

Write a comment.