h5调用第三方app （项目开发思路）

h5怎么调用第三方app？

备注 ：亲测有效剩下的靠自己整理一下代码

在不借用外壳方法的情况下，怎么调用第三方app？

方案思路

第一步是判断手机是Android还是IOS系统。第二步，根据手机类型不同怎么去拉取第三方app。第三步，如果能拉取，怎么拉取第三方app。第四步，如果不能拉取，怎么解决。

判断机型
做需求的时候外壳会告诉你怎么判断是ios还是安卓
ios（网上找的）

isIos() {
    var ua = navigator.userAgent.toLocaleLowerCase()
    var u = navigator.userAgent
    var isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/) // ios终端
    return isIOS
},

安卓

isAndroid() {
    var ua = navigator.userAgent.toLocaleLowerCase()
    var u = navigator.userAgent
    var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Linux') > -1 // g
    return isAndroid
},

在网上找过一篇文章 说ios机型还需要判断是9+还是9以下
判断ios型号（网上找的 我记得一行代码就可以搞定了）

    var str= navigator.userAgent.toLowerCase(); 
    var ver=str.match(/cpu iphone os (.*?) like mac os/);
    if(!ver){
        alert("请在Ios系统中打开");
    }else{
        alert("你当前的Ios系统版本为："+ver[1].replace(/_/g,"."));
    }

//苹果9以上
if(iOS9) {
    window.location.href = ${universalLink};
}
//9以下
else {
	var ifr = document.createElement('iframe');
    ifr.src = ${scheme};
    ifr.style.display = 'none';
    document.body.appendChild(ifr);
    window.setTimeout(function () {
       document.body.removeChild(ifr);
    }, 300);
}
 
举个栗子：
${universalLink} = 'http://myapp.com'
${scheme} = 'myapp://index'

能不能拉取

const initialTime = new Date();
let counter = 0;
let waitTime = 0;
const checkOpen = setInterval(() => {
   count++;
   waitTime = new Date() - initialTime;
   if (waitTime > 2500) {
      clearInterval(checkOpen);
      cb();
   }
   if (counter < 100) return;
   const hide = document.hidden || document.webkitHidden;
   if (!hide) {
      cb(); // 唤端失败的回调函数
   }
}, 20);

还有就是保底策略

//URL是下载APP的链接
window.location.href=URL

上面的cb()函数就要结合这个保底策略

有用的一些调用APP链接参考
H5唤起APP指南
H5页面拉起第三方App