js与ios桥接使用WebViewJavascriptBridge简单理解
https://github.com/marcuswestin/WebViewJavascriptBridge
function setupWebViewJavascriptBridge(callback) {
if (window.WebViewJavascriptBridge) { return callback(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) }, 0)
}
Finally, call setupWebViewJavascriptBridge and then use the bridge to register handlers and call ObjC handlers:
setupWebViewJavascriptBridge(function(bridge) {
/* Initialize your app here */
bridge.registerHandler('JS Echo', function(data, responseCallback) {
console.log("JS Echo called with:", data)
responseCallback(data)
})
bridge.callHandler('ObjC Echo', {'key':'value'}, function responseCallback(responseData) {
console.log("JS received response:", responseData)
})
})
github地址如上
工作中用到了这个桥接,出现了很多问题,
首先,初始化了这个函数之后,然后调用这个函数,调用ios端定义的handler或者js 注册自己的handler,
但是好像不可以写多个该函数的调用,否则所有写的交互不生效。
那么我如果想调用ios定义的多个函数,只能写在一个调用里,罗列多个
bridge.registerHandler
和
bridge.callHandler来写了。
目前还是出现了个别交互不生效的问题。
registerHandler 就是在网页端定义一个函数,获取后端返回的相应参数,后端调用使用
callHandler 就是在ios端定义一个函数,网页端调用,传过去相应参数。
我的博客即将搬运同步至腾讯云+社区,邀请大家一同入驻:https://cloud.tencent.com/developer/support-plan?invite_code=dd4qxupt8clk
js与ios桥接使用WebViewJavascriptBridge简单理解的更多相关文章
- js原型和原型链的简单理解
构造函数创建对象: function Person() { } var person = new Person(); person.name = 'Tian'; console.log(person. ...
- Js 职责链模式 简单理解
js 职责链模式 的简单理解.大叔的代码太高深了,不好理解. function Handler(s) { this.successor = s || null; this.handle = funct ...
- 【原创】分布式之数据库和缓存双写一致性方案解析(三) 前端面试送命题(二)-callback,promise,generator,async-await JS的进阶技巧 前端面试送命题(一)-JS三座大山 Nodejs的运行原理-科普篇 优化设计提高sql类数据库的性能 简单理解token机制
[原创]分布式之数据库和缓存双写一致性方案解析(三) 正文 博主本来觉得,<分布式之数据库和缓存双写一致性方案解析>,一文已经十分清晰.然而这一两天,有人在微信上私聊我,觉得应该要采用 ...
- JS闭包的简单理解。优缺点以及垃圾回收机制
闭包是什么? ·了解闭包首先了解js的‘链式作用域’结构,对象可以一级一级的向上查找父对象的变量,所以父对象的变量对子对象可见,反之不成立:所以都可以访问全局变量 ·为了解决函数外部无法访问函数内局部 ...
- 对于js原型和原型链继承的简单理解(第三种,复制继承)
复制继承:简单理解,就是把父对象上的所有属性复制到自身对象上: function Cat(){ this.climb = function(){ alert("我会爬树"); } ...
- 优秀开源代码解读之JS与iOS Native Code互调的优雅实现方案
简介 本篇为大家介绍一个优秀的开源小项目:WebViewJavascriptBridge. 它优雅地实现了在使用UIWebView时JS与ios 的ObjC nativecode之间的互调,支持消息发 ...
- Hybrid----优秀开源代码解读之JS与iOS Native Code互调的优雅实现方案-备
本篇为大家介绍一个优秀的开源小项目:WebViewJavascriptBridge. 它优雅地实现了在使用UIWebView时JS与ios 的ObjC nativecode之间的互调,支持消息发送.接 ...
- [转]简单理解Socket
简单理解Socket 转自 http://www.cnblogs.com/dolphinX/p/3460545.html 题外话 前几天和朋友聊天,朋友问我怎么最近不写博客了,一个是因为最近在忙着公 ...
- 简单理解ECMAScript2015中的箭头函数新特性
箭头函数(Arrow functions),是ECMAScript2015中新加的特性,它的产生,主要有以下两个原因:一是使得函数表达式(匿名函数)有更简洁的语法,二是它拥有词法作用域的this值,也 ...
随机推荐
- 命令行todo神器taskwarrior使用简介
简介 taskwarrior是一个命令行的任务管理神器,同时也有服务端,支持同步. 语法规则为 安装 Linux上可以直接软件包管理器安装 Window可以用cygwin Mac可以用homebrew ...
- java基础篇---I/O技术(一)
对于任何程序设计语言而言,输入输出(I/O)系统都是比较复杂的而且还是比较核心的.在java.io.包中提供了相关的API. java中流的概念划分 流的方向: 输入流:数据源到程序(inputStr ...
- [转]JSP中EL表达式三元运算符的使用
原文地址:http://www.guance.com/469.html Java中的三元运算符为:条件?条件为true值:条件为false的值EL也有一样的运算符,用EL的三元运算符有时可以代替c:c ...
- <孙阿姨炒股记:3500元炒出千万身家的股市智慧 >读书笔记
书在这里 个人投资者要想在中国股市上生存,并且获利,首先要“胆子小” 国家方针政策要花力气去研究 不要听小道消息,比较天下没有免费的午餐 好公司不一定就能赚钱,好的买点药抓住,好的卖点更要抓住 趋势是 ...
- java.io.ByteArrayInputStream 源码分析
ByteArrayInputStream 包含一个内部缓冲区,该缓冲区包含从流中读取的字节. 成员变量 //由该流的创建者提供的 byte 数组. protected byte buf[]; //要从 ...
- 【Java集合源码剖析】HashMap源码剖析
转载出处:http://blog.csdn.net/ns_code/article/details/36034955 HashMap简介 HashMap是基于哈希表实现的,每一个元素是一个key-va ...
- Android studio导入eclipse项目遇到的错误解决方案
Error:Execution failed for task ':app:compileDebugJavaWithJavac'. > Compilation failed; see the c ...
- Hadoop HDFS分布式文件系统 常用命令汇总
引言:我们维护hadoop系统的时候,必不可少需要对HDFS分布式文件系统做操作,例如拷贝一个文件/目录,查看HDFS文件系统目录下的内容,删除HDFS文件系统中的内容(文件/目录),还有HDFS管理 ...
- 安卓程序代写 网上程序代写[原]Android开发技巧--ListView
1. ListView中元素的排序 ListView中的元素排序, 即将数据源排序即可; 给集合排序的方法 : 调用Collections的sort(list, Comparator)方法, 该方法需 ...
- Android Studio apk 打包
1.Build -> Generate Signed APK...,打开如下窗口 2.假设这里没有打过apk包,点击Create new,窗口如下 这里只要输入几个必要项 Key store p ...