前端h5与 android/ios 交互传参

介绍 前端 与 Android/iOS 交互的代码。（双方要约定一个公用的方法）
1.与Android交互
① 前端 调用 Android 的方法，这里将约定的方法名为：HtmlToAndroid

window.android.HtmlToAndroid(参数)；

在HtmlToAndroid方法中，参数根据需求来传值。可为：空，字符串，JSON

② Android 调用 前端 的方法，这里将约定的方法名为：AndroidToHtml，

window["AndroidToHtml"]=function(msg){
    alert(msg+"123")
};

//如果在vue-cli中，只需在 created() 中将方法暴露在window下(注意this)

window["AndroidToHtml"]=function(msg){ 
    alert(msg+"123")
};

2.与iOS交互
①前端调用 iOS的方法 这里将约定的方法名为：HtmlToIos

window.webkit.messageHandlers.HtmlToIos.postMessage(参数);

webkit只在iOS环境下起作用，前端如果在网页中打开会报错

②iOS调用前端的方法与 android调用一样，前端秩序要将方法暴露在window旧习惯

window["IosToHtml"]=function(){ 
     alert(msg+"123")
};

3.判断android ios调用app方法

function appMessage(str) {
    str = String(str);
    var u = navigator.userAgent,
    app = navigator.appVersion;
    var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Linux') > -1; //android终端或者uc浏览器   
    var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端 
    if (isAndroid) {
        window.android.HtmlToAndroid(str);
    } else if (isiOS) {
        window.webkit.messageHandlers.HtmlToIos.postMessage({
            'str': str
        });
    }
}

其中HtmlToAndroid是andriod的方法；HtmlToIos是ios的提供的方法