window.onbeforeunload在Chrome中加载ajax请求
我有一个网页,通过Ajax处理机器的远程控制。 当用户离开页面时,我想自动从机器上断开连接。 所以这里是代码:
window.onbeforeunload = function () { bas_disconnect_only(); }
断开连接function只是发送一个HTTP GET请求到一个PHP服务器端脚本,它实际上是断开连接的工作:
function bas_disconnect_only () { var xhr = bas_send_request("req=10", function () { }); }
这在FireFox中工作正常。 但是使用Chrome,ajax请求根本不会被发送。 有一个不可接受的解决方法:向callback函数添加警报:
function bas_disconnect_only () { var xhr = bas_send_request("req=10", function () { alert("You're been automatically disconnected."); }); }
在添加警报呼叫之后,请求将成功发送。 但是,正如你所看到的,这根本不是一个真正的工作。
有人可以告诉我,如果这是可以实现与铬? 我在做什么看起来完全合法。
谢谢,
我遇到了同样的问题,Chrome浏览器没有向window.unload事件中的服务器发送AJAX请求。
如果请求是同步的,我只能使它工作。 我能够做到这一点与JQuery和asynchronous属性设置为false :
$(window).unload(function () { $.ajax({ type: 'GET', async: false, url: 'SomeUrl.com?id=123' }); });
上面的代码适用于IE9,Chrome 19.0.1084.52米和Firefox 12。
我知道这个问题刚才被问到,而我要说的是与更新版本的Chrome相关,但是我认为这可能对许多开发者有帮助。
就像@Garry English 所说的那样 ,在页面onunload期间发送asynchronous请求将不起作用,因为浏览器在发送请求之前会杀死线程。 发送同步请求应该可以工作。
这是正确的,直到Chrome的第29版,但在Chrome V 30它突然停止工作, 如这里所述 。
看来今天做这个的唯一方法就是使用这里所build议的onbeforeunload事件。
但注意:其他浏览器不会让你在onbeforeunload事件中发送Ajax请求。 所以你需要做的是在卸载和beforeunload中执行这个操作,并检查它是否已经发生。
像这样的东西:
var _wasPageCleanedUp = false; function pageCleanup() { if (!_wasPageCleanedUp) { $.ajax({ type: 'GET', async: false, url: 'SomeUrl.com/PageCleanup?id=123', success: function () { _wasPageCleanedUp = true; } }); } } $(window).on('beforeunload', function () { //this will work only for Chrome pageCleanup(); }); $(window).on("unload", function () { //this will work for other browsers pageCleanup(); });
希望这可以帮助任何人。
检出为此目的而构build的Navigator.sendBeacon()方法。
MDN页面说:
navigator.sendBeacon()方法可用于将小型HTTP数据从用户代理asynchronous传输到Web服务器。
此方法解决了分析和诊断代码的需求,通常在卸载文档之前尝试将数据发送到Web服务器。 任何时候发送数据都可能导致错过收集数据的机会。 但是,确保在卸载文档的过程中发送数据是开发人员传统上难以做到的事情。
这是一个相对较新的API,似乎还没有被IE支持。
尝试创build一个variables(最好是布尔值),并在得到来自Ajax调用的响应后进行更改。 并将bas_disconnect_only()
函数放在while循环中。 我也曾经有过这样的问题。 我认为这是因为Chrome不会等待Ajax调用。 我不知道我是如何修复的,而且我还没有试过这个代码,所以我不知道它是否有效。 这是一个例子:
var has_disconnected = false; window.onbeforeunload = function () { while (!has_disconnected) { bas_disconnect_only(); // This doesn't have to be here but it doesn't hurt to add it: return true; } }
并在bas_send_request()
函数内( xmlhttp是HTTP请求):
xmlhttp.onreadystatechange = function() { if (xmlhttp.readyState == 4 && xmlhttp.status == 200) has_disconnected = true; }
祝你好运,我希望这有助于。