如何区分浏览器刷新和窗口关闭？

区分刷新和关闭浏览器操作

确定刷新页面和关闭浏览器之间的区别似乎具有挑战性，因为这两个操作都会触发ONUNLOAD 事件。不过，这个难题有一个解决方案。

解决方案：

此方法利用 HTML5 本地存储和服务器客户端通信：

1. ONUNLOAD 处理程序： 在页面上，使用伪 JavaScript 将卸载处理程序添加到窗口：

   <code class="javascript">function myUnload(event) {
       if (window.localStorage) {
           window.localStorage['myUnloadEventFlag'] = new Date().getTime();
       }
       askServerToDisconnectUserInAFewSeconds(); // Synchronous AJAX call
   }</code>

   登录后复制

   此函数：

   • 将页面标记为正在本地存储中卸载。
   • 异步通知服务器在几秒钟内断开用户连接。

2. ONLOAD 处理程序: 在主体上，添加一个加载处理程序：

   <code class="javascript">function myLoad(event) {
       if (window.localStorage) {
           var t0 = Number(window.localStorage['myUnloadEventFlag']);
           if (isNaN(t0)) t0 = 0;
           var t1 = new Date().getTime();
           var duration = t1 - t0;
           if (duration < 10 * 1000) {
               // Browser reload
               askServerToCancelDisconnectionRequest(); // Asynchronous AJAX call
           } else {
               // Tab/window close
               // Perform desired actions (e.g., do nothing)
           }
       }
   }</code>

   登录后复制

   此函数：

   • 检查自上次卸载事件以来的时间差。
   • 如果过去的时间少于 10 秒，则为浏览器重新加载。
   • 如果过去的时间超过 10 秒，则为选项卡/窗口关闭。
3. 服务器交互：在服务器上，维护断开连接请求列表并使用计时器线程检查该列表。在超时（例如 5 秒）后处理断开连接请求，并在收到时处理取消请求。

此解决方案适用于区分选项卡/窗口关闭、重新加载操作、关注的链接和提交的表单。它适用于支持 HTML5 本地存储的浏览器。但请注意，它依赖于卸载事件，并且可能与 MSIE7 等旧版浏览器不兼容。

以上是如何区分浏览器刷新和窗口关闭？的详细内容。更多信息请关注PHP中文网其他相关文章！