L--怎样让用户点击浏览器后退按钮刷新后退页面的验证码

介绍

  项目需要,怎样让用户点击浏览器后退按钮刷新后退页面的验证码,通过cookie来解决

方法一(通过设置前台html)(失败)

  本想通过控制html的http-equiv属性来解决问题,如下

  • http-equiv属性
  • 1、<meta http-equiv="Content-Type" contect="text/html";charset=gb_2312-80">
  • 和 <meta http-equiv="Content-Language" contect="zh-CN">用以说明主页制作所使用的文字以及语
  • 言;又如英文是ISO-8859-1字符集,还有BIG5、utf-8、shift-Jis、Euc、Koi8-2等字符集;
  • 2、<meta http-equiv="Refresh" contect="n;url=http://yourlink">定时让网页在指定的时间n内,
  • 跳转到页面http;//yourlink;
  • 3、<meta http-equiv="Expires" contect="Mon,12 May 2001 00:20:00 GMT">可以用于设定网页的到
  • 期时间,一旦过期则必须到服务器上重新调用。需要注意的是必须使用GMT时间格式;
  • 4、<meta http-equiv="Pragma" contect="no-cache">是用于设定禁止浏览器从本地机的缓存中调阅
  • 页面内容,设定后一旦离开网页就无法从Cache中再调出;
  • 5、<meta http-equiv="set-cookie" contect="Mon,12 May 2001 00:20:00 GMT">cookie设定,如果
  • 网页过期,存盘的cookie将被删除。需要注意的也是必须使用GMT时间格式;
  • 6、<meta http-equiv="Pics-label" contect="">网页等级评定,在IE的internet选项中有一项内容
  • 设置,可以防止浏览一些受限制的网站,而网站的限制级别就是通过meta属性来设置的;
  • 7、<meta http-equiv="windows-Target" contect="_top">强制页面在当前窗口中以独立页面显示,
  • 可以防止自己的网页被别人当作一个frame页调用;
  • 8、<meta http-equiv="Page-Enter" contect="revealTrans(duration=10,transtion= 50)">和<
  • meta http-equiv="Page-Exit" contect="revealTrans(duration=20,transtion =6)">设定进入和离
  • 开页面时的特殊效果,这个功能即FrontPage中的“格式/网页过渡”,不过所加的页面不能够是一个frame页面。
    <meta http-equiv="Expires" content="0">
    <meta http-equiv="Cache-Control" content="no-cache">
    <meta http-equiv="Pragma" content="no-cache"> 

方法二(通过设置后台controller)(失败)

  本想通过控制response的setHeader方法来解决问题,如下

    @RequestMapping(value = "login", method = RequestMethod.GET)
    public String login(HttpServletRequest request,
                        HttpServletResponse response,
                        Model model) throws IOException {
        Object params = request.getSession().getAttribute("params");
        if (params != null) model.addAttribute("message", params);
        response.setHeader("Pragma", "No-cache");
        response.setHeader("Cache-Control","no-cache");
        response.setDateHeader("Expires", -10);
        return "login";
    }

  结论:点击浏览器的后退按钮,压根就没再从后台返回新的数据,依旧从浏览器的缓冲中读取

方法三(通过前台javacript设置cookie)(成功)

目标页面 js login.js

var Cookie = {
            // 设置Cookie
            setCookie: function(name, value, expires, path, domain){
                document.cookie = name + "=" + escape( value ) +
                    ( ( expires ) ? ";expires=" + expires.toGMTString() : "" ) +
                    ( ( path ) ? ";path=" + path : "" ) +
                    ( ( domain ) ? ";domain=" + domain : "" );
            },
            // 获取Cookie
            getCookie: function( name ){
                var arr = document.cookie.match(new RegExp("(^| )" + name + "=([^;]*)(;|$)"));
                if(arr != null) return unescape(arr[2]); return null;
            },
            // 删除Cookie
            delCookie: function( name ){
                var d = new Date();
                d.setTime(d.getTime() - 3600 * 1000);
                this.setCookie(name, "", d);
            }
        }
console.log(Cookie.getCookie("a"));
if (Cookie.getCookie("a") != 1){
   Cookie.setCookie("a",1);
   console.log(Cookie.getCookie("a"));
   window.location.reload();
}

目标页面下一页 js

        var Cookie = {
            // 设置Cookie
            setCookie: function(name, value, expires, path, domain){
                document.cookie = name + "=" + escape( value ) +
                        ( ( expires ) ? ";expires=" + expires.toGMTString() : "" ) +
                        ( ( path ) ? ";path=" + path : "" ) +
                        ( ( domain ) ? ";domain=" + domain : "" );
            },
            // 获取Cookie
            getCookie: function( name ){
                var arr = document.cookie.match(new RegExp("(^| )" + name + "=([^;]*)(;|$)"));
                if(arr != null) return unescape(arr[2]); return null;
            },
            // 删除Cookie
            delCookie: function( name ){
                var d = new Date();
                d.setTime(d.getTime() - 3600 * 1000);
                this.setCookie(name, "", d);
            }
        }
        Cookie.setCookie("a",2);

  总结:通过cookie跨页面保存变量的功能,判断同一变量在不同页面设置的值来达到区分的目的

参考

cookie介绍

时间: 2024-10-26 15:48:26

L--怎样让用户点击浏览器后退按钮刷新后退页面的验证码的相关文章

