zoukankan      html  css  js  c++  java
  • JavaScript当页面关闭时向后台发送请求

    今天做项目时遇上一个需求,当浏览器或页面关闭时将数据存储到数据库内。实现思想是采用js监测onunload然后发送请求。结果失败,刷新可以发送但是关闭并不能,整了一整天并没有解决,最后找到了解决办法。

    先贴个能实现功能的方法:

     1 function saveStatus(){
     2     /*结束时保存设备状态*/
     3     window.onbeforeunload=function(){//必须使用beforeunload
     4         var url ="device_saveDeviceStatus";
     5         $.ajax({
     6             url:url,
     7             async:false                //必须采用同步方法
     8         });
     9     }
    10 }
    11 saveStatus();

    接下来来解释一下:

      1.一开始的想法是采用onunload方法,但最后经过查询,需要使用onbeforeunload方法。它们之间的区别在于:onbeforeunload是正要去服务器读取新的页面时调用,此时还没开始读取;而onunload则已经从服务器上读到了需要加载的新的页面,在即将替换掉当前页面时调用。onunload是无法阻止页面的更新和关闭的。而 onbeforeunload 可以做到。

      2.在发送请求上,一开始采用简单的$.post(),但是$.post()是异步的方法,不行。为什么这里不能采用异步方法呢?我的理解是,如果采用异步方法,那么浏览器会在方法成功发送并响应前先unload,从而导致请求丢失。如果采用的是同步方法,浏览器就会等待请求成功,然后再unload。按照这个理解,如果采用异步方法发送后,再采用alert()进行拦截等待,应该也是可以的,只是这个方法太影响体验,所以抛弃。

      附:提供一个替代的想法,在j2ee开发中,可以采用监听器监听session的销毁事件,达到类似的效果。

    作者: 薄峰
    出处: http://www.cnblogs.com/qbzf-Blog/
    本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则保留追究法律责任的权利。
  • 相关阅读:
    JAVA8 之 Stream 流(四)
    关于iphone 6s 页面功能不能正常使用问题
    关于ES6语法的 一些新的特性
    微信授权一直跳转
    js 一道题目引发的正则的学习
    关于this在不同使用情况表示的含义
    详细解析arry.map() ,function.apply() 方法
    关于服务器无法在已发送http表头之后设置状态问题
    七牛上传视频并转码
    使用 v-cloak 防止页面加载时出现 vuejs 的变量名
  • 原文地址:https://www.cnblogs.com/qbzf-Blog/p/6341301.html
Copyright © 2011-2022 走看看