微信h5网页监听关闭事件onunload，onbeforeunload，pagehide没有用的解决办法

首先请原谅我折腾了很久，所以才要记下来。

我的需求是用户在h5直播间关闭网页时，监听关闭事件，然后异步发送一条消息给后台，此人已经离开。

onunload， 关闭网页触发

onbeforeunload，关闭网页及onunload回调前触发

pagehide，同onunload，适用于高版本的ios系统，我是苹果6，10.0以上系统

一，先发ios平台解决方案

window.addEventListener('pagehide', function () {

console.log('页面要关闭了');

$.ajaxSettings.async = false; //同步请求，防止页面还没执行post请求就关闭页面了

$.post("url",{},function(data){

},'json')

});

上面标红色是的重点

 

二，安卓处理解决方案

window.onunload = function () {

console.log('页面要关闭了:onunload');

$.post("url",{},function(data){

},'json')

localStorage.setItem('isOut', true)

}

说明：蓝色是调试方法，用alert()会失效，也不要想着用return;用console.log在日志打印时会一闪就过去了，

说明方法是执行了，如果一定确定有没有执行，就用localStorage.setItem('isOut', true)

查看一下localStorage 里面变量有没有增加

——————————————————————————————————

以下是一些尝试，可能对你有所启发：

if (window.addEventListener) {
        window.addEventListener("onunload", function () {
            console.log('页面要关闭了:onunload');
         // do something
         $.post("url",{},function(data){
             
         },'json')
        })
      } else if (window.attachEvent) {
        // 主要是为了兼容老的IE
        window.attachEvent('onpagehide', function () {
          // do something
          $.post("url",{},function(data){
             
         },'json')
        })
      } else {
        window.onbeforeunload = function () {
          // do something
           console.log('页面要关闭了:onunload');
          $.post("url",{},function(data){
             
         },'json')
        }

 

实践得知：

onunload在安卓手机有效果，不用设置异步请求为同步。

pagehide在ios中有用，但如果有异步请求，最好改成同步

 

希望有帮到你，现在是凌晨3：00，如果点赞不麻烦您的话，请不要吝惜。

 

这是我的博客：http://www.taoxtao.cn/archives/2280