解决在点击登出之后,用户点击浏览器回退按钮能返回去继续操作问题

我在登出之后不但返回到刚才的页面.还因为我设置了拦截器而导致页面出现了我并不想看到的结果. 于是我着手对着问题进行了优化解决: 一开始我想这么做:在每张页面都有session判断,如果session为空则返回登录界面.但是就结果而言.出现了上面图片中的结果 后来我又想从前端页面着手,通过写js      window.location.href返回登录界面. 这是代码: <script type="text/javascript"> windows.location.hre

网页提交,点击浏览器返回按钮,网页出错

这两天公司新项目写一个问卷调查小功能,当时因为问题都是循环进行展示提交,所以写到一个php文件中,但是完成后进行测试,当一路点击提交代码结果显示正常,但是当问卷到第三页时点击浏览器返回按钮,网页直接报错,瞬间懵逼啊!没有任何日志!代码如下: <?php if(!isset($_SESSION)) { session_start(); } $_SESSION['username'] = "zhangminchao"; $data1 = '{"paper":{&q

网址和域名、用户点击浏览器的整个过程

1.网址和域名: 从形式上来看,网址比域名多了一个前缀"www.",比方说百度的网址是"www.baidu.com",而"baidu.com"则是域名,不管网址还是域名都可以通过地址栏输入直达网站.但是也有一些例外的情况,案例在这里已经想不起来了,直接输入域名无法打开网站,必须要在前面加"www." 网址是相对通俗一点的说法,而域名则是专业一点的,当然这只是过去的情况,互联网的发展已经经历了很长一段时间,网民的网络知识也得到了

栈:如何实现浏览器的前进和后退功能?

浏览器的前进.后退功能,我想你肯定很熟悉吧? 当你依次访问完一串页面 a-b-c 之后,点击浏览器的后退按钮,就可以查看之前浏览过的页面 b 和 a.当你后退到页面 a,点击前进按钮,就可以重新查看页面 b 和 c.但是,如果你后退到页面 b 后,点击了新的页面 d,那就无法再通过前进.后退功能查看页面 c 了. 假设你是 Chrome 浏览器的开发工程师,你会如何实现这个功能呢? 这就要用到我们今天要讲的“栈”这种数据结构.带着这个问题,我们来学习今天的内容. 如何理解“栈”? 关于“栈”,我

禁止浏览器返回按钮

浏览器的后退按钮使得我们能够方便地返回以前访问过的页面,它无疑非常有用.但有时候我们不得不关闭这个功能,以防止用户打乱预定的页面访问次序.本文介绍网络上可找到的各种禁用浏览器后退按钮方案,分析它们各自的优缺点和适用场合.    一.概述      曾经有许多人问起,“怎样才能‘禁用’浏览器的后退按钮?”,或者“怎样才能防止用户点击后退按钮返回以前浏览过的页面?”我访问了许多网站,参考了这些 网站所介绍的各种实现方法.如果你经常访问ASP编程网站,本文所介绍的部分内容你可能已经见到过.本文的任务是

vue,vue-router实现浏览器返回不刷新页面

当我们在写单页应用的时候,前端路由采用vue-router实现,如果从页面A跳到页面B,然后点浏览器返回,返回到页面A时,页面会刷新.最近遇到一个需求,一个列表页,用户会根据条件进行筛选,也可以翻页,当用户筛选后点击具体的某一个条目时,进入详情页查看编辑详情,用户点击返回时,希望之前页面的筛选条件也能够保留.查找相关资料,vue中有个keep-alive组件可以对组件进行缓存,这样当页面返回时就不会刷新页面. <keep-alive> <router-view></route

UWP-标题栏”后退“按钮

标题栏”后退“按钮,系统级导航 应用必须启用所有硬件和软件系统后退按钮的后退导航.执行此操作的方法是注册 BackRequested 事件的侦听器并定义相应处理程序. 在此处我们为 App.xaml 代码隐藏文件中的 BackRequested 事件注册全局侦听器.如果你想要从后退导航排除特定页面,或想要在显示页面前执行页面级别代码,可以在每个页面中注册此事件. Windows.UI.Core.SystemNavigationManager.GetForCurrentView().BackReq

Android实现点击AlertDialog上按钮时不关闭对话框

开发过程中,有时候会有这样的需求: 点击某个按钮之后显示一个对话框,对话框上面有一个输入框,并且有“确认”和“取消”两个按钮.当用户点击确认按钮时,需要对输入框的内容进行判断.如果内容为空则不关闭对话框,并toast提示. 使用AlertDialog.Builder创建对话框时,可以使用builder.setNegativeButton和builder.setPositiveButton两个方法设置取消按钮和确认按钮的点击事件.然而问题在于,只要用户点击了确认按钮或者取消按钮,系统就会自动将对话

Android:实现点击AlertDialog上按钮时不关闭对话框

开发过程中,有时候会有这样的需求: 点击某个按钮之后显示一个对话框,对话框上面有一个输入框,并且有"确认"和"取消"两个按钮.当用户点击确认按钮时,需要对输入框的内容进行判断.如果内容为空则不关闭对话框,并toast提示. 使用AlertDialog.Builder创建对话框时,可以使用builder.setNegativeButton和builder.setPositiveButton两个方法设置取消按钮和确认按钮的点击事件.然而问题在于,只要用户点击了确认按钮或