问题描述:页面查询时,在当前页面A输入查询条件之后,跳转至另一个页面B,当重新点击页面A时,输入的查询条件和查询结果均被初始化,需要重新输入查询条件,用户体验不好
项目框架:SpringMVC
项目结构:上部导航栏中每一个tab对应一个controller,当点击tab时,此时就会重新加载页面,页面被初始化,查询条件被清空
思考过和使用过的解决办法:
1、将上述7个模块放在同一个页面中,点击对应模块出现对应页面
问题:此时需要将7个模块的代码放置在同一个controller中,代码冗余量增大
jsp页面代码量较大,对于代码的修改将是一件令人头痛的事情
由于框架的限制,点击分页时,将会出现一次点击控制多个页面的页码变化(体验不好)
2、多个iframe叠加,点击一个tab显示对应页面,置顶于其他页面
问题:此时页面与页面还是处于隔离状态,无法在一个页面中保存另一个页面的查询状态
3、Spring Cache缓存技术,将每个页面的查询状态保存在缓存中,当再到此页面时,查询是否存在查询状态,有则显示
问题:Spring缓存是方法级别的缓存,(一篇很好的缓存文章:注释驱动的 Spring cache 缓存介绍),文章中提到在方法上添加注解,可以将方法中的参数作为key,方法的返回结果作为value保存在缓存中;我的问题在于,我的方法返回结果是SpringMVC中的view路径,而我想要缓存的是从前台页面传回来的查询参数
4、页面缓存--H5 localStorage
问题:localStorage是缓存在本地,当浏览器关闭时同样存在,启动浏览器时,上次的查询状态同样会显示
我并不需要它存留很长时间,所以缓存在本地是不能满足要求的
小技巧:浏览器工具(F12)打开Application可以查看缓存
5、页面缓存--Sessionstorage (最终解决方案采纳)
Sessionstorage 和 localstorage都是H5中针对cookie缓存大小不够出的解决方案,两者有些不同
可查看文章:http://blog.csdn.net/fcdd123/article/details/56286106
最终采纳这种解决方案,但也有一些不完美,当点击父tab时无法统一清除缓存(即清除7个模块的查询状态)
由于Sessionstorage 和 localstorage都只在当前页面有效,所以就采用了一种笨方法,使用HttpSession保存一个考勤审核链接带过来的参数index,再在七个controller中获取并携带到页面中,根据index是否等于某个值来判断是否清除当前页的查询状态