精华内容
下载资源
问答
  • 关闭浏览器退出登录
    千次阅读
    2022-06-08 14:41:30

    项目场景:

    在实现单点登录时,发现关闭浏览器后,并不会自动退出登录


    解决方案:在app.vue中书写如下代码

      data() {
        return {
          gap_time: 0,
          beforeUnload_time: 0,
        };
      },
      methods: {
        // 关闭窗口之前执行
        beforeunloadHandler() {
          this.beforeUnload_time = new Date().getTime();
        },
        unloadHandler() {
          this.gap_time = new Date().getTime() - this.beforeUnload_time;
          //判断是窗口关闭还是刷新 毫秒数判断 网上大部分写的是5
          if (this.gap_time <= 10) {
            logOut() // 退出登录接口 这里应当换为个人的登出方法
          } else {
            
          }
        },
      },
      destroyed() {
        // 移除监听
        window.removeEventListener("beforeunload", () => this.beforeunloadHandler());
        window.removeEventListener("unload", () => this.unloadHandler());
      },
      mounted() {
        // 监听浏览器关闭
        window.addEventListener("beforeunload", () => this.beforeunloadHandler());
        window.addEventListener("unload", () => this.unloadHandler());
      }

    然后,再关闭浏览器后,就会自动调用我们的退出登录函数了。 

    更多相关内容
  • vue关闭浏览器退出登录

    千次阅读 2021-11-30 21:41:42
    根据`beforeunload`和`unload`这两个事件实现关闭浏览器退出登录

      项目需要:也在网上找了不少类似的文章,不过用起来多少有点问题,毕竟要适合自己的需求,我这里是vue3适用,理论上vue2也可以使用,我写的方法是通用的。

      这些方法无非都是根据beforeunloadunload这两个事件执行的。
      下面我搜了下菜鸟教程和MDN对两个事件的介绍,可自行琢磨。

    1、beforeunload事件

    1.1、菜鸟教程:

    在这里插入图片描述

    1.2、MDN

    在这里插入图片描述

    2、unload事件

    2.1、菜鸟教程

    在这里插入图片描述

    2.2、MDN

    在这里插入图片描述
      MDN:通常而言,我们推荐使用 window.addEventListener() 来监听 unload (en-US) 事件,而不是直接给 onunload 赋值。

    下面贴我使用的源码;

    3、源码部分

    3.1、方法一:可写于html页面使用(直接使用)

          var _beforeUnload_time = 0, _gap_time = 0;
          window.onunload = function (){
              _gap_time = new Date().getTime() - _beforeUnload_time;
              if(_gap_time <= 10) {//浏览器关闭
                  window.mgr.signoutRedirect();//这个mgr是我暴露在window的退出登录方法
              }else{//浏览器刷新-chrome刷新
                  console.log(document.domain);
                  return confirm("确定要离开本系统么?");
              }
          };
          window.onbeforeunload = function (){
              _beforeUnload_time = new Date().getTime();
          };
    

    3.2、方法二:可写于组件如app.vue使用(监听事件)

      data() {
        return {
          gap_time: 0,
          beforeUnload_time: 0,
        };
      },
      methods: {
        // 关闭窗口之前执行
        beforeunloadHandler() {
          this.beforeUnload_time = new Date().getTime();
        },
        unloadHandler() {
          this.gap_time = new Date().getTime() - this.beforeUnload_time;
          //判断是窗口关闭还是刷新 毫秒数判断 网上大部分写的是5
          if (this.gap_time <= 10) {
            mgr.signoutRedirect(); // 退出登录接口 这里应当换为个人的登出方法
          } else {
            console.log(document.domain);
            return confirm("确定要离开本系统么?");
          }
        },
      },
      unmounted() {//vue可换为destroyed()生命周期,不过这个也可以用
        // 移除监听
        window.removeEventListener("beforeunload", () => this.beforeunloadHandler());
        window.removeEventListener("unload", () => this.unloadHandler());
      },
      mounted() {
        // 监听浏览器关闭
        window.addEventListener("beforeunload", () => this.beforeunloadHandler());
        window.addEventListener("unload", () => this.unloadHandler());
      },
    

    参考文章:
      vue关闭浏览器时,触发事件,执行退出登录接口
      vue 关闭浏览器清空token (区分刷新)

    展开全文
  • ## 前辈们,如何实现关闭浏览器就能执行退出登录 下面是关闭页面会执行方法,但我想要的是关闭浏览器 ``` ()"> function delSession() { alert("下面的ajax有运行无法弹出窗口"); $.ajax({ ...
  • 问题背景:为了用户安全,想让用户关闭浏览器后,直接退出。 一直想着用JavaScript的方式解决这个问题,然后发现并不是那么容易解决的,中间出现各种问题,弄起来也很复杂。后面发现是自己对Cookie和Session的理解...

    问题背景:为了用户安全,想让用户关闭浏览器后,直接退出。

    一直想着用JavaScript的方式解决这个问题,然后发现并不是那么容易解决的,中间出现各种问题,弄起来也很复杂。后面发现是自己对Cookie和Session的理解不够深入。理解session和Cookie的机制后,其实很简单,自身项目的应用程序是利用Cookie传输SessionID的,只需要Cookie的过期时间不设置,即可在关闭浏览器后,自动销毁本地的SessionID,那么本地用户的登陆状态即可退出。

    首先看下Cookie和Session的区别

    1. 由于HTTP协议是无状态的协议,所以服务端需要记录用户的状态时,就需要用某种机制来识具体的用户,这个机制就是Session.典型的场景比如购物车,当你点击下单按钮时,由于HTTP协议无状态,所以并不知道是哪个用户操作的,所以服务端要为特定的用户创建了特定的Session,用用于标识这个用户,并且跟踪用户,这样才知道购物车里面有几本书。这个Session是保存在服务端的,有一个唯一标识。在服务端保存Session的方法很多,内存、数据库、文件都有。集群的时候也要考虑Session的转移,在大型的网站,一般会有专门的Session服务器集群,用来保存用户会话,这个时候 Session 信息都是放在内存的,使用一些缓存服务比如Memcached之类的来放 Session。

    2. 思考一下服务端如何识别特定的客户?这个时候Cookie就登场了。每次HTTP请求的时候,客户端都会发送相应的Cookie信息到服务端。实际上大多数的应用都是用 Cookie 来实现Session跟踪的,第一次创建Session的时候,服务端会在HTTP协议中告诉客户端,需要在 Cookie 里面记录一个Session ID,以后每次请求把这个会话ID发送到服务器,我就知道你是谁了。有人问,如果客户端的浏览器禁用了 Cookie 怎么办?一般这种情况下,会使用一种叫做URL重写的技术来进行会话跟踪,即每次HTTP交互,URL后面都会被附加上一个诸如 sid=xxxxx 这样的参数,服务端据此来识别用户。

    3. Cookie其实还可以用在一些方便用户的场景下,设想你某次登陆过一个网站,下次登录的时候不想再次输入账号了,怎么办?这个信息可以写到Cookie里面,访问网站的时候,网站页面的脚本可以读取这个信息,就自动帮你把用户名给填了,能够方便一下用户。这也是Cookie名称的由来,给用户的一点甜头。

    所以,总结一下:

    Session是在服务端保存的一个数据结构,用来跟踪用户的状态,这个数据可以保存在集群、数据库、文件中;

    Cookie是客户端保存用户信息的一种机制,用来记录用户的一些信息,也是实现Session的一种方式。

    看懂区别之后,重点来了

    Cookie 的生命周期可以通过两种方式定义:

    会话期 Cookie 是最简单的 Cookie:浏览器关闭之后它会被自动删除,也就是说它仅在会话期内有效。会话期Cookie不需要指定过期时间(Expires)或者有效期(Max-Age)。需要注意的是,有些浏览器提供了会话恢复功能,这种情况下即使关闭了浏览器,会话期Cookie 也会被保留下来,就好像浏览器从来没有关闭一样,这会导致 Cookie 的生命周期无限期延长。

    也就是说,我们不指定Cookie的有效期或者过期时间,那么Cookie就会在浏览器关闭后自动消失了,如果你SessionID是通过Cookie方式来实现的话,那么浏览器关闭后,用户的登陆状态就自然没有了(注意:实际是服务端的状态可能还没到期,只是客户端的SESSIONID丢失而已)。

    重要的实操:

    环境:php7.2+thinkphp5(其他环境只要理解这个原理,都可以自己实操解决)

    cookie的过期时间在php.ini中配置,0代表在关闭浏览器后即过期。

    session.cookie_lifetime = 0

    然而,我配置完后重启php还是不能实现SessionID自动消失,这时候发现是在应用程序中动态配置了过期时间

    ini_set(‘session.cookie_lifetime’, $config[‘expire’]);

    查找thinkphp的配置文件(config.php)将session下的expire改为0,从而实现了关闭浏览器后,用户自动退出登陆的功能。

     原文地址:用户直接关闭浏览器,直接退出登陆的实现方法【php+thinkphp】_林哥哥_好物分享网BestSvps

    展开全文
  • react关闭浏览器后自动退出登录

    千次阅读 2018-01-24 09:29:44
    window.onunload=function(e){//关闭浏览器后的退出操作 _gap_time = new Date().getTime() - _beforeUnload_time; if(_gap_time ) { dispatch({type: 'app/logout'}); } else{ console....

      在网上了百度了不少,都是以鼠标的坐标位置来判断,但是对react自动触发的来说,用这个鼠标的完全不起作用。

     经过百度 + 多次测试,发现用时间来判断比较合适,现将代码贴上分享并方便以后查看。

     var _beforeUnload_time = 0, _gap_time = 0;
    var is_fireFox = navigator.userAgent.indexOf("Firefox")>-1;//是否是火狐浏览器
    window.οnunlοad=function(e){//关闭浏览器后的退出操作
    _gap_time = new Date().getTime() - _beforeUnload_time;
    if(_gap_time <= 5) {
    dispatch({type: 'app/logout'});
    }
    else{
    console.info("你正在刷新页面");
    }
    }

    window.onbeforeunload  =function(e) { //对火狐浏览器的特殊处理
    _beforeUnload_time = new Date().getTime();
    if(is_fireFox){//火狐关闭执行
    dispatch({type: 'app/logout'});
    }
    }

    展开全文
  • 实现关闭浏览器标签页退出登录

    千次阅读 2019-11-26 17:46:13
    公司的一个项目突然要加一个在关闭浏览器标签页退出登录的功能,当时首先想到的就是获取浏览器标签页的关闭事件然后执行退出登录方法,浏览器标签页的关闭事件有onbeforeunload和onunload: onunload、...
  • 关闭浏览器响应的js代码如下:在head中调用js:<script>window.onunload=function(){if(self.screenTop>9000){Out();}}</script>在body中添加js方法如下:<scriptlanguage="JavaScript"type="text...
  • 本地存储对比:sessionStorage,关闭窗口就被清除;localStorage,一直存在直到手动删除;cookie,设置有效期,可以直接实现标题的需求今天不想多说话,直接贴上代码://判断是否支持 比如浏览器开启了隐私模式var ...
  • 浏览器强制退出监听
  • 关闭浏览器用户退出登录

    千次阅读 2019-04-11 11:25:39
    window.onbeforeunload = function() { //这里放退出登录ajax,把异步关掉 } 直接放在页面中,关闭浏览器时,会自动调用该方法
  • 本文介绍webdriver中关于浏览器退出操作。driver中有两个方法是关于浏览器关闭,一个叫quit,一个叫close。先来看看看两者的声明描述,请看下面声明文档。/*** Close the current window, quitting the browser if ...
  • 在需要检测退出的页面上添加如下语句,来监测页面退出的事件 <script type="text/javascript"> //监测页面退出事件 window.onunload = function() { var url = "/project/user/demo1001"; $.pos...
  • 关闭浏览器退出账号的复杂处理

    千次阅读 2019-06-20 22:37:03
    关闭浏览器退出账号的复杂处理经典做法问题进一步问题需要注意问题 经典做法 众所周知,为了账户安全,用户未主动点击注销系统时,直接关闭浏览器或标签页强制退出系统的方法: // 关闭时调用注销接口 window....
  • 浏览器关闭实现系统退出功能 思路: 1.浏览器关闭的时候,发送请求到后台。删除在线用户表里的数据;可以根据sessionid来删除; 2.设置session的有效期 比如30分钟。写一个监听类 session超时的时候 会自动删在线...
  • 第 1 步:当登录进入网站时记录状态位loginStatus到cookie中,注意不要设置expires,这样cookie在会话期间有效,当关闭全部浏览器的时候会清除cookie。 setCookie('loginStatus', true); 第 2 步 :再次打开...
  • python UI自动化自动关闭浏览器学习记录 小白python自动化的第一天 之前都是看别人的文章 没想过自己也有记录学习的一天 不过成长嘛 总要有第一次 某天利用公司网站写自动化demo的时候 简简单单的写完 进主页找到...
  • 用了CAS,发现退出真是个麻烦事,退出后跳转到了CAS的注销页面,而且不关闭浏览器的话,其实并没有真的退出,输入地址仍是登陆状态。为了实现退出后登陆到跳转页面,做了以下配置: 1.server 端 修改src\main\webapp\...
  • vue关闭浏览器时,触发事件,执行退出登录接口** <template> <div id="app"> <router-view /> </div> </template> <script> export default { name: 'App', data() { ...
  • 今天小编就为大家分享一篇vue 关闭浏览器窗口的时候,清空localStorage的数据示例,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
  • 主要介绍了JS针对浏览器窗口关闭事件的监听方法,总结整理了几种常用的浏览器关闭事件监听方法,非常简单实用,需要的朋友可以参考下
  • var _beforeUnload_time = 0, _gap_time = 0; var is_fireFox = navigator.userAgent... //浏览器刷新 }); window.onbeforeunload = function() { _beforeUnload_time = new Date().getTime(); };
  • 关闭浏览器响应的js代码如下: 在head中调用js: window.onunload = function(){ if(self.screenTop > 9000) { Out(); } } 在body中添加js方法如下: function Out() { PageMethods.LogOut(GetResult);} ...
  • Session的cookie失效日期(1小时)(数字为秒数)需同时设置SESSION_SAVE_EVERY_REQUEST = True 和SESSION_EXPIRE_AT_...#关闭浏览器后使得cookie失效,每次打开浏览器需要重新登录 SESSION_EXPIRE_AT_BROWSER_CL
  • I use the following to handle the situation where Ctrl + C is used to terminate a running Python script.except KeyboardInterrupt:print "ABORTED"However, this also terminates my Selenium WebDriver brow...
  • 怎么实现用户退出功能,退出后按浏览器后退按钮,返回的是用户登录界面我登录功能是用strut1+spring做的,用户名密码用户名和密码都是直接用form属性传递的,很容易就实现登录功能了,现在我想实现,用户退出功能,...
  • 用谷歌浏览器登录网站后,关闭网站,在此打开后发现账户依旧是登录状态..查找后发现jsessionId没有被清除而且依旧是原来的那个jsessionid. 原因是浏览器被设置了 --> 从上次停下来地方继续,这样会默认保留...
  • 如果我有个php程序执行地非常慢,甚至于在代码中sleep(),然后浏览器连接上服务的时候,会启动一个php-fpm进程,但是这个时候,如果浏览器关闭了,那么请问,这个时候服务端的这个php-fpm进程是否还会继续运行呢?...
  • 前台: //当该页面被关闭之间触发该方法 ,在这个方法里面进行自己要的操作 window.onbeforeunload=function(){ alert("关闭浏览器"); } ...
  • 解决web应用用户退出系统后浏览器后退问题2011/11/3 8:13:46 oklook249900241 http://oklook249900241.iteye.com 我要评论(0)摘要:1.解决用户退出系统后,点击浏览器后退按钮,在用户登陆之前或者退出之后都不应该...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 125,388
精华内容 50,155
关键字:

关闭浏览器退出登录

友情链接: HotelReservationsystem.rar