Ext用户访问超时,生成EXCEL文档,JS文件管理使用方法
来源:互联网 发布:优化设计控制造价 编辑:程序博客网 时间:2024/05/29 17:38
用户访问超时
解决两种情况下的用户访问超时。
a)普通http请求的session超时。
b)异步http请求的session超时,使用ext后大部分的界面刷新都是异步的ajax请求。
不管是那种类型的http请求总是可以由一个过滤器来捕捉。
分类:普通http请求的header参数中没有x-requested-with:XMLHttpRequest头信息,而异步的有。
其实对于常见的ajax框架,header中还有标示自己身份的header信息。
对于普通的http请求,发现session超时后直接重定向到一个超时页面,显示访问超时。
对于异步http请求,发现session超时后则向请求的response中写入特定的超时头信息,客户端ajax对象检测
头信息,发现有超时状态标志后调用显示超时信息的javascript方法,提示用户访问超时。
服务器端session超时后在过滤器中为response添加新的头信息,标记该请求超时:
if(r.getHeader("x-requested-with")!=null && r.getHeader("x-requested-with").equalsIgnoreCase("XMLHttpRequest")){ response.setHeader("sessionstatus","timeout"); }
使用Ext.Ajaxt对象完成异步请求的交互,Ext.Ajax是单实例对象(非常重要,全局单一Ext.Ajax实例!)。
注册Ext.Ajax的requestcomplete事件,每个ajax请求成功后首先响应该事件。在该事件的回调函数里面判断
访问请求是否超时。使用Ext.Ajax对象的好处是,只需要引入一个包含了几行超时处理代码的js文件,就可以
为当前应用增加超时处理功能,原有代码不需要做任何修改。
使用Ext.Ajaxt对象完成异步请求交互,假如checkUserSessionStatus是你的回调方法,每个页面引用:
Ext.Ajax.on('requestcomplete',checkUserSessionStatus, this);function checkUserSessionStatus(conn,response,options){//Ext重新封装了response对象if(typeof response.getResponseHeader.sessionstatus != 'undefined'){//发现请求超时,退出处理代码...}}
可以利用的几个特性:
a)所有的ajax请求均带有x-requested-with:XMLHttpRequest头信息
b)Ext.Ajax是单实例对象(非常重要,全局单一Ext.Ajax实例!)
c)注册Ext.Ajax的requestcomplete事件,每个ajax请求成功后首先响应该事件(概念类似spring的aop拦截)。
对于其他的ajax框架,解决用户访问请求超时这个问题的思路是类似的。
在这里推荐一个很实用的Js方法:
function getRootWin(){var win = window;while (win != win.parent){win = win.parent;}return win;}
通过该方法,可以在一个任意深度的iframe中调用父iframe中的方法。具体到这里就是无论哪一个iframe中的用户访
问请求超时,都可以通过该方法调用最外层iframe中的退出方法,这样便为用户提供了一个统一的访问超时退出的UI
呈现。
系统异常处理
将实际业务代码中的各种异常封装成IOException, ServletException异常,指定过滤器捕获。其余处理思路同
用户访问超时处理。
更换主题
去ext的官网上下载各种主题皮肤 Themes for Ext 2.0
主题皮肤文件拷贝至本地/js/ext/plugins/theme/css/,/js/ext/plugins/theme/images/ 目录
最好将用户选择的主题配置保存在cookie中,这样用户每次登陆都可以使用相同的界面主题。
Ext主题切换:
if($.cookie('ext.theme') != null && $.cookie('ext.theme') != 'default'){Ext.util.CSS.swapStyleSheet("theme","/js/ext/plugins/theme/css/"+$.cookie('ext.theme'));}
生成Excel文档
最先参考的资料是extjs论坛上面的这篇文章:GridPanel directly to Excel.
作者思路不错,就是利用javascript直接读取GridPanel的store数据,然后生成一个描述excel文档的xml数据,最后
再通过一个包含了该xml数据的"data" URL下载该excel。
该方法的好处是通用性比较强,生成的excel文档也不难看,并且是不需要服务器端参与处理的一种纯客户端解决方案。
但是最大的缺点是目前IE7不支持(This needs a browser that supports data URLs. FF, Opera and IE8 will support this.)。
而后发现dojochina网站上的一个用户整理和修改了这个生成excel文档的实现方法。
1、没有考虑到含有序号和选择框的grid,
2、utf8转换bug.
3、宽度的bug
4、不支持ie6、ie7和Safari
原文地址:官方Grid导出到Excel修正版 (作者给出的代码有些小问题,需要略微进行些调整)
如果是IE浏览器,客户端将以multipart/form-data方式向服务器端提交该xml数据。
原文给出了后台由php实现时的exportexcel.php代码。
如果后台由java实现,exportexcel.jsp
<%@page import="java.util.Date"%><%@page import="org.apache.commons.lang.time.DateFormatUtils"%><%@page import="com.oreilly.servlet.multipart.*"%><%response.setContentType("application/vnd.ms-excel");response.setHeader("Content-disposition","attachment;filename="+ (DateFormatUtils.format(new Date(),"yyyyMMddHHmmss"))+".xls" ); MultipartParser parse = new MultipartParser(request,1000000000);Part part = null;int maxcount = 0;ParamPart param = null;while(true){part = parse.readNextPart();if(part == null || maxcount>1000)break;if(part.isParam() && part.getName().equalsIgnoreCase("exportContent")){param = (ParamPart)part;break;}maxcount++;}if(param!=null){response.getWriter().println(param.getStringValue());}else{;}%>
这里使用 com.oreilly.servlet 解析multipart/form-data类型数据。com.oreilly.servlet 很适合文件,表单混合提
交、多文件上传的数据解析。
js文件管理
凡是这种基于javascript的富客户端解决方案一大问题就是js文件太多。每个页面不仅要导入Ext的css,js文件,
还要导入每个页面应用需要的一些js文件,这样管理起来很麻烦。
原来的情况,至少要导入:
<link rel="stylesheet" type="text/css" href="/js/ext/resources/css/ext-all.css" /><script type="text/javascript" src="/js/ext/adapter/jquery/jquery.js"></script><script type="text/javascript" src="/js/jquery.cookie.js"></script><script type="text/javascript" src="/js/ext/adapter/jquery/ext-jquery-adapter.js"></script><script type="text/javascript" src="/js/ext/ext-base.js"></script><script type="text/javascript" src="/js/ext/ext-all.js"></script><script type="text/javascript" src="/js/ext/ext-lang-zh_CN.js"></script><script type="text/javascript" src="/js/extajax.js"></script><script type="text/javascript" src="/js/exttheme.js"></script>
推荐使用 JSLoader 管理众多的js,css文件
1,编写一个js文件统一管理支持所有公用css,js文件的动态导入
//添加jquery支持JSLoader.loadJavaScript("/js/ext/adapter/jquery/jquery.js");JSLoader.loadJavaScript("/js/jquery.cookie.js");JSLoader.loadJavaScript("/js/ext/adapter/jquery/ext-jquery-adapter.js");//Ext支持JSLoader.loadStyleSheet("/js/ext/resources/css/ext-all.css");JSLoader.loadJavaScript("/js/ext/ext-base.js");JSLoader.loadJavaScript("/js/ext/ext-all.js");JSLoader.loadJavaScript("/js/ext/ext-lang-zh_CN.js");//加载自定义toolbar图标css样式JSLoader.loadStyleSheet("/js/ext/plugins/icon/css/ext-extend.css");//加载用户超时,异常处理JSLoader.loadJavaScript("/js/extajax.js");//主题管理JSLoader.loadJavaScript("/js/exttheme.js");//Excel导出支持JSLoader.loadJavaScript("/js/ext.excel.js");
2,每个页面只需要引入:
<script type="text/javascript" src="/js/jsloader.js"></script><script type="text/javascript" src="/js/assets.js"></script>
- Ext用户访问超时,生成EXCEL文档,JS文件管理使用方法
- js随记-----生成excel文件
- Ext js 学习文档
- Java读取excel文件生成xml文档和JSON文档
- Java读取excel文件生成xml文档和JSON文档
- Ext Js中Ext.XTemplate使用方法学习
- Ext js权限管理
- ext js renderer的使用方法
- 通过虚拟打印机生成pdf文件来转换EXCEL使用方法
- js判断用户超时登录
- Ext文件管理界面
- php生成excel文档
- Excel文档的生成
- 生成excel文档
- Python生成excel文档
- Excel自定义文档生成
- poi生成excel文档
- Linux管理用户帐户和控制对文件的访问
- Silverlight 2学习教程(一):开发Silverlight 2应用程序的准备工作
- Ajax 安全工具
- Django with mod_python环境搭建总结
- 中国移动正式发布3G标识G3及其含义解释
- Silverlight 2学习教程(二):开发简单的Silverlight 2应用程序
- Ext用户访问超时,生成EXCEL文档,JS文件管理使用方法
- 提高 Ajax 应用程序性能,避开 Web 服务漏洞
- Silverlight 2学习教程(三):Silverlight 2应用程序的部署
- Silverlight 2学习教程(四):Chiron.exe:Silverlight 2打包和动态语言部署工具
- fedora 10安装source navigator
- JavaScript 和文档对象模型(DOM)
- Python调用DLL
- Silverlight 2学习教程(五):JavaScript与Silverlight托管代码相互调用
- 设置指定线程的优先级