WebViewJavascriptBridge 使用 js调iOS原生代码

js代码和原生ios代码进行交互使用WebViewJavascriptBridge非常简化了我们的操作特别是在ios这边

js 掉用ios原生代码时要注意的几个事项:

1、js和ios定义好相互调用的各自要掉用对方的函数名

2、ios中的操作:

a、创建一个bridge对象self.bridge = [WebViewJavascriptBridge bridgeForWebView:webView];
b、注册ios中给js回调的代码[self.bridge registerHandler:@"ObjC Echo" handler:^(id data, WVJBResponseCallback responseCallback) {
	NSLog(@"ObjC Echo called with: %@", data);
	responseCallback(data);
}];b1、或者调用js中的方法
[self.bridge callHandler:@"JS Echo" data:nil responseCallback:^(id responseData) {
	NSLog(@"ObjC received response: %@", responseData);
}];

3、js代码中的操作:

1、将一下函数拷贝到js代码当中

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)
}

2、在以下函数中做你的所有要和app交互的动作并且在函数中register对应的时间,需要注意的是如果你的执行函数在这个func外面的话,要在这个函数的回调当中手动掉用你要掉用的执行函数。案例:我们做js的同事认为数据变了后js页面会自动刷新,然而并没有,所以这个过程最好能够在回调的过程中显示掉用一下。

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) {
          anotherOperation()
     console.log("JS received response:", responseData) }) })

func anotherOperation(){

}

时间: 2024-10-01 01:18:33

WebViewJavascriptBridge 使用 js调iOS原生代码的相关文章

PhoneGap或者Cordova框架下实现Html5中JS调用Android原生代码

PhoneGap或者Cordova框架下实现Html5中JS调用Android原生代码 看看新闻网>看引擎>开源产品 0人收藏此文章, 发表于8小时前(2013-09-06 00:39) , 已有13次阅读 ,共0个评论 依照我一惯得套路,我会先说一点废话. PhoneGap和Cordova什么关系?为什么有的地方叫Cordova而有的地方叫PhoneGap ?PhoneGap是一款HTML5平台.通过它,开发商能够使用HTML.CSS及JavaScript来开发本地移动应用程序.因此,眼下开

Unity与iOS原生代码之间的相互调用

效果: 代码: [GitHub]Unity_iOS_Plugin_Demo 关键: 1.Unity调用iOS: 1.1.在Unity C#中: [ DllImport( "__Internal" )] private static extern int _showSelectTitleDialog ( string title, string msg); 1.2.在Xcode Objective-C中: extern "C" { int _showSelectTit

js和android原生代码交互

1.首先要建一个和包名一直的文件夹名 2.建立一个配置js和两个文件夹 3.配置文件js文件 4.java文件路径 java文件内容: 类继承CordovaPlugin并实现execute()方法 5.第二个文件夹中的js,用作桥梁 内容:    

微信公众号js调起支付代码中不要使用var

WeixinJSBridge.invoke( 'getBrandWCPayRequest', data.data, function(res){ if(res.err_msg == "get_brand_wcpay_request:ok" ) { // 使用以上方式判断前端返回,微信团队郑重提示:res.err_msg将在用户支付成功后返回 ok,但并不保证它绝对可靠. $('#loading-bd').html('请等待跳转...'); $('#my-loading').modal(

JS与APP原生控件交互

"热更新"."热部署"相信对于混合式开发的童鞋一定不陌生,那么APP怎么避免每次升级都要在APP应用商店发布呢?这里就用到了混合式开发的概念,对于电商网站尤其显得重要,不可能每次发布一个活动,都要发布一个现版本,当然这样对于Android还算可以,但是对于Ios呢?苹果应用商店每次审核的时间基本都在1~2周,这对于一个促销活动来说审核时间实在太长.而混合式开发正好可以解决这个问题,基本的原理时,通过原生控件实现APP的主体结构,借助H5开发对应的页面,这样每次发布活

Hybrid----优秀开源代码解读之JS与iOS Native Code互调的优雅实现方案-备

本篇为大家介绍一个优秀的开源小项目:WebViewJavascriptBridge. 它优雅地实现了在使用UIWebView时JS与ios 的ObjC nativecode之间的互调,支持消息发送.接收.消息处理器的注册与调用以及设置消息处理的回调. 就像项目的名称一样,它是连接UIWebView和Javascript的bridge.在加入这个项目之后,他们之间的交互处理方式变得很友好. 在native code中跟UIWebView中的js交互的时候,像下面这样: [cpp] view pla

JS调用Android、Ios原生控件

在上一篇博客中已经和大家聊了,关于JS与Android.Ios原生控件之间相互通信的详细代码实现,今天我们一起聊一下JS调用Android.Ios通信的相同点和不同点,以便帮助我们在进行混合式开发时,提高代码质量,实现两者在网页端代码的统一. 首先我们先看一下Ios调用JS的方法实现: //无参调用 function SwiftCallJs1(){} //有参调用 function SwiftCallJs2(name, message){} 紧接着我们看一下Android调用JS的方法实现: /

优秀开源代码解读之JS与iOS Native Code互调的优雅实现方案

简介 本篇为大家介绍一个优秀的开源小项目:WebViewJavascriptBridge. 它优雅地实现了在使用UIWebView时JS与ios 的ObjC nativecode之间的互调,支持消息发送.接收.消息处理器的注册与调用以及设置消息处理的回调. 就像项目的名称一样,它是连接UIWebView和Javascript的bridge.在加入这个项目之后,他们之间的交互处理方式变得很友好. 在native code中跟UIWebView中的js交互的时候,像下面这样: [cpp] view

WebViewJavascriptBridge JS与iOS Native Code互调方法

本篇为大家介绍一个优秀的国人开发开源小项目:WebViewJavascriptBridge. 下载WebViewJavascriptBridge地址 它优雅地实现了在使用UIWebView时JS与ios 的Objective-C nativecode之间的互调,支持消息发送.接收.消息处理器的注册与调用以及设置消息处理的回调. 就像项目的名称一样,它是连接UIWebView和Javascript的bridge.在加入这个项目之后,他们之间的交互处理方式变得很友好. 在native code中跟U