YiHuaXie/NNWKWebViewJSBridge

A lightweight JavaScript bridge in WKWebView.

WKWebViewJSBridge

简介

在看了WebViewJavascriptBridge的项目，我希望可以用swift去实现一个JavaScript bridge，所以写了这个项目。该项目是基于WebViewJavascriptBridge实现，仅支持WKWebView。

关于WebViewJavascriptBridge的实现，有兴趣的可以看一下我的笔记WebViewJavascriptBridge源码分析。

使用

Native端

1. 初始化

使用WKWebView初始化bridge对象

 let webView = WKWebView(frame: .zero, configuration: WKWebViewConfiguration())
 bridge = WKWebViewJSBridge(webView: webView)

2. JavaScript调用Native

Native注册函数给JavaScript调用

bridge.register(handlerName: "nameFromNative") { [weak self] (data, callback) in
    self?.data.append("[nameFormNative] called by JS, Data: \(data!)")
    self?.data.append("Native responding Data!")
    self?.tableView.reloadData()
    callback?("Nero Native")
}

3. Native调用JavaScript

Native调用JavaScript

bridge.call(handlerName: "JSBridgeBegin")

JavaScript端

1. 初始化

复制以下代码到你的项目中

function setupWKWebViewJSBridge(callback) {
	if (window.WKWebViewJSBridge) {
		return callback(WKWebViewJSBridge);
	}

	if (window.WKWebViewJSBridgeCallbacks) {
		return window.WKWebViewJSBridgeCallbacks.push(callback);
	}
	window.WKWebViewJSBridgeCallbacks = [callback];

	window.webkit.messageHandlers.iOS_InjectJavascript.postMessage(null);
}

2. JavaScript注册函数或者调用Native函数

调用setupWKWebViewJSBridge函数后用bridge来注册Handlers以及调用Native Handlers。

setupWKWebViewJSBridge(bridge => {
	bridge.registerHandler('JSBridgeBegin', (data, responseCallback) => {
		log('JSBridge Begin, Data', data, true);
	});

	bridge.registerHandler('nameFromJS', (data, responseCallback) => {
		log('[nameFromJS] called by Native, Data', data, true);
		log('JS responding Data!', 'Nero JS', true);
		responseCallback('Nero JS');
	});
});

要求

iOS 9.0+。

安装

pod 'NNWKWebViewJSBridge'

作者

• 邮箱：xyh30902@163.com

许可证

NNWKWebViewJSBridge 基于 MIT 许可证，查看 LICENSE 文件了解更多信息。