问题描述：今天接到个之前没处理过的需求，就是给网站的所有页面做埋点，在页面离开的时候讲此页面的编码和页面中点击了哪些按钮的信息传给后台。
有点蒙蔽
第一步：这个需求我首先要保证的是在确定在页面离开的时候要绑定的事件，经过一通百度找到了两个离开的事件：分别是onunload和onbeforeunload,首先讲一下他们两个的区别
1.onunload 是在浏览器已经获取到了下一个页面的内容，即将要替换当前页面的时候。
2.onbeforeunload是在浏览器即将向浏览器请求下一个页面的时候
onbeforeunload在onunload之前发生，onunload是无法阻止页面的更新和关闭的，而 onbeforeunload 可以做到。所以我选择了onbeforeunload这个事件。onbeforeunload有以下两种使用方法：
1.window.onbeforeunload=function(){
return '提示信息'// 这时会出现一个确认框，问你是否要离开，里面的内容就是你自己的提示信息
}
2.window.onbeforeunload=function(){
functionName（）// 在离开之前执行我们想做的操作，执行完成页面才会离开
}
显然我选择了第二种方法
第二步：找到了事件钩子，我们就该想办法在离开之前掉接口了。我首先试了下ajax的jsonp (没办法老项目用的就是这些，框架还是jquery，我也很委屈)。结果发现 状态不是期望中的200，而是canceled。。。说明接口并没有成功发出页面就跳转了，好的有一个坑出现了。（对了跟大家说个小技巧，谷歌的调试工具，默认情况下在页面跳转的时候console和network 这两栏都会刷洗没法看到之前页面的输出与接口信息，但是谷歌都提供了相应的设置看下图中的画√的地方都有preserve选项）
之后又是一通百度，发现如果在这个地方用异步的ajax的话那浏览器在你掉接口之后不管你的接口是在waiting还是connecting还是已经调用成功并返回了数据，浏览器都会直接跳到另一个页面。跟据event loop的原理分析大概的原因就是因为你跳到了另一个页面原来的event loop就会销毁，那原来的异步队列也就给销毁了。所以请求就会被终止了。所以在这里我们就不能在用异步的ajax了，应该用同步的ajax（是不是很陌生。。。啊哈哈）
其实就是把async：true；改成false就变成同步了，这样只有把这个请求执行完了才会执行$.ajax(){}这段代码后面的内容。有点类似于es6中的await的意思。然后这里提醒下，这个坑解决的时候我又发现jsonp这种跨域方式，不支持同步，不过正常其他跨域方式（服务器代理，cros等）下用post或者get都是可以的（fetch没试过还。。。）这样就完美解决了我的问题。
头一次写技术文章内容有点乱，接受批评讨论。估计这问题也不会有太多人看到···哈哈哈。自娱自乐吧。
欢迎交流微信：hellowzhenganlin
网友评论