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 {
    // 其他地方
    // 发起微信授权
}