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值,也 ...
随机推荐
- ssm框架结合axis2实例步骤
本文亲测: 1.从官网下载axis2相关api,地址是:http://axis.apache.org/axis2/java/core/download.html,我下载的是axis2-1.7.6-bi ...
- Spark Streaming 执行流程
Spark Streaming 是基于spark的流式批处理引擎,其基本原理是把输入数据以某一时间间隔批量的处理,当批处理间隔缩短到秒级时,便可以用于处理实时数据流. 本节描述了Spark Strea ...
- Linux中的守护进程——supervise
絮叨 supervise是daemontools的一个工具,可以用来监控管理Unix下的应用程序运行情况,在应用程序出现异常时,supervise可以重新启动指定程序. 本文介绍一下supervise ...
- 【WPF】屏幕右下角消息提示框
WPF做一个仿QQ的右下角消息提示窗,网上找到几个Demo后,选了一个比较好用的. 博客 http://blog.csdn.net/huangli321456/article/details/5052 ...
- CAS (6) —— Nginx代理模式下浏览器访问CAS服务器网络顺序图详解
CAS (6) -- Nginx代理模式下浏览器访问CAS服务器网络顺序图详解 tomcat版本: tomcat-8.0.29 jdk版本: jdk1.8.0_65 nginx版本: nginx-1. ...
- Java编程的逻辑 (30) - 剖析StringBuilder
本系列文章经补充和完善,已修订整理成书<Java编程的逻辑>,由机械工业出版社华章分社出版,于2018年1月上市热销,读者好评如潮!各大网店和书店有售,欢迎购买,京东自营链接:http: ...
- android开发(42) 使用andorid操作蓝牙打印机
最近接到一个需求,使用android发起打印任务,通过蓝牙连接打印机.条件如下: 打印机:南京富士通DPK760E,具有蓝牙功能 Android手机:普通手机,Android 4.4版本,具有蓝牙功能 ...
- 创建Maven项目出错
有时候创建maven项目的时候会出错,例如在创建Spring cloud 2 项目的时候,会出现org.apache.maven.archiver.MavenArchiver.getManifest( ...
- C#里的SubString和Convert.ToDateTime
1.C#里的SubString String.SubString(int index,int length) index:开始位置,从0开始 length:你要取的子字符串的长度 2.C#语言 ...
- Caused by:java.lang.IllegalStateException at android.media.MediaPlayer._setDataSource(Native Method)
使用Mediaplayer播放本地音频,在第二次调用mediaplayer.setDataSource()时报错如下: Caused by: java.lang.IllegalStateExcepti ...