WebViewJavascriptBridge 使用 js调iOS原生代码
Posted just coding
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了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(){
}
以上是关于WebViewJavascriptBridge 使用 js调iOS原生代码的主要内容，如果未能解决你的问题，请参考以下文章
WebViewJavascriptBridge－Obj-C和JavaScript互通消息的桥梁