原生_H5交互插件(适用于与V2.1)
这是js代码
/* * 适合版本为 2.1.0 * 前提是url上加 from=app */ var Native = {}; var ua = navigator.userAgent; var oUrl = location.search; var tc = /from=app/i; //原生H5交互 function C_interaction(a,b){ if(tc.test(oUrl)){ //1.checkLogin js调native 判断登录 有回调 有参数 if(b=="checkLogin"){ Native.checkLogin = function(n){ a(n); }; var parameter = '{"obj":"Native","funcName":"checkLogin"}'; yinhu.checkLogin(parameter); } //2.loginAction js调native 调用登录 有回调 有参数 else if(b=="loginAction"){ Native.loginAction =function(n){ a(n); }; var parameter = '{"obj":"Native","funcName":"loginAction"}'; yinhu.loginAction(parameter); } //3.productListAction js调native 产品列表 无回调 无参数 else if(b=="productListAction"){ yinhu.productListAction(); } //4.dialService js调native 拨打客服 无回调 有参数 else if(b=="dialService"){ var C_phone = a(); yinhu.dialService(C_phone) } //5.checkAppVersion js调native 版本号 有回调 有参数 else if(b=="checkAppVersion"){ Native.checkAppVersion = function(n){ a(n); }; var parameter = '{"obj":"Native","funcName":"checkAppVersion"}'; yinhu.checkAppVersion(parameter); } //待优化部分 //6.registerAction js调native 注册 无回调 有参数 else if(b=="registerAction"){ if(ua.indexOf('iPhone') >= 0||ua.indexOf('iPad') >= 0){ location.href="inyinhu://yinhu/router/?buttonAction=register&code="+a(); } else if(ua.indexOf('Android') >= 0){ var C_code = a; yinhu.registerAction(C_code) } } //7.native调js 分享功能 无回调 有参数 else if(b=="shareAction"){ var a = a(); if(ua.indexOf('iPhone') >= 0||ua.indexOf('iPad') >= 0){ location.href="inyinhu://yinhu/router/?buttonAction=socialShare&title="+a.title+"&content="+a.content+"&contentURL="+a.contentURL+"&imageURL="+a.imageURL; } else if(ua.indexOf('Android') >= 0){ var C_code = {"title":a.title, "content":a.content, "contentURL":a.contentURL, "imageURL":a.imageURL, "shareFrom":a.shareFrom, "shareFromCode":a.shareFromCode }; var C_code = JSON.stringify(C_code); yinhu.shareAction(C_code); } } //8.shareResult native调js 分享回调 js方函数 else{ console.log("参数错误") } }else { console.log("url没有from=app") } };
这是html代码
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="format-detection" content="telephone=no">
<title>H5与native交互demo</title>
<link rel="stylesheet" type="text/css" href="reset.css"/>
<script src="flexible-min.js"></script>
</head>
<style type="text/css">
button{
display: block;
margin:0 auto;
margin-top: 1rem;
width: 5rem;
height: 2rem;
color: #666666;
}
</style>
<body>
<div class="M_body">
<button id="btn1">判断登录</button>
<button id="btn2">调用登录</button>
<button id="btn3">产品列表</button>
<button id="btn4">拨打客服</button>
<button id="btn5">版本号</button>
<button id="btn6">注册</button>
<button id="btn7">分享功能</button>
<button id="btn8">分11享功能</button>
</div>
<script src="H5_Native.js"></script>
<script src="zepto.min.js"></script>
<script>
$("#btn1").tap(function(){
//1. 判断登录 js调native 有回调 有参数
C_interaction(function(n){
// App 已登录 n 是 {mobileNo:"xxx",userNm:"xxx"}
// App 未登录 ios n=null 安卓不回调
alert(n);
alert(n.mobileNo);
alert(n.userNm);
},"checkLogin");
});
$("#btn2").tap(function(){
//2.调用登录 js调native 有回调 有参数
C_interaction(function(n){
// n 是 {mobileNo:"xxx",userNm:"xxx"}
alert(n);
alert(n.mobileNo);
alert(n.userNm);
},"loginAction");
});
$("#btn3").tap(function(){
//3.产品列表 js调native 无回调 无参数
C_interaction(function(n){
// 无回调 无参数 跳转到产品列表
},"productListAction");
});
$("#btn4").tap(function(){
//4.拨打客服 js调native 无回调 有参数
C_interaction(function(n){
// 返回字符串 电话号码
return "18832581538";
},"dialService");
});
$("#btn5").tap(function(){
//5.版本号 js调native 有回调 有参数
C_interaction(function(n){
// n 是 {version:"2.1.1"}
alert(n.version)
},"checkAppVersion");
});
$("#btn6").tap(function(){
//6.注册 js调native 无回调 有参数
C_interaction(function(n){
//返回1 新手注册
var n="1";
return n;
},"registerAction");
});
$("#btn7").tap(function(){
//7. 分享功能 native调js 无回调 有参数
C_interaction(function(n){
// 返回要分享的内容
return {
title:"标题",
content:"分享内容",
contentURL:"https://www.baidu.com/",//内容链接
imageURL:"https://www.baidu.com/", //图片链接
shareFrom:"分享来源",
shareFromCode:"分享来源编码"
};
},"shareAction");
//8. js的方法
Native.shareResult=function(n){
alert("分享功能："+n.result);
};
});
$("#btn8").click(function(){
alert("1")
location.href="inyinhu://yinhu/router/?buttonAction=productList&code=1";
})
/*
* 适用于app 2.1.0
* 1.checkLogin js调native 判断登录 有回调 有参数
* 2.loginAction js调native 调用登录 有回调 有参数
* 3.productListAction js调native 产品列表 无回调 无参数
* 4.dialService js调native 拨打客服 无回调 有参数
* 5.checkAppVersion js调native 版本号 有回调 有参数
* 6.registerAction js调native 注册 无回调 有参数
* 7.shareAction js调native 分享功能 无回调 有参数
* 8.shareResult native调js 分享回调 无回调 有参数
*/
</script>
</body>
</html>
