<!doctype html>
<html lang="en">
<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>活动demo</title>
<link rel="stylesheet" type="text/css" href="http://m.yinhu.com/static/app/common/reset.min.css"/>
</head>
<style type="text/css">
.M_body{
padding-bottom: 5rem;
}
button{
display: block;
margin:0 auto;
margin-top: 1rem;
5rem;
height: 2rem;
color: #FFFFFF;
background-color: #53BEF7;
border-radius:0.2rem ;
box-shadow: 0px 3px 5px #444444;
}
.M_massage{
position: fixed;
top: 2.3rem;
left: 4rem;
8rem;
min-height: 1.5rem;
background-color: rgba(0,0,0,0.5);
border-radius: 0.8rem;
line-height: 1.5rem;
color: #ffffff;
text-align: center;
font-size: 0.8rem;
}
</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>
</div>
<div class="M_massage" id="I_massage" style="display: none;"></div>
<script src="http://m.yinhu.com/static/app/common/flexible.16.min.js"></script>
<script src="http://m.yinhu.com/static/app/common/activity2.0.0.min.js"></script>
<script src="http://m.yinhu.com/static/app/common/zepto.min.js"></script>
<script>
/*
* 移动端（m站）与App的区分就是url 是否有from = app 这个参数
* 1.检查登录
* 2.登录
* 3.调产品列表
* 4.分享功能
* 5.注册功能
* 回调参数说明
* 参数 值
* n 回调对象
* n.userNm 用户名
* n.mobileNo 手机号
* n.result 分享失败failure
* n.result 分享成功success
*
*/
//1. 检查登录
$("#btn1").tap(function(){
MobilePort.App(function(){
C_interaction(function(n){ // 有参数 n.userNm、n.mobileNo
if(n!=null){
alertMse('已经登录');
}else{
alertMse('没有登录');
}
},"checkLogin");
},"from=app");
});
//2. 登录
$("#btn2").tap(function(){
MobilePort.App(function(){//*************app登录
C_interaction(function(n){ // 有参数 n.userNm、n.mobileNo
alertMse('已经登录');
},"loginAction");
},"from=app");
MobilePort.noApp(function(){//*************m站的登录
window.location.href="https://m.yinhu.com/login/login.bl"
},"from=app");
})
//3.产品列表
$("#btn3").tap(function(){
MobilePort.App(function(){//*************app产品列表
C_interaction(function(n){},"productListAction");
},"from=app");
MobilePort.noApp(function(){//*************m站的产品列表
window.location.href='http://m.yinhu.com/loan/ydb_loan_list.bl';
},"from=app");
})
//4.分享功能
$("#btn4").tap(function(){
MobilePort.App(function(){//*************app分享功能
C_interaction(function(n){
// 返回要分享的内容
return {
title:"活动demo",
content:"m站App",
contentURL:"http://192.168.34.250:8020/0914-sunKU/activity1.0.0.html",//内容链接
imageURL:"https://www.baidu.com/", //图片链接
shareFrom:"1",//分享来源
shareFromCode:"1"//分享码
};
},"shareAction",function(n){ //有参数 n.result
alertMse("分享结果："+n.result)//success 表示成功, failure 表示失败
});
},"from=app");
MobilePort.noApp(function(){//*************m站的分享功能
MobilePort.wxQQ(function(){ //微信或QQ
alertMse('微信浏览器或QQ内置浏览器');
});
MobilePort.noWxQQ(function(){//非微信非QQ
alertMse('非微信浏览器非QQ浏览器');
});
},"from=app");
})
//5.注册
$("#btn5").tap(function(){
MobilePort.App(function(){//*************app的注册
C_interaction(function(n){ // 有参数 n.userNm、n.mobileNo
alertMse("注册的回调");
},"registerAction");
},"from=app");
MobilePort.noApp(function(){//*************m站的注册
window.location.href="https://m.yinhu.com/regist/go_regist.bl"
},"from=app");
});
$("#btn6").tap(function(){
MobilePort.App(function(){//*************
C_interaction(function(n){
return {
"title":'页面的标题', //页面的tittle
"item":'事件名称', //页面的事件名称
"sourceUrl":'页面的url' //页面的url
}
},"dealUMAnalyics");
},"from=app");
MobilePort.noApp(function(){//*************m站的注册
//加百度统计 或者不加
},"from=app");
});
/**
* 2016/12/14
* @sunjx
* 弹框js与交互无关
*/
function alertMse(n){
$("#I_massage").show();
$("#I_massage").html(n);
setTimeout(function(){
$("#I_massage").hide();
},2000)
}
</script>
</body>
</html>
/* * 2016/12/14 * yinhuweb * V 2.0.0 * */ (function(){ /* * v 1.1.0 * 使用方法： * 一、引入ua.js * 二、直接调用 MobilePort 对象的属性与方法。 * 三、目前共1个属性15个方法 * MobilePort 对象 * 属性：MobilePort.back;// 数组 内容如下 * 方法：MobilePort.androidBrowser(callBack) 1 安卓浏览器 //callBack 回调只有在安卓浏览器下执行 * 方法：MobilePort.iosBrowser(callBack) 2 ios浏览器 // 下面全部类似 * 方法：MobilePort.qqBrowser(callBack) 3 QQ浏览器 * 方法：MobilePort.ucBrowser(callBack) 4 uc浏览器 * 方法：MobilePort.wxBrowser(callBack) 5 微信浏览器 * 方法：MobilePort.pc(callBack) 6 pc浏览器 * 方法：MobilePort.move(callBack) 7 移动浏览器 * 方法：MobilePort.androidApp(callBack, parameter) 8 安卓APP * 方法：MobilePort.iosApp(callBack, parameter) 9 iosApp * 方法：MobilePort.androidWx(callBack) 10 安卓WX * 方法：MobilePort.iosWx(callBack) 11 iosWX * 2016 11 17 添加 * 方法：MobilePort.wxQQ(callBack) 12 微信浏览器 QQ内置浏览器 * 方法：MobilePort.noWxQQ(callBack) 13 非微信浏览器与QQ浏览器 * 2016 12 2 添加 * 方法：MobilePort.App(callBack, parameter) 14 App打开 * 方法：MobilePort.noApp(callBack, parameter) 15 非App打开 * 方法：MobilePort.noWxBrowser(callBack) 16 非微信浏览器 * * * * * callBack 是回调函数，在指定环境下执行的函数。 * parameter 是url上的参数，用于识别APP与Browser(必须)，字符串。 * 例如 www.baidu.com?from=app parameter 指 from=app * from=app 是前后端约定好的指代 App请求的网页。 * * back数组中可能的值：内核、浏览器、移动端平台、pc端平台 、其他 * webkit Trident Presto Gecko //内核 webkit内核 Trident内核 Presto内核 Gecko内核 * IE chrome firefox opera safari //浏览器 IE浏览器 chrome浏览器 firefox浏览器 opera浏览器 safari浏览器 * UCBrowser MQQBrowser //浏览器 UC浏览器 QQ浏览器 * android ipad iphone //移动端平台 android平台 ipad平台 iphone平台 * Mac windows Linux //pc端平台 Mac平台 windows平台 Linux平台 * move wx //其他 move移动端平台 wx微信浏览器 */ /* * 正则赋值 内核 */ // webkit 内核 var webkit = /webkit/i; //IE内核 var Trident = /Trident/i; //opera内核 var Presto = /Presto/i; //火狐内核 var Gecko = /Gecko/i; /* * 正则赋值 浏览器 */ // chrome 浏览器 var chrome1 = /chrome/(d+.d+)/i; // firefox 浏览器 var firefox = /firefox/(d+.d+)/i; // opera 浏览器 var opera = /opera(/| )(d+(.d+)?)(.+?(version/(d+(.d+)?)))?/i; // safari 浏览器 var safari = /(d+.d)?(?:.d)?s+safari/?(d+.d+)?/i; // IE 浏览器 var IE = /msie (d+.d+)/i; // UC 浏览器 var UCBrowser = /UCBrowser/i; //QQ浏览器 var MQQBrowser = /MQQBrowser/i; /* * 正则赋值 pc端 */ // macintosh 系统 var Mac = /macintosh/i; // windows 平台 var windows = /windows/i; // Linux 平台 var Linux = /Linux/i; /* * 正则赋值 移动端 */ // android 系统 var android = /android/i; // ipad 系统 var ipad = /ipad/i; // iphone 系统 var iphone = /iphone/i; /* * 正则赋值 其他 */ // 移动终端 var move = /(nokia|iphone|android|ipad|motorola|^mot-|softbank|foma|docomo|kddi|up.browser|up.link|htc|dopod|blazer|netfront|helio|hosin|huawei|novarra|CoolPad|webos|techfaith|palmsource|blackberry|alcatel|amoi|ktouch|nexian|samsung|^sam-|s[cg]h|^lge|ericsson|philips|sagem|wellcom|bunjalloo|maui|symbian|smartphone|midp|wap|phone|windows ce|iemobile|^spice|^bird|^zte-|longcos|pantech|gionee|^sie-|portalmmm|jigs browser|hiptop|^ucweb|^benq|haier|^lct|operas*mobi|opera*mini|320x320|240x320|176x220)/i; // 微信打开 var wx = /MicroMessenger/i; var back = []; var ua = navigator.userAgent; /* * 2016 11 17 * 添加微信QQ浏览器 */ var T_androidQQ = new RegExp(' QQ');//安卓正则 var T_iosQQ = new RegExp(' QQ');//安卓正则 //内核判断 if (webkit.test(ua)) { //webkit back.push("webkit"); }; if (Trident.test(ua)) { //IE back.push("Trident"); }; if (Presto.test(ua)) { //欧朋 back.push("Presto"); }; if (Gecko.test(ua)) { //火狐 back.push("Gecko"); }; //浏览器 判断 if (IE.test(ua)) { back.push("IE"); }; if (chrome1.test(ua)) { back.push("chrome"); }; if (firefox.test(ua)) { back.push("firefox"); }; if (opera.test(ua)) { back.push("opera"); }; if (safari.test(ua)) { back.push("safari"); }; if (UCBrowser.test(ua)) { back.push("UCBrowser"); }; if (MQQBrowser.test(ua)) { back.push("MQQBrowser"); }; //pc 平台判断 if (Mac.test(ua)) { back.push("Mac"); }; if (windows.test(ua)) { back.push("windows"); }; if (Linux.test(ua)) { back.push("Linux"); }; //移动平台 判断 if (android.test(ua)) { back.push("android"); }; if (ipad.test(ua)) { back.push("ipad"); }; if (iphone.test(ua)) { back.push("iphone"); }; //其他 if (move.test(ua)) { back.push("move"); }; if (wx.test(ua)) { back.push("wx"); }; MobilePort = {}; //back 包含所有信息 MobilePort.back = back; //1 android 浏览器 MobilePort.androidBrowser = function (callBack) { if (android.test(ua)) { callBack(); } else { return "error"; } }; //2 ios 浏览器 MobilePort.iosBrowser = function (callBack) { if (ipad.test(ua) || iphone.test(ua)) { callBack(); } else { return "error"; } }; //3 QQ 浏览器 MobilePort.qqBrowser = function (callBack) { if (MQQBrowser.test(ua)) { callBack(); } else { return "error"; } }; //4 UC 浏览器 MobilePort.ucBrowser = function (callBack) { if (UCBrowser.test(ua)) { callBack(); } else { return "error"; } }; //5 微信打开 MobilePort.wxBrowser = function (callBack) { if (wx.test(ua)) { callBack(); } else { return "error"; } }; //6 pc 平台 MobilePort.pc = function (callBack) { if (Linux.test(ua) || windows.test(ua) || Mac.test(ua)) { callBack(); } else { return "error"; } } //7 移动平台 MobilePort.move = function (callBack) { if (move.test(ua)) { callBack(); } else { return "error"; } } //8 androidApp MobilePort.androidApp = function (callBack, parameter) { var oUrl = location.search; var tc = new RegExp(parameter); if (android.test(ua) && tc.test(oUrl)) { callBack(); } else { return "error"; } }; //9 iosApp MobilePort.iosApp = function (callBack,parameter) { var oUrl = location.search; var tc = new RegExp(parameter); if ((ipad.test(ua) || iphone.test(ua)) && tc.test(oUrl)) { callBack(); } else { return "error"; } }; //10 androidWx MobilePort.androidWx = function (callBack) { if (android.test(ua)&&wx.test(ua)) { callBack(); } else { return "error"; } }; //11 iosWx MobilePort.iosWx = function (callBack) { if ((ipad.test(ua)||iphone.test(ua))&&wx.test(ua)) { callBack(); } else { return "error"; } }; //12 微信浏览器 QQ内置浏览器 MobilePort.wxQQ = function(callBack){ if(T_androidQQ.test(ua)||T_iosQQ.test(ua)||wx.test(ua)){ callBack(); }else{ return "error"; } }; //13 非微信浏览器与QQ浏览器 MobilePort.noWxQQ = function(callBack){ if(T_androidQQ.test(ua)||T_iosQQ.test(ua)||wx.test(ua)){ return "error"; } else{ callBack(); } } //14 App MobilePort.App = function(callBack,parameter){ var oUrl = location.search; var tc = new RegExp(parameter); if(tc.test(oUrl)){ callBack(); } else{ return "error"; } } //15 非App MobilePort.noApp = function(callBack,parameter){ var oUrl = location.search; var tc = new RegExp(parameter); if(tc.test(oUrl)){ return "error"; } else{ callBack(); } } //16 非微信浏览器 MobilePort.noWxBrowser = function(callBack,parameter){ if (wx.test(ua)) { return "error"; } else { callBack(); } } })(); // /* * 适合版本为 2.2.0 * 前提是url上加 from=app * 2016 11 18 */ var Native = {}; var ua = navigator.userAgent; var oUrl = location.search; var tc = /from=app/i; //原生H5交互 function C_interaction(a,b,c){ 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"){ Native.registerAction = function(n){ a(n); }; var parameter = '{"obj":"Native","funcName":"registerAction"}'; yinhu.registerAction(parameter); } //7.js调native 分享功能 无回调 有参数 else if(b=="shareAction"){ var a = a(); Native.shareResult=function(n){ c(n); }; var C_code = { "title":a.title, "content":a.content, "contentURL":a.contentURL, "imageURL":a.imageURL, "shareFrom":a.shareFrom, "shareFromCode":a.shareFromCode, "obj":"Native", "funcName":"shareResult" }; var C_code = JSON.stringify(C_code); yinhu.shareAction(C_code); } //8.js调 native统计 else if(b == "dealUMAnalyics"){ var a = a(); var C_code = { "title":a.title, "item":a.item, "sourceUrl":a.sourceUrl }; var C_code = JSON.stringify(C_code); yinhu.dealUMAnalyics(C_code); } //9 js调native风险评估 else if(b == "submitAssess"){ var C_code = a(); yinhu.submitAssess(C_code); } else{ console.log("参数错误") } }else { console.log("url没有from=app") } }; /** * 自动加版本号 * 2017/1/19 */ var C_version = (new Date).getTime() var C_tc_version = /version/i; var C_tc_parameter = /?/i; var C_currentUrl = window.location.href; if(C_tc_version.test(C_currentUrl)){ }else{ if(C_tc_parameter.test(C_currentUrl)){ window.location.href = C_currentUrl+'&version='+C_version; }else{ window.location.href = C_currentUrl+'?version='+C_version; } }