js调用APP的方法
举个简单的例子,有个需求是要和APP交互的,h5页面里面有个分享按钮,点击之后需要调用APP原生的分享功能
app那边写好了一个方法是onShare( )
第一步:就是点击分享好友触发
<div @click="onShare">分享好友</div>
第二步:定义onShare方法调用APP方法
onShare () {
if(this.isAndroid_ios()) {
console.log('安卓')
window.AndroidFunction.onShare('1');// AndroidFunction为安卓端封装的方法
}else {
console.log('ios')
window.webkit.messageHandlers.onShare.postMessage('1'); //ios
}
},
isAndroid_ios() {
let u = navigator.userAgent;
let isAndroid = u.indexOf('Android') > -1 || u.indexOf('Linux') > -1; //安卓
let isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
if(isAndroid){
return true;
} else if(isIOS) {
return false;
}
}
isAndroid_ios()这个函数是判断是否是安卓或者是ios
因为安卓和ios的调用方法不同
以onShare()方法为例:
安卓:window.AndroidFunction.onShare('1'); // android
IOS:window.webkit.messageHandlers.onShare.postMessage(’1‘); //ios
里面可以传参给APP 的
APP调用js的方法
这个h5这边很简单,只需要把方法挂载到window上,APP就能调用
具体为
window.customizeFn = function(data) {
console.log('app端返回的参数:', data); // APP调用js方法后,传过来的值
}
// customizeFn为自定义参数名