备案控制台
开发者社区 开发与运维 文章 正文

工银e生活开发脱坑日志（4）工行页面及jsAPI交互接口hybrid_app.js登录情况说明

2023-07-16 140
版权
版权声明：
本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《 阿里云开发者社区用户服务协议》和 《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写 侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
简介： 工银e生活开发脱坑日志（4）工行页面及jsAPI交互接口hybrid_app.js登录情况说明

工银e生活页面及jsAPI交互接口

情况说明：

1、判断运行环境，否则是否在android或IOS环境的ICBC内，才起作用，当然改动hybrid_app.js中的return false为alert，也可以在chrome中体验，毕竟只是JS；

2、登录传递参数，需要查询出登录参数cust_id、phone、currentTimeMillis、isNewUser四个必选参数，调用方法即可；

3、必须要工行模拟器或测试环境支持


工银e生活hybrid_app.js整个文件代码如下：

var hybrid_app ={};
var ua = navigator.userAgent;
//判断e生活版本号
hybrid_app.elifeVer = function() {
      try {
          var version = navigator.userAgent.match(new RegExp('fullversion:(\\d\.\\d\.\\d\.\\d)'));
          if(version==undefined){
              version = navigator.userAgent.match(new RegExp('fullversion:(\\d\.\\d\.\\d)'));
          }
          version = (version == undefined ? "0" : version);
          version = parseInt(version[1].replace(/\./g, ''));
          version = (version==""?"1000":version);
          return version;
      } catch (e) {
        return "1000";
      }
};
//判断是否是融e联 ios
hybrid_app.isRELIphone = function () {
  if (ua.indexOf('ICBCiPhoneBS')>-1) {
    return true;
  }
  return false;
};
//  判断是否是融e联 android
hybrid_app.isRELAndroid = function () {
  if (ua.indexOf('ICBCAndroidBS')>-1 ) { 
    return true;
  }
  return false;
};
/**
 * 检测当前浏览器是否为Android(Chrome)
 */
hybrid_app.isAndroid = function() {
  if (ua.indexOf('Android')>-1) {
    return true;
  }
  return false;
};
/**
 * 检测当前浏览器是否为iPhone(Safari)
 */
