JavaScript È°¿ëÆÁ
2008.11.26 / 16:54

ServletÀ» È°¿ëÇÑ JavaScript Caching

Å×½ºÅÍ
Ãßõ ¼ö 231

ServletÀ» È°¿ëÇÑ JavaScript Caching

Á¤ÀûÀÎ HTMLÀ̳ª À̹ÌÁö ÆÄÀÏÀÇ °æ¿ì º°µµÀÇ ¼³Á¤ÀÌ ¾ø¾îµµ À¥¼­¹ö¿¡¼­ ÀÚµ¿À¸·Î ÇØ´çµÇ´Â ÆÄÀÏÀÇ Ä³½Ì Á¤º¸¸¦ °ü¸®ÇÑ´Ù. ÇÏÁö¸¸ JSP³ª Servlet°ú °°Àº µ¿ÀûÀÎ ÆÄÀÏÀ» ij½ÌÇϱâ À§Çؼ­´Â ¿©·¯°¡Áö »çÇ×À» °í·ÁÇؾßÇÑ´Ù. À̹ø¿¡´Â JavaScriptÆÄÀÏÀ» ServletÀ» ÀÌ¿ëÇؼ­ ¾ÐÃàÇÏ¿© Àü¼ÛÇÏ´Â °æ¿ì¿¡ ij½Ì ¼º´ÉÀ» Çâ»ó ½ÃÅ°´Â ¹æ¾ÈÀ» ¾Ë¾Æº¸°Ú´Ù.

À̹ø ¹æ¾È¿¡ ´ëÇÑ ÀÌÇظ¦ ³ôÀ̱â À§Çؼ­´Â ¸î°¡Áö ¹è°æ Áö½ÄÀÌ ÇÊ¿äÇÏ´Ù.
¸ÕÀú ºê¶ó¿ìÀú°¡ ij½ÌÀ» ÇÏ´Â ¹æ½ÄÀ» ¾Ë¾Æº¸ÀÚ. ÀϹÝÀûÀ¸·Î À¥ ÄÁÅÙÃ÷ÀÇ Ä³½ÌÀº µÎ°¡Áö ¹æ½ÄÀ¸·Î ÀÌ·ç¾îÁø´Ù. ù¹ø°´Â ¼­¹ö ij½ÌÀÌ°í µÎ¹ø°´Â Ŭ¶óÀ̾ðÆ®¿¡¼­ ij½ÌÀÌ´Ù.
¼­¹ö ij½ÌÀÇ °æ¿ì¿¡´Â ÈçÈ÷ ¿ì¸®°¡ ¾Ë°í ÀÖ´Â HTTP»óÅÂÄڵ尡 304¹øÀ¸·Î ³ª¿À°Ô µÈ´Ù. ¼­¹ö¿¡¼­´Â ´ÙÀ½°ú °°Àº Çì´õ µ¥ÀÌÅÍ°¡ ³»·Á¿À°Ô µÈ´Ù.

HTTP/1.1 304 Not Modified
Date: Mon, 03 Dec 2007 06:06:42 GMT
Etag: "604a5-185-d4d1aa00"
Age: 92
Expires: Tue, 02 Dec 2008 06:05:10 GMT

ÀÌ·¯ÇÑ ¼­¹ö ij½ÌÀÇ °æ¿ì¿¡´Â ³×Æ®¿öÅ©¸¦ ÅëÇØ Àü¼ÛµÇ´Â µ¥ÀÌÅÍÀÇ ¾çÀº ÀûÁö¸¸ ÇØ´ç ij½Ì Á¤º¸ÀÇ À¯È¿¼ºÀ» ¼­¹ö¿¡¼­ È®ÀÎÇØ¾ß Çؼ­ Ŭ¶óÀ̾ðÆ®¿Í ¼­¹ö°£ ÀÀ´ä½Ã°£(ping time)ÀÌ ´À¸° °æ¿ì ¼Óµµ°¡ ´À¸®´Ù°í ´À³¢°Ô µÈ´Ù. ³×Æ®¿öÅ©ÀÇ ´ë¿ªÆø(bandwidth)´Â Å©´Ù°í ÇÏ´õ¶óµµ ÀÀ´ä½Ã°£ÀÌ ´À¸®¸é »ç¿ëÀÚÀÇ Ã¤°¨¼Óµµ°¡ ¶³¾îÁö°Ô µÇ°í, ÀÌ·¯ÇÑ Çö»óÀº Çö¶õÇÑ(?) µðÀÚÀÎÀ» Àû¿ëÇÏ¿© ¼ö¸¹Àº À̹ÌÁö¸¦ ´Ù¿î¹Þ¾Æ¾ß ÇÏ´Â ÆäÀÌÁö³ª CSS¿¡ À̹ÌÁö ÆÄÀÏÀ» Àû¿ëÇÏ¿© »ç¿ëÇÏ´Â °æ¿ì ƯÈ÷ ¿µÇâÀ» ¸¹ÀÌ ¹Þ°Ô µÈ´Ù.

