1. 程式人生 > >用Gzip進行js的超強壓縮

用Gzip進行js的超強壓縮

Gzip的官方網址為: 
http://www.gnu.org/software/gzip/ 

Gzip的使用很簡單 

解壓至某個目錄,會看到有一個Gzip.exe檔案,然後在命令視窗進入該目錄,執行 
gzip ext-all.js 
ext-all.js馬上變成為ext-all.js.gz 
大小從原來600多k搖身一變成了160多k,簡直壓細小很多。這回下載速度就非常快了。 
那麼瀏覽器能否解析這種壓縮檔案?答案是肯定的,前提是告訴瀏覽器,這種檔案需要解壓,然後再執行,解壓的過程由瀏覽器來執行。 
那麼應用程式如何告訴瀏覽器,該檔案需要解壓呢,這得由伺服器通過Http的Header指令來進行。 
在JOffice中,就是通過Filter來進行的。 


1.把ext.all.js.gz檔名改為ext.all.gzjs,Filter等一下就會攔截這種檔案的訪問。 

2.寫一個Filter,完成向Header新增指令 

   程式碼如下: 

package com.htsoft.core.web.filter;    
    import java.io.IOException;    
    import java.util.HashMap;    
    import java.util.Iterator;    
    import java.util.Map;    
    import javax.servlet.Filter;    
    import javax.servlet.FilterChain;    
    import javax.servlet.FilterConfig;    
    import javax.servlet.ServletException;    
    import javax.servlet.ServletRequest;    
    import javax.servlet.ServletResponse;    
    import javax.servlet.http.HttpServletRequest;    
    import javax.servlet.http.HttpServletResponse;    
        
    public class GzipJsFilter implements Filter {    
        Map headers = new HashMap();    
        public void destroy() {    
        }    
        public void doFilter(ServletRequest req, ServletResponse res,    
                FilterChain chain) throws IOException, ServletException {    
            if(req instanceof HttpServletRequest) {    
                doFilter((HttpServletRequest)req, (HttpServletResponse)res, chain);    
            }else {    
                chain.doFilter(req, res);    
            }    
        }    
        public void doFilter(HttpServletRequest request,    
                HttpServletResponse response, FilterChain chain)    
                throws IOException, ServletException {    
                request.setCharacterEncoding("UTF-8");    
                for(Iterator it = headers.entrySet().iterator();it.hasNext();) {    
                    Map.Entry entry = (Map.Entry)it.next();    
                    response.addHeader((String)entry.getKey(),(String)entry.getValue());    
                }    
                chain.doFilter(request, response);    
        }    
        
        public void init(FilterConfig config) throws ServletException {    
            String headersStr = config.getInitParameter("headers");    
            String[] headers = headersStr.split(",");    
            for(int i = 0; i < headers.length; i++) {    
                String[] temp = headers[i].split("=");    
                this.headers.put(temp[0].trim(), temp[1].trim());    
            }    
        }    
    }    
  
3.在WEB.xml 檔案中,新增以下配置:  
  
   
  
<filter>      
    <filter-name>GzipJsFilter</filter-name>      
    <filter-class>com.htsoft.core.web.filter.GzipJsFilter</filter-class>      
    <init-param>      
        <param-name>headers</param-name>      
        <param-value>Content-Encoding=gzip</param-value>      
    </init-param>    
</filter>    
<filter-mapping>    
<filter-name>GzipJsFilter</filter-name>    
<url-pattern>*.gzjs</url-pattern>    
</filter-mapping>    
  
   
  
4.在index.jsp中引入該壓縮檔案:  
  <script type="text/javascript" src="<%=request.getContextPath()%>/ext3/ext-all.gzjs"></script>  

下面可能會用到,解決ie遇到gzjs下載問題的,沒有試驗:
<Connector   
              port="8080"   
              protocol="HTTP/1.1"  
              connectionTimeout="20000"  
              redirectPort="443"   
              URIEncoding="UTF-8"  
              compression="on"     
              noCompressionUserAgents="gozilla, traviata"     
              compressableMimeType="text/html,text/xml,text/javascript,text/css,text/plain,application/json"   
/>    
配置細節: 
compression="on"   開啟壓縮支援
noCompressionUserAgents="gozilla, traviata"   不壓縮的內容
compressableMimeType="text/html,text/xml,text/javascript,text/css,text/plain,application/json" 壓縮的型別