extjs GZIP压缩问题
 |
yunhaifeiwu
2008-07-11
经过不断努力，发现传说中的GZIP静态压缩，IE6 与 IE7对它支持很差劲。
IE 6 据说ie6的sp1才支持；而 ie7直接就屏掉。对于firefox 3来说，其GZIP格式要设成x-gzip才能支持。 我的测试源码根据badqiu网友的相关文章而来 web.xml (java servlet配置文档) 配置要注意：firefox3 关键处要把Content-Encoding的值设成x-gzip;而不是原文中的gzip
<?xml version="1.0" encoding="UTF-8"?>
<web-app version="2.5" xmlns="http://java.sun.com/xml/ns/javaee" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://java.sun.com/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">
<context-param>
<param-name>contextConfigLocation</param-name>
<param-value>/WEB-INF/applicationContext.xml</param-value>
</context-param>
<listener>
<listener-class>org.springframework.web.context.ContextLoaderListener</listener-class>
</listener>
<servlet>
<servlet-name>dispatcher</servlet-name>
<servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
<load-on-startup>2</load-on-startup>
</servlet>
<servlet-mapping>
<servlet-name>dispatcher</servlet-name>
<url-pattern>*.do</url-pattern>
</servlet-mapping>
<session-config>
<session-timeout>
30
</session-timeout>
</session-config>
<welcome-file-list>
<welcome-file>redirect.jsp</welcome-file>
</welcome-file-list>
<filter>
<filter-name>AddHeaderFilter</filter-name>
<filter-class>badqiu.web.filter.AddHeaderFilter</filter-class>
<init-param>
<param-name>headers</param-name>
<param-value>Content-Encoding=x-gzip</param-value>
</init-param>
</filter>
<filter-mapping>
<filter-name>AddHeaderFilter</filter-name>
<url-pattern>*.gz</url-pattern>
</filter-mapping>
</web-app>
过滤器中
String str = request.getHeader("Accept-Encoding");
观察ie 6 ie 7返回的是null值 另外原文中的 public void doFilter(HttpServletRequest request, HttpServletResponse response, FilterChain chain) 函数名要更改。否在，在netbeans 6.1中根本就不执行。 我后缀了一下1 过滤器
package badqiu.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 AddHeaderFilter implements Filter {
public Map headers = new HashMap();
public void destroy() {
}
public void doFilter(ServletRequest req, ServletResponse res,
FilterChain chain) throws IOException, ServletException {
if(req instanceof HttpServletRequest) {
doFilter1((HttpServletRequest)req, (HttpServletResponse)res, chain);
}else {
chain.doFilter(req, res);
}
}
public void doFilter1(HttpServletRequest request,
HttpServletResponse response, FilterChain chain)
throws IOException, ServletException {
// String str = request.getHeader("Accept-Encoding");
// if (str != null)
// {
//
// str = str.toLowerCase();
// if (str.contains("gzip")){
// response.addHeader("Content-Encoding","gzip");
// }
// else if (str.contains("deflate")) {
// response.addHeader("Content-Encoding","deflate");
// }
// else if (str.contains("x-gzip")) {
// response.addHeader("Content-Encoding","x-gzip");
// }
// response.addHeader("Content-Encoding","gzip|x-gzip");
//
// }
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 aa="aa";
String bb=aa;
String headersStr = config.getInitParameter("headers");
String[] headersl = headersStr.split(",");
for(int i = 0; i < headersl.length; i++) {
String[] temp = headersl[i].split("=");
this.headers.put(temp[0].trim(), temp[1].trim());
}
}
}
测试代码 对 ext-all.js进行压缩后，压缩后的文件名为ext-all.js.gz(有136k)
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" type="text/css" href="resources/ext21/resources/css/ext-all.css" />
<link rel="stylesheet" type="text/css" href="resources/ext21/resources/css/fyhC.css" />
<script type="text/javascript" src="resources/ext21/adapter/ext/ext-base.js"> </script>
<script type="text/javascript" src="resources/ext21/ext-all.js.gz" ></script>
</head>
<script>
Ext.onReady(function(){
Ext.state.Manager.setProvider(new Ext.state.CookieProvider());
var f=new Ext.form.FormPanel({
// renderTo:"hello",//定位到名为hello的Div节点
title:"用户信息录入框",
url : "login.do",
baseParams:{aa:"bb"},
height:130,
width:320,
labelWidth:60,
labelAlign:"right",
frame:true,
defaults:{width:180,xtype:"textfield"},
items:[{
xtype:"textfield",
name:"username",
fieldLabel:"姓名"
},
{
xtype:"textfield",
name:"password",
fieldLabel:"密码"
}
],
buttons:[{
text:"加载表单数据",
handler:s
},{
text:"新增cookie",
handler:ss
},{
text:"新增session",
handler:sss
}]
});
//表单有两种与服务器的通信方式，submit与load
//两者都必须要求服务器给出一个json字符串，
//当成功时json字符串形如: "{success: true, data:
// { username: \"王五\", password: \"789\"}}";
//当失败时json字符串形如: {success: false, errors:
// { username: \"姓名不能为空\", password: \"必须是数字!\"}}";
function s() {
f.form.load({//服务器为客户端的表单提供值
// f.form.submit({//客户端的数据提交给服务器
waitTitle:"请稍候",
waitMsg:"正在提交表单数据，请稍候。。。。。。",
url:" login.do",
method:"POST",
success:function(form, action) {
// Ext.state.Manager.set("name2","dx");
alert("提交成功!");
alert(action.result.data.username);
},
failure:function(form ,action) {
alert("数据加载失败！");
alert(action.response.responseText)
}
})
}
function ss(){
var ddd= Ext.Ajax.request({
url:'login.do',
method: 'post',
params:{aa:'bar'}
});
}
function sss(){
var ddd= Ext.Ajax.request({
url:'login.do',
method: 'post',
success:function(form, action) {
// Ext.state.Manager.set("name2","dx");
alert("提交成功!");
// window.location ("dis.do");
window.open ("dis.do","new","");
// document.write(form.responseText);
},
params:{aa:'bar1'}
});
}
var win=new Ext.Window({
width:400,
height:300,
maximizable:true,
items:f //把上面的formPanel(要去掉)rendetTo放在窗口中
});
win.show();
});
</script>
<body>
<div id="aa"/>
<div id="hello"/>
</body>
</html>
|
|
yunhaifeiwu
2008-07-11
本社区的jindw 写了一个javascript 压缩程序。很好用，很强悍！压缩ext-all.js后的js文件288k,接近一半的压缩比。
特别说明：jsa压缩后的文件格式仍然是js.这个免了解压缩的烦恼了！ 其原理大体是：把js中的注释空格之类的去掉，把原来的变量，参数名之类的用简单的字符（尽可能是一两位字符）代替。 目前2.0Beta版 官方下载地址： http://www.xidea.org/ --------------------- 恨死gzip了！不过还是打算用一下吧，firefox还支持。 |
|
yunhaifeiwu
2008-07-11
经本机测试，非网络。
发现用jsa压缩后，比用gzip快，虽然gzip压缩比高（压缩后是136k)。估计是解压也要代价吧. |
|
popl2003
2008-07-23
GZIP静态压缩,应该一般比较高的版本浏览器都可以用吧.我现在就在用着.
|