¾Æ·¡ È­¸éÀº ¼­¹ö¿¡¼­ ij½ÌÀ» º¸³»ÁØ °æ¿ìÀÌ´Ù.

»ç¿ëÀÚ »ðÀÔ À̹ÌÁö

µÎ ¹ø°´Â Ŭ¶óÀ̾ðÆ® ij½ÌÀÌ´Ù. ºê¶ó¿ìÀú´Â ¿äû µ¥ÀÌÅÍÀÇ Çì´õ Á¤º¸¸¦ ±â¹ÝÀ¸·Î ¼­¹ö·Î ¿äûÇÒÁö ¿©ºÎ¸¦ ÆÇ´ÜÇÏ°í ¿äû ÀÚü°¡ ÇÊ¿ä¾ø´Â °æ¿ì¿¡´Â ·ÎÄÿ¡ ij½ÌµÈ µ¥ÀÌÅ͸¦ ¹ÝȯÇÑ´Ù. ÀÌ °æ¿ì XMLHttpRequestÀÇ status´Â 200À¸·Î ¸¶Ä¡ ¼­¹ö¿¡¼­ °ªÀ» Àü¼ÛÇÑ °Í ó·³ º¸ÀÌÁö¸¸, HTTP Watch·Î ¸ð´ÏÅ͸µ ÇÏ°Ô µÇ¸é Result°¡ (Cache)·Î µÇ¾î ÀÖ°í ¼­¹ö¿Í´Â ¾Æ¹«·± Åë½ÅÀÌ ¹ß»ýÇÏÁö ¾Ê¾ÒÀ½À» ¾Ë ¼ö ÀÖ´Ù.

¾Æ·¡ È­¸éÀº Ŭ¶óÀ̾ðÆ® ij½ÌÀÇ °æ¿ìÀÌ´Ù.

»ç¿ëÀÚ »ðÀÔ À̹ÌÁö
Ŭ ¶óÀ̾ðÆ® ij½ÌÀ» ÇÏ°Ô µÇ´Â °æ¿ì¿¡´Â ¼­¹ö¿Í Ŭ¶óÀ̾ðÆ®°£ ¶ó¿îµåÆ®¸³ÀÌ ¾ø±â ¶§¹®¿¡ À̹ÌÁö ÆÄÀÏ°ú °°Àº ´Ù¼öÀÇ ÀÛÀº »çÀÌÁîÀÇ ÆÄÀÏÀÌ ÀÖ´Â °æ¿ì ü°¨ ¼Óµµ°¡ Çâ»óµÇ°Ô µÈ´Ù. ÀÌ·¸°Ô ºê¶ó¿ìÀú°¡ ij½ÌÀ» ÇÏ°Ô ÇϱâÀ§Çؼ­´Â HTTP 1.1ÀÇ Header°ü·Ã Spec¿¡ ´ëÇؼ­ ¾Ë¾Æ¾ß ÇÑ´Ù.
·ÎÄà ij½Ì°ú °ü·ÃµÈ Header °ü·Ã Á¤º¸´Â ´ÙÀ½°ú °°´Ù.
1. Expires : ÇØ´ç ¸®¼Ò½ºÀÇ ¸¸·áÀÏÀÚ¸¦ ÁöÁ¤ÇÑ´Ù. Locale´Â US·Î ÇØ¾ß Çϸç, TimeZoneÀº GMT·Î ¼³Á¤ÇØ¾ß ÇÑ´Ù.
2. ETag : Entity TagÀÇ ¾àÀÚ·Î °¢ Entity(html, gif, jpg µî ¼­¹ö¿¡¼­ ´Ù¿î¹ÞÀº ¸®¼Ò½º)¸¦ ±¸ºÐÇϱâ À§ÇÑ À¯ÀÏÇÑ Å°°ªÀ¸·Î ºê¶ó¿ìÀú¿¡¼­´Â ETag °ªÀ¸·Î ¼­¹ö¿¡ ÀÖ´Â ¸®¼Ò½º¿Í Ŭ¶óÀ̾ðÆ®¿¡ ÀÖ´Â ¸®¼Ò½º°¡ ÀÏÄ¡ÇÏ´ÂÁö ÆÇ´ÜÇÑ´Ù.
3. Last-Modified : ÇØ´ç ¸®¼Ò½ºÀÇ ÃÖÁ¾ ¼öÁ¤ÀÏÀÚ¸¦ ÁöÁ¤ÇÑ´Ù. Locale´Â US·Î ÇØ¾ß Çϸç, TimeZoneÀº GMT·Î ¼³Á¤ÇØ¾ß ÇÑ´Ù.