hybrid_app.isIPhone = function() {
  if (ua.indexOf('iPhone')>-1) {
    return true;
  }
  return false;
};
//android拦截native
hybrid_app.GetNativeFunctionAndroid = function(para) {
  setTimeout(function () {
        var res;
        switch (para.keyword) {
            case 'open' :
                res = prompt('callNativeMethod', "{obj:Native,func:DataConfigServiceServer,args:['open','" + para.callMethod + "']}");
                callLogin(res);
                break;
            case 'showToolBar' :
                res = prompt('callNativeMethod', "{obj:Native,func:DataConfigServiceServer,args:['showToolBar','" + para.isShow + "']}");
                break;
            case 'back' :
                res = prompt('callNativeMethod', "{obj:Native,func:DataConfigServiceServer,args:['back','']}");
                break;
            case 'openGPS' :
                res = prompt('callNativeMethod', "{obj:Native,func:DataConfigServiceServer,args:['openGPS','']}");
                break;
            case 'closeGPS' :
                res = prompt('callNativeMethod', "{obj:Native,func:DataConfigServiceServer,args:['closeGPS','']}");
                break;
            case 'getMyLocation' :
              res = prompt('callNativeMethod', "{obj:Native,func:DataConfigServiceServer,args:['getMyLocation','" + para.getGps + "']}");
                getGps(res);
              break;
            case 'callPhoneNumber' :
              res = prompt('callNativeMethod', "{obj:Native,func:DataConfigServiceServer,args:['callPhoneNumber','" + para.tel + "']}");
              break;
            case 'share' :
                res = prompt('callNativeMethod', "{obj:Native,func:DataConfigServiceServer,args:['share','" + para.shareInfo + "']}");
                break;
            case 'openAddress' : 
                res = prompt('callNativeMethod', "{obj:Native,func:DataConfigServiceServer,args:['openAddress','" + para.custId + "','" + para.appId + "']}");
                break;
            case 'getDefaultAddress' : 
                res = prompt('callNativeMethod', "{obj:Native,func:DataConfigServiceServer,args:['getDefaultAddress','" + para.custId + "','" + para.appId + "'],callBack:" + para.callback + "}");
                callBackAddress(res);
                break;
            case 'getThirdScan' : 
                res = prompt('callNativeMethod', "{obj:Native,func:DataConfigServiceServer,args:['getThirdScan','" + para.callback + "']}");
                thirdScanCallback(res);
                break;
            case 'getThirdARScan' : 
                res = prompt('callNativeMethod', "{obj:Native,func:DataConfigServiceServer,args:['getThirdARScan','" + para.callback + "']}");
                thirdARScanCallback(res);
                break;
        }
    });
};
//ios注册native
function connectWebViewJavascriptBridge(callback) {
    if(window.WebViewJavascriptBridge){
      return callback(WebViewJavascriptBridge);
    }else{
      document.addEventListener('WebViewJavascriptBridgeReady', function() {
            callback(WebViewJavascriptBridge);
        }, false);
    }
    if(window.WVJBCallbacks) { return window.WVJBCallbacks.push(callback); }
    window.WVJBCallbacks = [callback];
    var WVJBIframe=document.createElement('iFrame');
    WVJBIframe.style.display='none';
    WVJBIframe.src='wvjbscheme://__BRIDGE_LOADED__';
    document.documentElement.appendChild(WVJBIframe);
    setTimeout(function(){document.documentElement.removeChild(WVJBIframe)});
}
connectWebViewJavascriptBridge(function(bridge) {
    bridge.init();
    bridge.registerHandler("callback",callback);
});
var ICBCBridge = {
    callHandler: function(name, params, callback) {
        connectWebViewJavascriptBridge(function(bridge) {
            bridge.callHandler(name, params, callback);
        });
    },
    send: function(params, callback) {
        connectWebViewJavascriptBridge(function(bridge) {
            bridge.send(params, callback);
        });
    }
};
window.ICBCBridge = ICBCBridge;
//中途登录
hybrid_app.merLogin = function(callMethod){
  //如果是安卓
  if(hybrid_app.isAndroid()){
    if(callMethod != null){
      if(hybrid_app.elifeVer() < '213') {
                Myutils.open(callMethod);
            } else {
                hybrid_app.GetNativeFunctionAndroid({'keyword': 'open', 'callMethod': callMethod});
            }
    }else{
      if(hybrid_app.elifeVer() < '213') {
                Myutils.open("callLogin");
            } else {
                hybrid_app.GetNativeFunctionAndroid({'keyword': 'open', 'callMethod': "callLogin"});
            }
    }
  }else{  //ios
    if(callMethod != null){
       window.ICBCBridge.callHandler("Myutils.open",callMethod);
    }else{
       window.ICBCBridge.callHandler("Myutils.open","callLogin");
    }
  }
}
//第三方显示或隐藏tabbar isShow:true显示tabbar 反之隐藏
hybrid_app.showToolBar = function(isShow){
  //如果是安卓
  if(hybrid_app.isAndroid()){
    if(hybrid_app.elifeVer() < '213') {
            Myutils.showToolBar(isShow);
        } else {
            hybrid_app.GetNativeFunctionAndroid({'keyword': 'showToolBar', 'isShow': isShow});
        }
  }else{  //ios
    window.ICBCBridge.callHandler("Myutils.showToolBar",isShow);
  }
}
//第三方返回上一级页面
hybrid_app.back = function(){
  //如果是安卓
  if(hybrid_app.isAndroid()){
    if(hybrid_app.elifeVer() < '213') {
            Myutils.back();
        } else {
            hybrid_app.GetNativeFunctionAndroid({'keyword': 'back'});
        }
  }else{  //ios
     window.ICBCBridge.callHandler("Myutils.back");
  }
}
//第三方开启定位
hybrid_app.openGPS = function(){
  //如果是安卓
  if(hybrid_app.isAndroid()){
    if(hybrid_app.elifeVer() < '213') {
            Myutils.openGPS();
        } else {
            hybrid_app.GetNativeFunctionAndroid({'keyword': 'openGPS'});
        }
  }else{  //ios
    window.ICBCBridge.callHandler("Myutils.openGPS");
  }
}
//第三方关闭定位
hybrid_app.closeGPS = function(){
  //如果是安卓
  if(hybrid_app.isAndroid()){
    if(hybrid_app.elifeVer() < '213') {
            Myutils.closeGPS();
        } else {
            hybrid_app.GetNativeFunctionAndroid({'keyword': 'closeGPS'});
        }
  }else{  //ios
    window.ICBCBridge.callHandler("Myutils.closeGPS");
  }
}
//第三方获取定位  参数是回调的函数名的字符串
hybrid_app.getMyLocation = function(getGps){
  //如果是安卓
  if(hybrid_app.isAndroid()){
    if(getGps != null){
      if(hybrid_app.elifeVer() < '213') {
              Myutils.getMyLocation(getGps);
          } else {
              hybrid_app.GetNativeFunctionAndroid({'keyword': 'getMyLocation', 'getGps': getGps});
          }
    }else{
      if(hybrid_app.elifeVer() < '213') {
              Myutils.getMyLocation("getGps");
          } else {
              hybrid_app.GetNativeFunctionAndroid({'keyword': 'getMyLocation', 'getGps': "getGps"});
          }
    }
  }else{  //ios
    if(getGps != null){
      window.ICBCBridge.callHandler("Myutils.getMyLocation",getGps);
    }else{
      window.ICBCBridge.callHandler("Myutils.getMyLocation","getGps");
    }
  }
}
//第三方打电话功能  参数是电话号
hybrid_app.callPhoneNumber = function(tel){
  //如果是安卓
  if(hybrid_app.isAndroid()){
    if(hybrid_app.elifeVer() < '213') {
            Myutils.callPhoneNumber(tel);
        } else {
            hybrid_app.GetNativeFunctionAndroid({'keyword': 'callPhoneNumber', 'tel': tel});
        }
  }else{  //ios
    window.ICBCBridge.callHandler("Myutils.callPhoneNumber",tel);
  }
}
//base64转码（由于ios客户端对特殊字符拦截，故要转码后传值）
hybrid_app.base64Encode = function (str) {
    _utf8_encode = function (string) {
        string = string.replace(/\r\n/g, "\n");
        var utftext = "";
        for (var n = 0; n < string.length; n++) {
            var c = string.charCodeAt(n);
            if (c < 128) {
                utftext += String.fromCharCode(c);
            } else if ((c > 127) && (c < 2048)) {
                utftext += String.fromCharCode((c >> 6) | 192);
                utftext += String.fromCharCode((c & 63) | 128);
            } else {
                utftext += String.fromCharCode((c >> 12) | 224);
                utftext += String.fromCharCode(((c >> 6) & 63) | 128);
                utftext += String.fromCharCode((c & 63) | 128);
            }
        }
        return utftext;
    };
    _keyStr = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/=";
    var output = "";
    var chr1, chr2, chr3, enc1, enc2, enc3, enc4;
    var i = 0;
    str = _utf8_encode(str);
    while (i < str.length) {
        chr1 = str.charCodeAt(i++);
        chr2 = str.charCodeAt(i++);
        chr3 = str.charCodeAt(i++);
        enc1 = chr1 >> 2;
        enc2 = ((chr1 & 3) << 4) | (chr2 >> 4);
        enc3 = ((chr2 & 15) << 2) | (chr3 >> 6);
        enc4 = chr3 & 63;
        if (isNaN(chr2)) {
            enc3 = enc4 = 64;
        } else if (isNaN(chr3)) {
            enc4 = 64;
        }
        output = output +
            _keyStr.charAt(enc1) + _keyStr.charAt(enc2) +
            _keyStr.charAt(enc3) + _keyStr.charAt(enc4);
    }
    return output;
},
//分享
hybrid_app.share = function (shareInfo) {
    if (ICBCUtilTools.isAndroid()) {
        if(hybrid_app.elifeVer() < '213') {
            window.Myutils.share(shareInfo);
            return;
        } else {
            hybrid_app.GetNativeFunctionAndroid({'keyword': 'share','shareInfo': shareInfo});
        }
    }else if(ICBCUtilTools.isiPhone()){
        //（ios需要将参数base64加密）
        window.ICBCBridge.callHandler("Myutils.share", hybrid_app.base64Encode(shareInfo));
    }
}
//分享方法调用示例
/*
  <div onclick="share()">分享</div>
  function share() {
    //调用分享交互需要传入的参数如下
    //pngUrl：分享后链接显示的图片地址
    var pngUrl = "https://122.19.157.9:443/filepath/elife/2018/12/31/15/cc91f9e05902461b83ff15dfda8fa9c3_s.gif";
    //shareUrl：分享后点击链接需要跳转的地址
    var shareUrl = "https://OFST-APP-GND.sdc.cs.icbc/OFSTCUSTH5/dist/#/business/index/02000015087";
    //title：分享后链接显示的标题
    var title = "特约商户支付专用01（修改）1111111111111111111111111";
    //content：分享后链接显示的内容
    var content = "4星级 4167256元/人 回龙观  汽车销售4S店/ 洗浴/  自助餐";
    //封装需要分享的对象
    var shareInfo = {
        PNGUrl: pngUrl,
        ShareUrl: shareUrl,
        Title: title,
        Content: content
    };
    // 将对象转为字符串
    shareInfo = JSON.stringify(shareInfo);
    var _jumpUtil = new jumpUtil();
    _jumpUtil.share(shareInfo);
}*/
//中途登录的回调示例，提供给第三方时，请删除方法体内容
function callLogin(param){
    var loginUrl = "merLogin.do?loginParams="+param;
    $.ajax({
    type : "POST",
    url : loginUrl,
    dataType : 'json',
    async : false,
    success : function(msg) {
      $("#cust_id").text(msg.cust_id);
      $("#phone").text(msg.phone);
      if(null != msg.longitude && null != msg.latitude){
      $("#longitudeAndlatitude").text(
          msg.longitude + "," + msg.latitude);
      }
      $("#cisno").text(msg.cisno);
      $("#third_cisno").text(msg.third_cisno);
      $("#isNewUser").text(msg.isNewUser);
      $("#city_name").text(msg.city_name);
      $("#city_code").text(msg.city_code);
      $("#special").text(msg.special);
      $("#device_id").text(msg.device_id);
      $("#currentTimeMillis").text(msg.currentTimeMillis);
      $("#loginSuc").text("中途登录成功！");
    },
    error : function(XMLHttpRequest, textStatus, errorThrown) {
      alert($.parseXML(XMLHttpRequest) + "," + textStatus + ","
          + errorThrown);
    }
  });
}
//获取定位信息的回调例，提供给第三方时，请删除方法体内容
//param位json格式，{"longitude":"","latitude":""},定位失败时，param为null,或""
function getGps(param) {
    if(param != null && param != ""){
      $("#myLocal").text(param.longitude+","+param.latitude);
    }else{
      $("#myLocal").text("定位获取失败！");
    }
}
//4月新增 1、获取默认地址(解密方式同中途登录) 2、打开管理收货地址页面 3、第三方唤起扫一扫
//获取默认地址回调，同中途登录，获取param值后做自有逻辑即可
function callBackAddress(param) {
    alert(param += '');
}
//第三方扫一扫回调，同中途登录，获取param值后做自有逻辑即可
function thirdScanCallback(param) {
    alert(param += '');
}
//第三方AR扫一扫回调，同中途登录，获取param值后做自有逻辑即可
function thirdARScanCallback(param) {
    alert(param += '');
}
//获取默认地址
hybrid_app.getDefaultAddress = function (custId, appId) {
    if (ICBCUtilTools.isAndroid()) {
        hybrid_app.GetNativeFunctionAndroid({'keyword': 'getDefaultAddress', 'custId': custId, 'appId': appId, 'callback': 'callBackAddress'});
    }else if(ICBCUtilTools.isiPhone()){
        var paraObj = {
            custId: custId,
            appId: appId,
            callback: 'callBackAddress'
        };
        paraObj = JSON.stringify(paraObj);
        window.ICBCBridge.callHandler("Myutils.getDefaultAddress",hybrid_app.base64Encode(paraObj));
    }
}
//打开管理收货地址页面
hybrid_app.openAddress = function (custId, appId) {
    if (ICBCUtilTools.isAndroid()) {
        hybrid_app.GetNativeFunctionAndroid({'keyword': 'openAddress', 'custId': custId, 'appId': appId});
    }else if(ICBCUtilTools.isiPhone()){
        var paraObj = {
            custId: custId,
            appId: appId
        };
        paraObj = JSON.stringify(paraObj);
        window.ICBCBridge.callHandler("Myutils.openAddress",hybrid_app.base64Encode(paraObj));
    }
}
//打开扫一扫
hybrid_app.getThirdScan = function () {
    if (ICBCUtilTools.isAndroid()) {
        hybrid_app.GetNativeFunctionAndroid({'keyword': 'getThirdScan', 'callback': "thirdScanCallback"});
    }else if(ICBCUtilTools.isiPhone()){
        window.WebViewJavascriptBridge.callHandler("Myutils.getThirdScan", "thirdScanCallback");
    }
}
//打开AR扫一扫
hybrid_app.getThirdARScan = function () {
    if (ICBCUtilTools.isAndroid()) {
        hybrid_app.GetNativeFunctionAndroid({'keyword': 'getThirdARScan', 'callback': "thirdARScanCallback"});
    }else if(ICBCUtilTools.isiPhone()){
        window.WebViewJavascriptBridge.callHandler("Myutils.getThirdARScan", "thirdARScanCallback");
    }
}
文章标签：
日志服务
JavaScript
iOS开发
Android开发
测试技术
Web App开发
关键词：
开发JavaScript
接口APP
日志服务开发
开发APP
日志服务接口
相关实践学习
日志服务之使用Nginx模式采集日志
本文介绍如何通过日志服务控制台创建Nginx模式的Logtail配置快速采集Nginx日志并进行多维度分析。
漏刻有时
目录
相关文章
郏国上
|
8天前
|
移动开发 JavaScript 前端开发
如何识别app中的页面是否是js（h5）页面
如何识别app中的页面是否是js（h5）页面
郏国上
20 2
wishCoding
|
17小时前
|
JavaScript Java 测试技术
基于ssm+vue.js的小型企业办公自动化系统的设计和开发附带文章和源代码设计说明文档ppt
基于ssm+vue.js的小型企业办公自动化系统的设计和开发附带文章和源代码设计说明文档ppt
wishCoding
15 4
wishCoding
|
2天前
|
JavaScript Java 测试技术
基于springboot+vue.js的线上辅导班系统的开发与设计附带文章和源代码设计说明文档ppt
基于springboot+vue.js的线上辅导班系统的开发与设计附带文章和源代码设计说明文档ppt
wishCoding
8 1
wishCoding
|
2天前
|
JavaScript Java 测试技术
基于微信小程序校园订餐的设计与开发+ssm+vue.js附带文章和源代码设计说明文档ppt
基于微信小程序校园订餐的设计与开发+ssm+vue.js附带文章和源代码设计说明文档ppt
wishCoding
10 1
北桥苏
|
3天前
|
前端开发 JavaScript PHP
解决在页面中无法获取qrcode.js生成的base64的图片
该文档介绍了如何解决在部分安卓手机上无法正确加载二维码图片的问题。之前的方法是使用qrcode.js生成二维码，然后与背景图结合用canvas绘制海报，但在某些安卓设备上遇到onload事件不触发的问题。
北桥苏
14 2
wishCoding
|
3天前
|
JavaScript Java 测试技术
智慧旅游平台开发微信小程序+springboot+vue.js附带文章和源代码设计说明文档ppt
智慧旅游平台开发微信小程序+springboot+vue.js附带文章和源代码设计说明文档ppt
wishCoding
11 0
小王老师呀
|
5天前
|
存储 JavaScript 安全
JS 监听用户页面访问&页面关闭操作并进行数据上报
该文主要讨论了一个网页安全项目的需求和实现，涉及用户访问和离开页面时的数据报告。需求包括首次进入、刷新、新标签页打开、导航切换以及页面关闭时的数据发送。技术要点包括使用Cookie和SessionStorage存储信息，事件监听以及navigator.sendBeacon方法进行数据发送。实现策略包括轮询检测URL变化和在unload事件中触发页面关闭报告。文章还提到了相关流程图和代码示例，总结中强调了数据上报在用户行为分析中的重要性。
小王老师呀
18 3
日_升
|
8天前
|
Web App开发 监控 JavaScript
JS 实现鼠标框选（页面选择）时返回对应的 HTML 或文案内容
实现JavaScript鼠标框选内容上报，需关注`Range`和`Selection`对象，处理各种元素选择情况，如文本、图片、输入框等。事件监听包括`mousedown`、`mouseup`、`selectionchange`等，用`debounce`防止频繁触发。通过`Range`获取选中内容，判断是否包含特定标签，决定返回HTML或文本。完整代码示例展示了如何实现这一功能。
日_升
14 0
JS 实现鼠标框选（页面选择）时返回对应的 HTML 或文案内容
换个网名有点难
|
8天前
|
JavaScript 前端开发
autox.js如何打印日志？
autox.js如何打印日志？
换个网名有点难
19 0
换个网名有点难
|
8天前
|
IDE JavaScript 开发工具
Auto.js 开发入门
Auto.js 开发入门
换个网名有点难
23 0

