关闭微信页面/判断设备/判断浏览器

最新推荐文章于 2022-09-22 14:15:06 发布
原创 最新推荐文章于 2022-09-22 14:15:06 发布 · 803 阅读 · 1 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。 

//判断是否在微信浏览器打开
function isWeiXin() {
    var ua = window.navigator.userAgent.toLowerCase();
    if (ua.match(/MicroMessenger/i) == 'micromessenger') {
        return true;
    } else {
        return false;
    }
}
//判断设备
if (/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)) {
    console.log("苹果");
} else if (/(Android)/i.test(navigator.userAgent)) { 
 	console.log("Android");
} else {    console.log("pc");};
//关闭微信浏览器**正常关闭页面的兼容写法不支持微信页面
$(".buton").click(function(){
    WeixinJSBridge.call('closeWindow');
})
javaScript --- 解决（webview/微信浏览器/页面刷新/页面后退/URL重置页面刷新）AJAX页数重置问题
删库跑路
08-03 1685
效果如下： 代码如下： <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8" /> <meta name="viewport&am
H5关闭当前页面，包括微信浏览器
每天都要努力学习哦~~
10-27 6398
用户代理字符串是浏览器发送给服务器的一部分信息，其中包含了关于浏览器类型和版本的信息。这段代码是一个JavaScript函数，用于关闭当前页面的操作。window.close()方法只能关闭由window.open()或者浏览器直接输入url打开的页面，其余情况安全考虑是被限制的。时，浏览器会关闭最前面的窗口，无论是不是你的脚本创建的这个窗口。的值为 "close_window:ok"，表示关闭成功，会打印"关闭成功的处理"。作为参数，以及一个回调函数，用于处理关闭窗口的结果。的值来判断关闭窗口的结果。
微信浏览器关闭代码
10-03
微信浏览器关闭html代码
移动端判断函数（环境判断、兼容关闭浏览器）
Winsom1的博客
09-22 457
_isMobile() { let flag = navigator.userAgent.match(/(phone|pad|pod|iPhone|iPod|ios|iPad|Android|Mobile|BlackBerry|IEMobile|MQQBrowser|JUC|Fennec|wOSBrowser|BrowserNG|WebOS|Symbian|Windows Phone)/i) return flag; }, i..
监听页面关闭和刷新的总结
weixin_30911809的博客
04-23 580
　　做开发的一个很重要的能力就是异常场景处理。而页面的一个很常见的异常场景就是页面关闭和刷新，尤其是对于需要即时刷新、定时操作、自动提交的场景。而我们应该都知道，监听浏览器页面关闭和刷新的一个很常用的事件就是onbeforeunload和onload（两者作用其实是一样的，就像vue生命周期勾子destroyed和beforeDestroy），而做前端开发的这4年，几乎每年都会用到那么几次。只是有...
判断是页面否为微信打开
思渝崖
05-20 1337
场景： 做微信分享功能时 有个需求说要做用户记录跟踪，需要获取用户的openId传给接口存储 基于这个openId的获取需求，需要做微信静默授权才能获取到这个openId 但是这个静默授权有个问题： 如果不是微信打开这个页面，会报需要微信打开的一个报错提示，整个页面只能在微信打开 最后就是要判断这个页面是否在微信打开： export const isWeixin = () => { let ua = navigator.userAgent.toLowerCase() return ua.ind
微信判断浏览器自动弹出遮罩层代码
01-13
标题"微信判断浏览器自动弹出遮罩层代码"涉及到的核心知识点包括： 1. **浏览器检测**：首先，我们需要通过JavaScript来检测当前的浏览器环境。常见的方法是检查UserAgent字符串，微信内置浏览器的UserAgent通常...
vue实现微信浏览器左上角返回按钮拦截功能
10-15
主要介绍了vue实现微信浏览器左上角返回按钮拦截功能,本文通过实例代码相结合的形式给大家介绍的非常详细，具有一定的参考借鉴价值，需要的朋友可以参考下
Javascript限制网页只能在微信内置浏览器中访问
10-25
通过正则表达式来判断UserAgent字符串是否包含“MicroMessenger”，如果匹配成功则表示该请求来自微信内置浏览器，允许加载页面；如果匹配失败，则通过弹窗提示用户，并且关闭页面，防止页面内容被不正当访问。 但...
微信页面监听返回事件，关闭页面
rainbow8300的博客
10-25 9263
pushHistory(); window.addEventListener("popstate", function(e) { //alert("我监听到了浏览器的返回按钮事件啦");//根据自己的需求实现自己的功能 //alert('guanbi'); WeixinJSBridge.call('clos
微信内嵌H5 监听用户返回离开页面
Dong8508的博客
04-03 5689
使用场景：保存用户填写部分资料的时候，需要判断用户离开，提示是否保存操作 this.pushHistory(); window.addEventListener("popstate", function(e) { //do something console.log("我监听到页面离开了") }，false); ...
如何通过js关闭微信浏览器页面
热门推荐
This Is Why We Coding
03-09 1万+
最近在项目开发中，有一个支付页面当用户支付成功的时候需要通过js主动关闭这个页面。这个在其他浏览器比较好实现直接用window对象中的api就可以 如何通过js关闭微信浏览器页面 最近在项目开发中，有一个支付页面当用户支付成功的时候需要通过js主动关闭这个页面。这个在其他浏览器比较好实现直接用window对象中的api就可以。具体的代码： window.opener = null; win...
微信公众号开发--js关闭浏览器回到公众号对话窗口
Kuroko's Development Notes
05-23 2274
直接调用微信提供的接口即可： WeixinJSBridge.call('closeWindow'); ps: 在微信开发者工具中可能会报错，提示该方法不被支持，不过在手机上该方法是没毛病的！  ...
调用微信浏览器关闭页面的功能
weixin_43837268的博客
06-26 5170
pushHistory(); window.addEventListener("popstate", function(e) { alert("我监听到了浏览器的返回按钮事件啦");//根据自己的需求实现自己的功能 weixinClosePage() }, false); function pushHistory() { var state = { t...
*微信开发内置浏览器JS自动关闭当前页面回到微信对话窗口
西瓜的博客
01-26 1万+
微信的WeixinJSBridge还是没牛逼的，虽然官方文档只公布了3个功能，但是还内置的很多功能没公布，但是存在 比如自动关闭当前浏览器内置函数：WeixinJSBridge.call('closeWindow'); 直接调用即可。 转自：http://blog.youkuaiyun.com/muziduoxi/article/details/22403859 ...
visibilitychange事件判断当前页面——可见性的状态
weixin_30892037的博客
06-05 403
原文：http://www.webhek.com/page-visibility/ document.hidden 这个新出现的document.hidden属性，它显示页面是否为用户当前观看的页面，值为ture或false。 document.visibilityState visibilityState的值要么是visible(表明页面为浏览器当前激活tab，而且窗口不是最小化状态)...
移动端IOS微信浏览器监听页面关闭
最新发布
11-25
<think> 嗯，用户需要解决在移动端iOS微信浏览器中监听页面关闭的方法。参考了三个引用内容，需要综合这些信息给出解决方案。 用户可能正在开发一个需要保存用户进度的学习类应用，在iOS微信环境中遇到页面关闭事件监听失效的问题。从引用内容看，用户已经尝试过window.onbeforeunload但发现iOS上无效，这确实是iOS的常见限制。 引用1指出iOS无法通过传统方法监听关闭事件，引用2提供了监听返回按钮的替代方案，引用3则给出实际可用的技术方案。核心解决方案应该是结合pagehide事件和sendBeacon方法，因为： 1. iOS微信对beforeunload/unload事件支持不完善，但pagehide事件更可靠 2. sendBeacon能解决异步请求被阻塞的问题，特别适合发送关键数据 3. 需要额外处理微信后台运行的情况，通过visibilitychange事件补充 可能还需要提醒用户注意数据去重问题，因为pagehide在微信后台切换时也会触发。另外要强调服务端需兼容sendBeacon的POST请求格式。 用户似乎有一定前端基础，但可能不熟悉微信环境的特殊限制。可以补充说明iOS的限制原理：微信浏览器基于WKWebView，而iOS会冻结后台页面的js执行。sendBeacon是专为这种场景设计的低优先级API，即使页面关闭也能保证请求发出。 </think>在移动端iOS微信浏览器中监听页面关闭的实现方法如下（综合最新实践方案）： ### 核心解决方案 1. **监听 `pagehide` 事件** iOS微信浏览器中，`beforeunload`/`unload` 事件不可靠，需改用 **`pagehide`** 事件： ```javascript window.addEventListener('pagehide', function(event) { if (event.persisted === false) { // 页面完全关闭时发送数据 sendCloseData(); } }); ``` 2. **使用 `navigator.sendBeacon()` 发送数据** 解决异步请求被阻塞的问题（兼容iOS微信）： ```javascript function sendCloseData() { const data = JSON.stringify({ action: 'saveProgress', time: Date.now() }); const url = 'https://api.example.com/save'; navigator.sendBeacon(url, data); // 可靠的数据发送 } ``` 3. **补充监听微信后台切换** 处理用户将微信切换到后台的情况： ```javascript document.addEventListener('visibilitychange', function() { if (document.visibilityState === 'hidden') { navigator.sendBeacon(url, JSON.stringify({type: 'background'})); } }); ``` ### 完整实现代码 ```javascript // 监听页面关闭/隐藏事件 const saveProgress = () => { const data = { progress: localStorage.getItem('studyProgress'), timestamp: new Date().toISOString() }; navigator.sendBeacon('/api/save', JSON.stringify(data)); }; // 主监听逻辑 window.addEventListener('pagehide', (event) => { if (!event.persisted) saveProgress(); }); document.addEventListener('visibilitychange', () => { if (document.visibilityState === 'hidden') saveProgress(); }); // 兼容传统浏览器（可选） window.onbeforeunload = () => { saveProgress() }; ``` ### 关键说明 1. **`event.persisted`** 判断 `false` 表示页面完全关闭（非缓存），此时必须保存数据[^1] 2. **`sendBeacon` 优势** - 异步发送不阻塞页面关闭 - 支持跨域请求 - iOS微信兼容性验证有效[^3] 3. **数据持久化** 建议先用 `localStorage` 实时保存进度，关闭时仅发送最后状态 ### 注意事项 1. **服务端配置** `sendBeacon` 默认以 `text/plain` 发送，服务端需支持： ```http POST /api/save HTTP/1.1 Content-Type: text/plain ``` 2. **数据大小限制** 单次发送数据不宜超过 64KB 3. **微信浏览器特性** 当用户强制关闭微信时，可能有 3-5 秒延迟触发事件[^1] ---
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值