判断是否安装某款app?
原理:
- 技术中
没有某个参数去判断是否存在app。 - 利用延时器原理:超过
指定时间未打开app,则该判断手机未安装该app
如果是在微信浏览器打开h5页面,域名未加入到 `微信白名单` 中,则必须切换到 `浏览器` 中才能打开
/**
* 判断是否安装app
* @url ios,android 提供(打开app的链接)
* @callback (未安装app的回调)
* */
function openApp(url, callback) {
let {isAndroid, isIOS, isIOS9} = judgePhoneType();
if(isWeiXin()){
alert("请您在浏览器中打开,即可下载") ;
return ;
}
if (isAndroid || isIOS) {
let hasApp = true, t = 1000,
t1 = Date.now(),
ifr = document.createElement("iframe");
setTimeout(function () {
if (!hasApp) {
callback && callback()
}
document.body.removeChild(ifr);
}, 2000);
ifr.setAttribute('src', url);
ifr.setAttribute('style', 'display:none');
document.body.appendChild(ifr);
setTimeout(function () { //启动app时间较长处理
let t2 = Date.now();
if (t2 - t1 < t + 100) {
hasApp = false;
}
}, t);
}
if (isIOS9) {
location.href = url;
setTimeout(function () {
callback && callback()
}, 250);
setTimeout(function () {
location.reload();
}, 1000);
}
}
唤端媒介 URL Scheme
我们的手机上有许多私密信息,联系方式、照片、银行卡信息...我们不希望这些信息可以被手机应用随意获取到,信息泄露的危害甚大。所以,如何保证个人信息在设备所有者知情并允许的情况下被使用,是智能设备的核心安全问题。 对此,苹果使用了名为 沙盒 的机制:应用只能访问它声明可能访问的资源。但沙盒也阻碍了应用间合理的信息共享,某种程度上限制了应用的能力。 因此,我们急需要一个辅助工具来帮助我们实现应用通信, URL Scheme 就是这个工具。
格式
[scheme:][//authority][path][?query]
协议:域名/参数
例如: com.qdxxzy.user://shihaoo.com?type=xxx
const CONFIG = {
android: 'https://a.app.qq.com/o/simple.jsp?pkgname=com.xiaoxiao.shihaoo',
ios: 'https://apps.apple.com/cn/app/%E6%98%AF%E5%A5%BD/id1457958161',
scheme: 'com.qdxxzy.user://'
};
window.onload = function () {
let oBtn = document.getElementById('btn') ;
oBtn.addEventListener('click', function () {
//打开app整套流程
openApp( `${ CONFIG.scheme }shihaoo.com?type=xxx`, goConfirmAddr);
});
};
function openApp(){
...
}
/**
* 超时跳转h5页面
* */
function goConfirmAddr() {
let { isAndroid } = judgePhoneType();
window.location.href = !isAndroid ? CONFIG.ios : CONFIG.android ;
}
/**
* 判断是否为微信浏览器
* 兼容ios
* */
function isWeiXin() {
return /micromessenger/i.test(navigator.userAgent.toLowerCase()) || typeof navigator.wxuserAgent !== 'undefined'
}
/**
* 判断手机类型
* return [ isAndroid, isIOS, isIOS9 ]
* */
function judgePhoneType() {
let isAndroid = false, isIOS = false, isIOS9 = false, version,
u = navigator.userAgent,
ua = u.toLowerCase();
//Android系统
if (u.indexOf('Android') > -1 || u.indexOf('Linux') > -1) { //android终端或者uc浏览器
isAndroid = true
}
//ios
if (ua.indexOf("like mac os x") > 0) {
let regStr_saf = /os [\d._]*/gi;
let verinfo = ua.match(regStr_saf);
version = (verinfo + "").replace(/[^0-9|_.]/ig, "").replace(/_/ig, ".");
}
let version_str = version + "";
// ios9以上
if (version_str !== "undefined" && version_str.length > 0) {
version = parseInt(version);
if (version >= 8) {
isIOS9 = true
} else {
isIOS = true
}
}
return {isAndroid, isIOS, isIOS9};
}
兼容`ios`,判断是否为微信浏览器(不易查找,亲测有效)
return /micromessenger/i.test(navigator.userAgent.toLowerCase()) || typeof navigator.wxuserAgent !== 'undefined'