ÀϹÝÀûÀ¸·Î À§ÀÇ ¼¼°¡Áö °ªÀ» ¾î¶»°Ô ¼³Á¤ÇÏ´À³Ä¿¡ µû¶ó
 ETagÀÇ °ªÀº ¼­¹ö¿¡¼­ »ý¼ºÇÑ JavaScript¼Ò½ºÀÇ Hash°ªÀ» ÀÌ¿ëÇÏ°í ¸¸·áÀÏÀÚ´Â ÇöÀçÀϷκÎÅÍ 1³â Á¤µµ ¾Õ¼± °ªÀ¸·Î ¼³Á¤Çϸé Never Expire¿Í µ¿ÀÏÇÑ Àǹ̷Π»ç¿ëµÈ´Ù. ÇÏÁö¸¸ googleÀÇ Expires°ªÀ» ¸ð´ÏÅ͸µÇÑ °á°ú 364ÀÏÀ» ´õÇϵµ·Ï ±¸¼ºµÇ¾î ÀÖ´Â °ÍÀ» È®ÀÎÇÏ°í µ¿ÀÏÇÏ°Ô µû¶ó Çϱâ·Î Çß´Ù. Áï Expires = ÇöÀçÀÏ + 1³â - 1ÀÏ

¾îÁ¦ Æ÷½ºÆÃÇÑ JavaScriptÀ» gzipÀ¸·Î ¾ÐÃàÇÏ´Â ¼Ò½º¿Í °áÇÕÇÏ¸é ¾Æ·¡¿Í °°´Ù.


package tester;

import java.io.*;
import java.text.*;
import java.util.*;
import java.util.zip.*;
import javax.servlet.*;
import javax.servlet.http.*;

import com.inswave.util.*;

public class Test extends HttpServlet {

    public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException   {
        OutputStream out = null;

        try {

            byte[] jsSource = "alert('test123');".getBytes();
            ByteArrayOutputStream byteOut = new ByteArrayOutputStream();
            OutputStream zipOut = new GZIPOutputStream( byteOut );
            zipOut.write( jsSource, 0, jsSource.length );
            zipOut.flush();
            zipOut.close();
            byteOut.flush();
            byte[] compressedJsSource = byteOut.toByteArray();

            response.setContentType("text/javascript");

//          ¸¸·áÀÏÀº ¼³Á¤ÆÄÀÏ¿¡¼­ Àоî¿Â´Ù. ±âº»°ªÀº ÇöÀçÀÏ + 1³â - 1ÀÏ·Î{HTTP 1.1ÀÇ Never Expired) ¼³Á¤ÇÑ´Ù. (ÀÌ °ªÀÌ ¼³Á¤µÇ¾î¾ß ¼­¹ö¿¡ ¿äûÀ» º¸³»Áö ¾Ê´Â´Ù.)
            Calendar cal = Calendar.getInstance();
            cal.add( Calendar.YEAR, 1 );
            cal.add( Calendar.DATE, -1 );
            SimpleDateFormat formatter = new SimpleDateFormat( "EEE, dd MMM yyyy HH:mm:ss z", Locale.US );
            formatter.setTimeZone(TimeZone.getTimeZone("GMT"));
            response.setHeader("Expires",    formatter.format( cal.getTime() ) ); // "Sun, 09 Dec 2007 15:35:46 GMT"

//          ½ÇÁ¦ ÆÄÀÏ »ý¼ºÀÏÀ» ºôµå½ÃÁ¡¿¡ °¡Á®¿Â´Ù.
            response.setHeader("Last-Modified",    "Sun, 02 Dec 2007 15:35:46 GMT");

//          ÆÄÀÏÀÇ º¯°æÀ» ºê¶ó¿ìÀú¿¡¼­ üũÇÒ ¶§ »ç¿ëÇÏ´Â °ªÀ¸·Î ·£´ýÇϸ鼭 À¯ÀÏÇÑ °ªÀ» ³»·Áº¸³½´Ù. ÆÄÀÏÀÌ º¯°æµÇ±â Àü¿¡´Â º¯°æµÉ ÇÊ¿ä°¡ ¾ø´Ù.
            response.setHeader("ETag", "09298732197921" );

            out = response.getOutputStream();
            String ae = request.getHeader("accept-encoding");
            if (ae != null && ae.indexOf("gzip") != -1) {    // ¾ÐÃà °¡´É ¿©ºÎ ÆÇ´Ü
                response.setHeader("Content-Encoding", "gzip");
                out.write( compressedJsSource );
            } else {
                out.write( jsSource );
            }
        } catch (Throwable e) {

        } finally {
            if( out != null ) {
                try {
                    out.flush();
                    out.close();
                    out = null;
                } catch( Exception e ) {}
            }
        }
    }

