/*
注意:源生app需要配置jsbridge的环境,而在前端页面中需要下方封装代码,既可以达到调用app方法的功能和注册供app调用的方法
1、注册方法:注册后,供app调用,注册时,同名函数,下一个会覆盖上一个
2、调用函数,可以调用多次
3、使用时,只需要导入即可 如:import {setbridge, getbridge} from 'jsbridge'
4、使用方式:
调用app方法: getbridge(functionName,data,callback) 第一个参数是app的函数名字;
第2个参数是要传递给app方法的数据,数据类型不限(具体要看app接收什么类型的数据,如:json,string,number等)
第3个参数是一个函数,函数内隐含回调数据data,调用例子如下: getbridge('closePage','关闭页面',(data) => {
// 'app返回过来的数据:'+data
})
注册方法,供app使用:
setbridge(functionName,data,callback) 调用方式类似于上方说明
第一个参数:函数名字,可以自定义
第2个参数,app调用该方法是,需要给app传递的数据
第3个参数,回调函数,默认函数有一个数据data参数,得到的是app返回给前台js的数据 */ function setupWebViewJavascriptBridge(callback) {
if (/android/.test(navigator.userAgent.toLowerCase())) {
if (window.WebViewJavascriptBridge) {
callback(window.WebViewJavascriptBridge);
} else {
document.addEventListener(
'WebViewJavascriptBridgeReady',
function() {
callback(window.WebViewJavascriptBridge);
},
false
);
}
} else if (/ios|iphone|ipad|ipod/.test(navigator.userAgent.toLowerCase())) {
if (window.WebViewJavascriptBridge) {
return callback(window.WebViewJavascriptBridge);
}
if (window.WVJBCallbacks) {
return window.WVJBCallbacks.push(callback);
}
window.WVJBCallbacks = [callback];
var WVJBIframe = document.createElement('iframe');
WVJBIframe.style.display = 'none';
WVJBIframe.src = 'https://__bridge_loaded__';
document.documentElement.appendChild(WVJBIframe);
setTimeout(function() {
document.documentElement.removeChild(WVJBIframe);
}, 100);
}
}
setupWebViewJavascriptBridge(function(bridge) {
if (/android/.test(navigator.userAgent.toLowerCase())) {
bridge.init(function(message, responseCallback) {
// 'JS got a message', message
var data = {
'Javascript Responds': '测试中文!'
}; if (responseCallback) {
// 'JS responding with', data
responseCallback(data);
}
});
}
});
// 初始化jsbridge
function setbridge(funName, dataJson, callback) {
setupWebViewJavascriptBridge(function(bridge) {
bridge.registerHandler(funName, function(data, responseCallback) {
// '注册函数,从app拿到的数据', data
callback && callback(data);
var responseData = dataJson;
// 'js返回给app的数据', responseData
responseCallback(responseData);
});
});
}
function getbridge(funName, dataJson, callback) {
setupWebViewJavascriptBridge(function(bridge) {
bridge.callHandler(funName, dataJson, function(response) {
callback && callback(response);
});
});
} export { setbridge, getbridge };

