H5喚醒APP

Android使用iframe喚起，ios采用window.location.href喚起更合適一點。

 

1.ios系統：

 在wap中喚起app其實應用最最廣泛的並不是Universal Link，而是直接Schema跳轉

 window.location.href = "taobao://fulushuka.tmall.com/shop/view_shop.htm?spm=a230r.7195193.1997079397.2.5yhUYD"；

 Schema無法判斷是否安裝App，如果用戶手機沒有安裝要喚醒的App，需要提示用戶去下載。

 目前沒有好的辦法去判斷ios是否喚醒成功，如果成功就跳轉頁面，不執行后面setTimeout()方法；

 如果沒有跳轉成功，會執行setTimeout()，在這里提示用戶去下載想喚醒的App。這里有點投機取巧，並不是很完美。

 

2.安卓系統：

  需要在Dom中添加iframe節點，喚醒App后，刪除此節點。

// 給原生傳遞數據
function loadURL(url) {
  var iFrame;
  var u = navigator.userAgent;
  var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android終端
  var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios終端
  if (isAndroid) {
    //安卓終端使用iframe
    iFrame = document.createElement("iframe");
    iFrame.setAttribute("src", url);
    iFrame.setAttribute("style", "display:none;");
    iFrame.setAttribute("height", "0px");
    iFrame.setAttribute("width", "0px");
    iFrame.setAttribute("frameborder", "0");
    document.body.appendChild(iFrame);
    // 發起請求后這個 iFrame 就沒用了，所以把它從 dom 上移除掉
    iFrame.parentNode.removeChild(iFrame);
    iFrame = null;
  } else if (isiOS) {
    //iOS終端直接頁面跳轉
    window.location.href = url;
    // 如果用戶沒有安裝淘寶APP，則提示用戶去安裝淘寶
    setTimeout(() => {
        alert('請去應用市場下載App')； // 這里可以自行寫一個延時關閉的彈窗，也可以跳轉至app下載地址，我這里就偷懶了
    }, 2000);
  } else {
    window.location.href = url;
  }
}

 

3.微信端是不能喚醒的：

  需要加一個蒙層，引導用戶去瀏覽器中打開。判斷微信端方法：

function isInWx(){
    var agent = window.navigator.userAgent.toLowerCase();
    return agent.match(/MicroMessenger/i) == 'micromessenger';
}

 

 

 

參考鏈接：https://www.jb51.net/article/117959.htm