zoukankan      html  css  js  c++  java
  • 关闭页面向后台发送消息

    场景描述

    场景描述:在用户刷新页面或者关闭页面的时候,前端要给后台发一条请求,释放该页面的授权占用。
    

    最初的代码

    window.addEventListener("beforeunload", () => {
    let oReq = new XMLHttpRequest();
    oReq.open("POST", "http://127.0.0.1:8080/exit");
    oReq.send(JSON.stringify({name: "南风晚来晚相识"}));
    

    经过测试

    刷新页面时基本满足需求(偶尔也会有后台接收不到请求的现象,但概率很低)
    关闭页面时,后台接收不到请求
    哦豁,尴尬了
    
    navigator.sendBeacon() 
    这个方法主要用于满足统计和,
    这些代码通常尝试在卸载(unload)文档之前向web服务器发送数据
    使用方式: navigator.sendBeacon(url, data);
    说明:
    url 参数表明 data 将要被发送到的网络地址。
    data 参数是将要发送的 ArrayBufferView 或 Blob 、DOMString 或者 FormData 类型的数
    
    返回值
    当用户代理成功把数据加入传输队列时,sendBeacon() 方法将会返回 true,否则返回 false
    

    使用navigator.sendBeacon()

     window.addEventListener("beforeunload", (e) => {
        const data = {name: "南风晚来晚相识"};
        window.navigator.sendBeacon("http://127.0.0.1:8080/exit", JSON.stringify(data));
    });
    
    
    作者:明月人倚楼
    出处:https://www.cnblogs.com/IwishIcould/

    想问问题,打赏了卑微的博主,求求你备注一下的扣扣或者微信;这样我好联系你;(っ•̀ω•́)っ✎⁾⁾!

    如果觉得这篇文章对你有小小的帮助的话,记得在右下角点个“推荐”哦,或者关注博主,在此感谢!

    万水千山总是情,打赏5毛买辣条行不行,所以如果你心情还比较高兴,也是可以扫码打赏博主(っ•̀ω•́)っ✎⁾⁾!

    想问问题,打赏了卑微的博主,求求你备注一下的扣扣或者微信;这样我好联系你;(っ•̀ω•́)っ✎⁾⁾!

    支付宝
    微信
    本文版权归作者所有,欢迎转载,未经作者同意须保留此段声明,在文章页面明显位置给出原文连接
    如果文中有什么错误,欢迎指出。以免更多的人被误导。
  • 相关阅读:
    图灵机器人,web录音实现自动化交互问答
    人工智能初识,百度AI
    flask web 表单验证 WTForms
    websocket的原理
    DBUtils
    【hdu4704】 Sum——费马小定理+快速幂取模
    【hdu3037】Saving Beans——组合数取模
    【SRM15】题解
    【模板】快速幂取模
    【模板】线性筛法求素数
  • 原文地址:https://www.cnblogs.com/IwishIcould/p/15161308.html
Copyright © 2011-2022 走看看