jsbridge的js封装的更多相关文章

  1. 原生JS封装Ajax插件(同域&&jsonp跨域)

    抛出一个问题,其实所谓的熟悉原生JS,怎样的程度才是熟悉呢? 最近都在做原生JS熟悉的练习... 用原生Js封装了一个Ajax插件,引入一般的项目,传传数据,感觉还是可行的...简单说说思路,如有不正 ...

  2. 使用NW.js封装微信公众号菜单编辑器为桌面应用

    开发微信公众号的朋友都会遇到一个常见的需求就是修改自定义菜单,如果每个人都去开发这个不经常使用的功能确实有点浪费时间.前段时间在github上找到一个仿企业号的菜单编辑界面,结合微信的C# SDK开发 ...

  3. 用jQuery基于原生js封装的轮播

    我发现轮播在很多网站里面都用到过,一个绚丽的轮播可以为网页增色不少,最近闲来无事,也用原生js封装了一个轮播,可能不像网上的插件那么炫,但是也有用心去做.主要用了闭包的思想.需要传递的参数有:图片地址 ...

  4. 原生JS封装简单动画效果

    原生JS封装简单动画效果 一致使用各种插件,有时候对原生JS陌生了起来,所以决定封装一个简单动画效果,熟悉JS原生代码 function animate(obj, target,num){ if(ob ...

  5. 使用原生JS封装Ajax

    使用原生 的JS封装 Ajax,实现 仿JQuery的Ajax,post,get三种异步请求方式: var MAjax = { //根据浏览器创建异步对象 createXhr: function () ...

  6. js封装的方法

    1.JS封装就是尽量把使用的方式简单化,内部逻辑和使用解耦.通俗的说就是使用的时候只需要知道参数和返回值,其他条件尽量不要使用人员进行设置. 2.JS封装的方法有函数方式.对象的方式.闭包的方式. 举 ...

  7. JS封装cookie操作函数实例(设置、读取、删除)

    本文实例讲述了JS封装cookie操作函数.分享给大家供大家参考,具体如下: ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 ...

  8. 原生Js封装的弹出框-弹出窗口-页面居中-多状态可选

    原生Js封装的弹出框-弹出窗口-页面居中-多状态可选   实现了一下功能: 1.title可自定义 可拖拽 2.width height可以自定义 3.背景遮罩和透明度可以自定义 4.可以自己编辑弹出 ...

  9. 用require.js封装原生js轮播图

    index.html页面: <!DOCTYPE html><html> <head> <meta charset="UTF-8"> ...

随机推荐

  1. skyline开发——加载Shapefile文件

    //1)获取道路的GroupID string dlId = ptm.FindGroupByName("道路"); IFeatureLayer66 featureLayer = n ...

  2. vue中v-for的使用

    本人正在开始学习Vue,每天写写基础的记录,希望对大家有帮助,如有错误还望指出,我也是一个小白,也希望大家能一起进步 v-for指令的使用: 1.循环普通数组 item in list 中的item是 ...

  3. SDK更新

    虽然国内google被墙了,但仍可利用国内的某些镜像网站实现Android SDK在线更新,使用方法如下: 1.启动 Android SDK Manager ,打开主界面,依次选择『Tools』.『O ...

  4. web网站使用qq第三方登录

    Html代码: <a href=’/QQlogin’>qq登录</a> //后台代码: @RequestMapping(value = "/QQlogin" ...

  5. python 练习3

    简单计算器的实现: 计算:1-2*((60-30+(-40.0/5)*(9-2*5/3+7/3*99/4*2998+10*568/14))-(-4*3)/(16-3*2))' #!usr/bin/en ...

  6. 笔记本电脑连接wifi,同时提供热点wifi给手机使用

    笔记本电脑连接wifi,同时提供热点wifi给手机使用 用电脑建立WiFi供手机平板设备使用ps:电脑需要有无线网卡,一般笔记本都自带 此教程仅适用Windows 7 & 8,1.打开笔记本的 ...

  7. s6-7 TCP 传输策略

    TCP 传输策略 防止黏包现象的出现 当窗口数为 0 时,发送者不能正常发送数据段,除非: -Urgent数据.比如,用户想杀掉远端机器上的进程的时候,可以发送数据 -发送者可以发送一个字节的数据段, ...

  8. pageHelper的使用步骤,省略sql语句中的limit

    1.引架包.注意版本问题 <dependency> <groupId>com.github.pagehelper</groupId> <artifactId& ...

  9. 写给笨蛋徒弟的学习手册(3)—C#中15个预定义数据类型

    在C#中学习中,你会很早的遇到预定义数据类型这个概念,但你有没有仔细想过它存在的意义?正所谓“存在即合理”,预定义数据类型的存在目的主要有俩个方面,一是为了增加程序的安全性,同时减轻编译器负担,加快编 ...

  10. TFIDF<细读>

    概念 TF-IDF(term frequency–inverse document frequency)是一种用于资讯检索与资讯探勘的常用加权技术.TF-IDF是一种统计方法,用以评估一字词对于一个文 ...