热门文章

最新文章

  • 1
    Redis内核基于时间点的备份恢复和基于AOF日志的增量同步机制设计
  • 2
    微服务架构 | 10.3 使用 Zipkin 可视化日志追踪
  • 3
    用Windows Live Writer发布日志到BlogBus
  • 4
    log file sync总结
  • 5
    SQL Server 2014 日志传送部署（4）：SQL Server Management Studio部署日志传送
  • 6
    演示：配置日志发送到VTY虚拟终端线路
  • 7
    秋式网站日志分析器[IISLogViewer] V3版本发布
  • 8
    探秘Hadoop生态12：分布式日志收集系统Flume
  • 9
    安卓开发-See the log file\.metadata\.log.
  • 10
    新浪明星日志推荐系统——爬虫爬取数据（1）
  • 1
    JavaScript字符串检查：从基础到高级
    29
  • 2
    使用 JavaScript 获取 URL 参数的详细指南
    2024
  • 3
    监控内网电脑软件设计与实现：基于Node.js的服务器端架构分析
    151
  • 4
    Java Script 中的垃圾回收机制有哪些缺点
    23
  • 5
    描述 JavaScript 中的垃圾回收机制。
    25
  • 6
    如何使用 JavaScript 操作 DOM？
    22
  • 7
    解释 JavaScript 中的`map()`、`filter()`和`reduce()`方法的用途。
    24
  • 8
    JavaScript 中的数组方法有哪些？
    13
  • 9
    JS设置日期为0时0分0秒
    41
  • 10
    JavaScript随手笔记 --- 对数据进行判断最大位数是否超过八位
    29

    • 相关课程

    更多
  • 大数据知识图谱系列—基于ELK+Flink日志全观测最佳实践
  • JavaScript入门与实战
  • 场景实践-基于阿里云Quick BI 对MOOC网站日志分析
  • JavaScript 自学手册文档教程
  • 互联网安全-移动APP漏洞风险与解决方案

    • 相关电子书

    更多
  • JavaScript异步编程
  • Delivering Javascript to World
  • 编程语言如何演化-以JS的private为例

    • 相关实验场景

    更多
  • 通过日志服务实现云资源OSS的安全审计
  • 如何将OSS数据导入至SLS中进行分析
  • 日志服务之使用Nginx模式采集日志
  • 星轨-钉钉APP分发实训
  • 揭秘如何通过日志服务实现个人敏感信息保护
    • 下一篇
    2024年阿里云免费云服务器及学生云服务器申请教程参考
    http://www.vxiaotou.com