您的位置:首页 > 移动开发

iOS与H5混编--优秀的第三方框架WebViewJavascriptBridge

2017-03-27 00:00 351 查看
摘要: WebViewJavascriptBridge同时支持UIWeView和WKWebView,无论是JS调用OC还是OC调用JS,都可以正常传值和返回值;而且在页面加载时只要JS代码被运行就可以进行交互,上面遇到的缺点和坑在这里都被掩埋的,所以是现在处理交互的主流做法。
可以参考:http://www.cnblogs.com/yajunLi/p/6369257.html

#pragma mark - 如何使用:

// 第一步
#import "WebViewJavascriptBridge.h"

// 第二步 声明属性
@property WebViewJavascriptBridge* bridge;

// WebViewJavascriptBridge 支持WKWebView 或者 UIWebView 与 JS交互
self.bridge = [WebViewJavascriptBridge bridgeForWebView:webView];

// JS调用OC 的方法
[self.bridge registerHandler:@"ObjC Echo" handler:^(id data, WVJBResponseCallback responseCallback) {
NSLog(@"ObjC Echo called with: %@", data);
responseCallback(data);
}];
// OC调用JS 的方法
[self.bridge callHandler:@"JS Echo" data:nil responseCallback:^(id responseData) {
NSLog(@"ObjC received response: %@", responseData);
}];

// 这是JS代码的处理 通常是 H5人员或后台人员处理
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)
}

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)
})
})
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息