H5頁面與APP的交互

概述

APP調用H5頁面時，出現有些頁面頁頭重複的現象，需去掉H5頁頭使用原生APP頁頭。

解決方案

方案一：

前端在網頁中寫一個隱藏頭部的方法，客戶端直接調用;

方案二：

使用userAgent判斷當前頁面是否在webView裏打開：

兩種判斷方式：

1.與app端約定一個字段，判斷ua中是否包含此字段；

    var Href = window.location.href; 
    if (Href.indexOf("from=app") != -1) {  //判斷ua中是否包含和app端約定好的字段：from=app
        alert('I am from app');
    } else {
        alert('I am not from app');
    }

 

2.判斷各個瀏覽器

//判斷是否在webView中打開：
function openInWebview () {
    var ua = navigator.userAgent.toLowerCase()
    if (ua.match(/MicroMessenger/i) == 'micromessenger') { // 微信瀏覽器判斷
        return false;
    } else if (ua.match(/QQ/i) == 'qq') { // QQ瀏覽器判斷
        return false;
    } else if (ua.match(/WeiBo/i) == "weibo") {
        return false;
    } else {
        if (ua.match(/Android/i) != null) {
            return ua.match(/browser/i) == null;
        } else if (ua.match(/iPhone/i) != null) {
            return ua.match(/safari/i) == null;
        } else {
            return (ua.match(/macintosh/i) == null && ua.match(/windows/i) == null);
        }
    }
}

//使用方式
if (openInWebview()) {
    // 在app內打開
    // to do something
} else {
    // 其他地方
    // 發起微信授權
}