    public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        doGet(request, response);
    }
}

ÀÚ ÀÌÁ¦ JavaScript¸¦ ¾ÐÃàÇÏ°í ij½ÌÇϱâ À§ÇÑ ¼­¹ö ¸ðµâÀ» ¿Ï¼ºÇÏ¿´´Ù.

ÀÌÁ¦ Ŭ¶óÀ̾ðÆ®¿¡¼­ ¾î¶»°Ô È£ÃâÇØ¾ß ÇÏ´ÂÁö ¾Ë¾Æº¸°Ú´Ù. ¼Ò½º´Â ¾Æ·¡¿Í °°´Ù.

var oXmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
var url = "/tester1";

oXmlHttp.open("GET", url, true);
oXmlHttp.onreadystatechange=  function()  {
    if (oXmlHttp.readyState == 4) {
        eval( oXmlHttp.responseText );
    }
};

oXmlHttp.send( null );

ÀÌ ÂªÀº ¼Ò½º¿¡´Â ¸î°¡Áö Áß¿äÇÑ »çÇ×À» ´ã°í ÀÖ´Ù.
¿ì¼±, Àüü ±¸¼º¿¡¼­ Áß¿äÇÑ ºÎºÐÀÌ ¾Æ´Ï±â ¶§¹®¿¡ XMLHttpRequest¸¦ ´Ù¸¥ ºê¶ó¿ìÀú¿¡¼­ µ¿ÀÛÇÏ´Â ÄÚ½º·Î ÀÛ¼ºÇÏÁö ¾Ê¾Ò´Ù.
·Î Äà ij½ÌÀ» Çϱâ À§Çؼ­´Â ¸ðµç ¿äûÀÌ GET¹æ½ÄÀ¸·Î ¿Ã¶ó°¡¾ß ÇÑ´Ù. GET¹æ½ÄÀ¸·Î ¿Ã¶ó°¡±â À§Çؼ­´Â À§¿¡¼­ µÎ°¡Áö ¼³Á¤ÀÌ ÇÊ¿äÇѵ¥ ù¹ø°·Î XMLHttpReqest open()ÇÔ¼öÀÇ Ã¹¹ø° ÀÎÀÚÀÎ method¸¦ "GET"À¸·Î ¼³Á¤ÇØ¾ß ÇÏ°í µÎ¹ø°·Î send() ÇÔ¼ö¿¡¼­ ÀÎÀÚ¸¦ null·Î ¼³Á¤ÇØ¾ß ÇÑ´Ù. MS Internet Explorer¿¡¼­´Â ÀÎÀÚ¸¦ »ý·«Çصµ µ¿ÀÛÇÏÁö¸¸ ´Ù¸¥ ºê¶ó¿ìÀú¿¡¼­´Â µ¿ÀÛÇÏÁö ¾ÊÀ¸¹Ç·Î ÀÎÀÚ¸¦ ¼³Á¤ÇØ¾ß ÇÏ°í ¸¸ÀÏ method°¡ GET¹æ½ÄÀ̶ó°í ÇÏ´õ¶óµµ send¿¡ °ªÀÌ ¿Ã¶ó°¡´Â °æ¿ì¿¡´Â ºê¶ó¿ìÀú¿¡¼­ ·ÎÄà ij½ÌÀ» ÇÏÁö ¾Ê°Ô µÈ´Ù.

ÀÚ ÀÌÁ¦ HTTP 1.1 Áß ÇÊ¿äÇÑ ½ºÆÑ°ú ¼­¹ö ¼Ò½º¿Í Ŭ¶óÀ̾ðÆ® ¼Ò½º¸¦ Á¤¸®Çß´Ù.

ÀÌ ¼Ò½º¿¡¼­ ¼­¹öÀÇ ¼Ò½º°¡ º¯°æµÇ´õ¶óµµ ij½Ã°¡ °»½ÅµÇÁö ¾Ê´Â ¹®Á¦Á¡ÀÌ ÀÖ´Ù.

±× ºÎºÐ¿¡ ´ëÇÑ ÇØ°á ¹æ¾ÈÀº ´ÙÀ½ Æ÷½ºÆ®¿¡¼­ ´Ù·ï º¸µµ·Ï ÇÏ°Ú´Ù.