Javascript 如何等待浏览器在卸载时发送图像请求？

我们正在用javascript监控我们的用户行为，以改善我们网站的用户体验

Javascript代码

$("html").bind("mousedown", function(e) {
     var img = new Image(); 
     img.src="http://monitor.example.com/track.gif?x="+e.pageX+"&"+e.pageY});

我使用image标记来避免跨域问题。除以下情况外，它工作正常

场景：

点击锚

提交表格

窗口重新加载

---

如何解决此问题？

页面将在图像有机会下载之前消失-页面刷新/发布/链接单击的速度通常比下载图像的速度更快

建议您同步执行对图像（或者任何URL）的请求，可能使用AJAX调用。然后，在映像完成下载后，执行将继续，而不是并行执行并导致当前看到的竞争条件。假设您可以控制远程服务器，则可以使用

如果CORS不是一个选项（您无法控制远程服务器），则可以使用

curl

或编程语言中的类似工具在服务器上同步调用服务器端脚本，该脚本调用远程服务器上的映像，因为在服务器端没有跨源限制

#try this code
var monitor = function(e) {
     var img = new Image(); 
     img.src="http://monitor.example.com/track.gif?x="+(e.pageX || 'null')+"&y="+(e.pageY || 'null');
};

# reload page
$(document).bind("beforeunload", monitor);

# mouse down global
$(document).bind("mousedown", "*", monitor);

---

另外，需要修改此项，因为页面刷新不会发送pageX pageY

请尝试此操作，为什么不使用src创建脚本标记？这里有很多信息，你能告诉我为什么我被否决吗？我总是渴望听到如何改进我的答案。谢谢。这在卸载之前是不可能的，除了80%的1x图像将在页面关闭之前下载（谷歌就是这么做的）是的，这就是为什么我称之为竞争条件-它可能会及时下载，但要确保在执行图像请求时需要阻止主请求。不知道为什么OP在重新加载页面之前也需要这样做（比如F5没有鼠标下移，在重新加载之前的任何其他点都不可能这样做），但我的解决方案肯定适用于表单发布和链接单击。