JavaScript当页面关闭时向后台发送请求
今天做项目时遇上一个需求,当浏览器或页面关闭时将数据存储到数据库内。实现思想是采用js监测onunload然后发送请求。结果失败,刷新可以发送但是关闭并不能,整了一整天并没有解决,最后找到了解决办法。
先贴个能实现功能的方法:
function saveStatus(){
/*结束时保存设备状态*/
window.onbeforeunload=function(){//必须使用beforeunload
var url ="device_saveDeviceStatus";
$.ajax({
url:url,
async:false //必须采用同步方法
});
}
}
saveStatus();
接下来来解释一下:
1.一开始的想法是采用onunload方法,但最后经过查询,需要使用onbeforeunload方法。它们之间的区别在于:onbeforeunload是正要去服务器读取新的页面时调用,此时还没开始读取;而onunload则已经从服务器上读到了需要加载的新的页面,在即将替换掉当前页面时调用。onunload是无法阻止页面的更新和关闭的。而 onbeforeunload 可以做到。
2.在发送请求上,一开始采用简单的$.post(),但是$.post()是异步的方法,不行。为什么这里不能采用异步方法呢?我的理解是,如果采用异步方法,那么浏览器会在方法成功发送并响应前先unload,从而导致请求丢失。如果采用的是同步方法,浏览器就会等待请求成功,然后再unload。按照这个理解,如果采用异步方法发送后,再采用alert()进行拦截等待,应该也是可以的,只是这个方法太影响体验,所以抛弃。
附:提供一个替代的想法,在j2ee开发中,可以采用监听器监听session的销毁事件,达到类似的效果。
JavaScript当页面关闭时向后台发送请求的更多相关文章
- android下socket编程问题:服务器关闭时,客户端发送请求的异常处理
我用socket分别创建了一个服务器和一个客户端. 当服务器程序运行时,客户端和服务器发送接收数据是OK的. 但是,如果服务器程序关闭以后,客户端仍然发送请求的话,会抛出一个IOException.但 ...
- 怎样在页面关闭时发起HTTP请求
比如有需求是要让页面关闭时, 在数据库中记录用户的一些数据或log日志. 这时就需要在用户关闭页面时发起HTTP请求. 做法是对window.onunload设置事件监听函数, 在函数内发起AJAX请 ...
- Javascript实现页面滚动时导航智能定位
遇到的问题: 在做官网的时候,需要滚动定位的区块的图片不确定,无法确定用户浏览区域对应的模块导航 之前的解决方案是: 通过定位滚动条的位置来判断用户浏览区域对应的模块导航,这种方法的弊端是,区块的高度 ...
- java后台发送请求并获取返回值(续)
在java后端发送请求给另一个平台,从而给前端实现 "透传"的过程中,出现:数据请求到了并传到了前端,但是控制台打印时中文显示Unicode码而前端界面中中文显示不出来!!!开始怀 ...
- java后台发送请求并获取返回值
项目中需要前端发送请求给后端,而后端需要从另一个平台中取数据然后再透传给前端,通过下述代码将其实现.在此记录一下. package com.autotest.utils; import java.io ...
- A页面调到B页面,B页面关闭时A页面刷新
// A.html <html> <head> <script type="text/javascript"> alert("refr ...
- 使用ajax向后台发送请求跳转页面无效的原因
Ajax只是利用脚本访问对应url获取数据而已,不能做除了获取返回数据以外的其它动作了.所以浏览器端是不会发起重定向的. 1)正常的http url请求,只有浏览器和服务器两个参与者.浏览器端发起一个 ...
- javascript基础(七):js发送请求
GET请求 $.get("/api/v1.0/user",function(resp){ // 用户未登录 if ("4101" == resp.errno) ...
- iframe与src一个性质 当js中修改了src的值后会重新向后台发送请求 ;为了防止浏览器缓存问题 当我们修改src时候 需要添加不同的值 这样浏览器就不会从缓存中取值 而是重新发起后台请求
随机推荐
- 自己开发轻量级ORM(二)
上一篇简单的对轻量级ORM开发开了个头.这篇主要聊下ORM框架的设计思路. ORM本质上是对数据库操作的抽象.大体上我将其分为对数据结构的抽象和对执行方法的抽象. 我的ORM设计图: ORM框架需要完 ...
- 内功心法 -- java.util.ArrayList<E> (3)
写在前面的话:读书破万卷,编码如有神--------------------------------------------------------------------下文主要对java.util ...
- 源码(07) -- java.util.Iterator<E>
java.util.Iterator<E> 源码分析(JDK1.7) ----------------------------------------------------------- ...
- getstyle() 获取样式
问题:在js动画中,如果元素设置了border,padding等,获取到的样式是盒子的样式,这样会影响动画的正常显示. 解决方案一:在元素的行内添加样式 如 <div style=" ...
- i++;++i的区别
看代码! public class Test1 { //i++和++i的区别 int z; public static void main(String args[]){ int i ; int j ...
- 各类编译器 allocator 底层
我们在c++中创建数组通常使用new来分配我们需要的内存大小,之后通过delete进行释放内存 但是我们调用new的时候,通过调用的是operator new,二operator new调用的是mal ...
- ASP.NET Core中的缓存[1]:如何在一个ASP.NET Core应用中使用缓存
.NET Core针对缓存提供了很好的支持 ,我们不仅可以选择将数据缓存在应用进程自身的内存中,还可以采用分布式的形式将缓存数据存储在一个“中心数据库”中.对于分布式缓存,.NET Core提供了针对 ...
- mybatis进阶--一对一查询
所谓的一对一查询,就是说我们在查询一个表的数据的时候,需要关联查询其他表的数据. 需求 首先说一个使用一对一查询的小需求吧:假设我们在查询某一个订单的信息的时候,需要关联查询出创建这个订单对应的用户信 ...
- VMware上安装MS-DOS 6.22之一:基本系统的安装
在网上看了一遍,发现关于在VMware上安装DOS的教程比较少,并且还有很多人发问怎么在VMware上安装DOS.为了方便大家,我便把我实际安装DOS的步骤讲出来分享一下,当然这其中也参考了一些网上资 ...
- STL源码剖析(读书笔记)
STL迭代器种类 2. 迭代器型别使用范例: 3. SGI STL空间配置器分为两级: 4. Vector 的内部存储方式为数组,随机访问迭代器. 5. Vector的size获取方式: 6. Vec ...