1. Project Introduction

The design idea of MixKit is mainly derived from React-Native and an internal project I participated in maintaining in my former company, which mainly solved the communication problem between H5 and Native. Currently, it is supported by iOS and Android.

2. Project address

MixKit-iOS

mixkit-android

mixkit-js

3. Solve problems

  1. Provide developers with the easiest way to use it while hiding complex communication logic
  2. Solve the problem of easy coupling and difficult maintenance of WebViewJavascriptBridge and other tripartite library writing functions
  3. Provide high enough scalability, such as custom communication data formats

4. Code examples

1. Use the specified web container - (void)viewDidLoad {[super viewDidLoad]; WKWebViewConfiguration *configuration = [[WKWebViewConfiguration alloc] init]; _webView = [[MKWebView alloc] initWithFrame:self.view.bounds configuration:configuration]; [self.view addSubview:_webView]; MK_EXPORT_MODULE(LogManager, MKLogManager) @interface MKLogManager: NSObject <MKBridgeModule> @end @implementation MKLogManager // 3. Register the logMessage function MK_EXPORT_METHOD(logMessage, logWithParams:callback:) - (void)logWithParams:(NSDictionary *)params callback:(MKResponseCallback)callback { NSLog(@"[logMessage] %@", params[@"msg"]); NSDictionary *resp = MKResponseMake(MKCallbackCodeSuccess, @"Log Success", nil); // 4. callback ? : callback(@[resp]); } @endCopy the code
<script type="text/javascript" SRC ="mix. JS "></script> function logThenCallback() {let params = { msg: 'Log something here... '}; Let MKLogManager = NativeModules.LogManager; Params, function (response) {mklogManager.log ({MSG: 'LOG' + JSON.stringify(response)}); }); }Copy the code

5. Project plan

  1. Supports various communication modes such as socket and JavaScriptCore