pod 集成工具

pod 'WebViewJavascriptBridge', '~> 6.0'

使用：

1. iOS代碼

#import "WebViewJavascriptBridge.h"
@property (nonatomic,strong)WebViewJavascriptBridge* bridge;
- (WebViewJavascriptBridge *)bridge{
    if (!_bridge) {
        _bridge = [WebViewJavascriptBridge bridgeForWebView:self.webView];
        [_bridge setWebViewDelegate:self.delegate];
    }
    return _bridge;
}
// 調(diào)用js方法(與js的 doHead 對應)
[self.bridge callHandler:@"doHead" data:value responseCallback:^(id responseData) {
        NSLog(@"%@ == %@",name,value);
        if (callBack) callBack(responseData);
    }];
// 添加一個js方法 (與js的 styleCallBack 對應)
[self.bridge registerHandler:@"styleCallBack" handler:^(id data, WVJBResponseCallback responseCallback) {
        NSLog(@"%@",[NSThread currentThread]);
        if (callBack) callBack(data);
    }];

2. 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)
}
setupWebViewJavascriptBridge(function(bridge) {
                             bridge.registerHandler('doHead', function(data, responseCallback) {
                                                    var responseData = null;
                                                    window.doHead();
                                                    responseCallback(responseData);
                                                    })
}
window.styleCallBack = function(value){
    window.WebViewJavascriptBridge.callHandler('styleCallBack', value, function(response) {
        return editor.getFormat();
    });
}

進階：簡單的封裝一個簡單的管理類

#import <UIKit/UIKit.h>

// 負責通訊
@interface JavaScriptCoreManager : NSObject

/**
 webview 就是JavaScriptCoreManager 操作的webview 也支持wkwebview
 */
@property (nonatomic,assign)id webView;

/**
 運行時替換了webview的delegate 此處設(shè)置的是webview的delegate
 */
@property (nonatomic,assign) id delegate;


/**
 調(diào)用js的方法
 
 @param name 方法名
 @param value 參數(shù)
 @param callBack 返回值
 */
- (void)RunJSMethordByName:(NSString *)name
                  AndValue:(NSString *)value
               AndCallBack:(void(^)(NSString *result))callBack;


/**
 添加一個js方法

 @param name 方法名
 @param callBack 方法調(diào)用的回調(diào)
 */
- (void)addJSMethrdByName:(NSString *)name
              AndCallBack:(void(^)(NSString *result))callBack;

@end

#import "JavaScriptCoreManager.h"
#import "WebViewJavascriptBridge.h"

@interface JavaScriptCoreManager ()
@property (nonatomic,strong)WebViewJavascriptBridge* bridge;
@end
@implementation JavaScriptCoreManager

//調(diào)用js的方法
- (void)RunJSMethordByName:(NSString *)name
                  AndValue:(NSString *)value
               AndCallBack:(void(^)(NSString *result))callBack{
    [self.bridge callHandler:name data:value responseCallback:^(id responseData) {
        NSLog(@"%@ == %@",name,value);
        if (callBack) callBack(responseData);
    }];
}

// 添加一個js方法
- (void)addJSMethrdByName:(NSString *)name
              AndCallBack:(void(^)(NSString *result))callBack{
    [self.bridge registerHandler:name handler:^(id data, WVJBResponseCallback responseCallback) {
        NSLog(@"%@",[NSThread currentThread]);
        if (callBack) callBack(data);
    }];
}
- (WebViewJavascriptBridge *)bridge{
    if (!_bridge) {
        _bridge = [WebViewJavascriptBridge bridgeForWebView:self.webView];
        [_bridge setWebViewDelegate:self.delegate];
    }
    return _bridge;
}
@end

使用：

// 調(diào)用
 [self.jsManager RunJSMethordByName:@"doHead" AndValue:@"h2" AndCallBack:nil];
// 添加
 [self.jsManager addJSMethrdByName:@"styleCallBack" AndCallBack:^(NSString *type){
          // 回掉處理
 }];