Open App.png
老大让研究一个新功能，H5页面内点击唤醒APP，开始了艰苦的长途跋涉，一步一个坑！！！
1、该如何唤醒APP；
2、如何检测是否有APP；
看看前辈们是怎么做的，唤醒APP，研究发现，可以通过类似于url的形式跳转来唤醒APP，在原生中被命名为schema协议，
taobao://m.taobao.com //淘宝的唤醒地址
咦，手机上有淘宝，地址也配好了，走起试一下（安卓），打开了，以为全世界都亮了，才发现只是一点星星之火，借鉴前辈们的解决方案，发现不能检测到手机内有没有安装APP，唤醒存在各种兼容性问题，主流的使用两种方法，核心思想是点击唤醒按钮，进行跳转，如果能进行跳转则跳转，否则跳转到下载页面。
1、动态创建iframe标签 （安卓解决方案）
var ifa = document.creatElement('iframe');
ifa.src = url; //APP的schema协议
ifa.style.display = 'none';
setTimeout(function(){
document.body.removeChild(ifa);
window.location.href = 'download.html' //APP下载页
},1000)
通过动态生成iframe标签的这种方案，在ios9+里没有响应；
2、window.location.href跳转 （IOS解决方案）
window.location.href = url; //APP的schema协议
setTimeout(function(){
window.location.href = 'download.html' //APP下载页
},2000)
IOS系统上安装APP，提示弹框，打开APP，当手机里未下载APP，safari会提示错误链接，默认2秒后跳转下载页（系统弹框无法避免）；
当切换到app返回到H5页面发现仍然跳转到了下载页面，该怎么办
visibilitychange H5新出的接口 判断页面状态 主要是为了游戏开发人员，在我们玩游戏的过程中，我们会因为信息、电话等问题退出游戏页面，使其进入后台，这个时候判断进入此状态，暂停游戏。目前除了safari不支持，其他浏览器都支持。
https://developer.mozilla.org/zh-CN/docs/Web/Events/visibilitychange API文档
document.addEventListener('visibilitychange webkitvisibilitychange',function(){
var tag = document.hidden || document.webkitHidden;
tag ? clearTimeout(timer):'';
})
window.onpagehide = function(){
clearTimeout(timer);
}
微信内不能唤醒APP的，微信将schema协议进行屏蔽，只对合作伙伴进行白名单开放.
写的不好的地方还望大家及时反馈与纠正，本着共同学习与进步宗旨不断前进！！！
网友评论