JS与OC原生方法互相调用

本文将通过JavaScriptCore提供的方法,实现JS调用OC原生方法和OC中调用JS方法等

---

1.导入JavaScriptCore

#import 

2.定义全局的JSContext对象

@property(nonatomic,strong) JSContext *jsContext;

3.获取webview的上下文

在页面加载完成时，获取webview的上下文 ，并将对象注入js内

- (void)webViewDidFinishLoad:(UIWebView *)webView{
    //获取webview的上下文
    self.jsContext = [self.webView valueForKeyPath:@"documentView.webView.mainFrame.javaScriptContext"];
    //将对象注入js内,在JS中便可使用"ocObject"来调用oc的方法了
    self.jsContext[@"ocObject"] = self;
}

4.定义与js交互的协议

只有在这个协议中声明并实现的方法,才能够在js中调用

// JSExport 定义与js交互的协议
@protocol JSExportDelagte 
-(void)ocFunction:(NSString *)string;
@end

#pragma -mark JSExportDelagte
-(void)ocFunction:(NSString *)string{
    UIAlertView *av = [[UIAlertView alloc] initWithTitle:@"提示" message:string delegate:nil cancelButtonTitle:nil otherButtonTitles:@"确定", nil];
    [av show];
}

5.js可以调用OC的原生方法了

//js

6.OC调用js方法

通过JSValue获取js方法并调用

//js

//oc
-(void)ocCallJSFunction{
    //在oc中调用js方法
    JSValue *jsValue = self.jsContext[@"jsFunction"];
    [jsValue callWithArguments:nil];
}

7.通过block可以传递多个参数

//oc
- (void)webViewDidFinishLoad:(UIWebView *)webView{
    //在页面加载完成时，获取webview的上下文 ，并将对象注入js内
    self.jsContext = [self.webView valueForKeyPath:@"documentView.webView.mainFrame.javaScriptContext"];
    
    //使用block 可以实现多个参数传递(由js传递到oc)
    self.jsContext[@"ocBlock"] = ^(NSString *name,NSString *age) {
        NSString *info = [NSString stringWithFormat:@"我的名字叫做:%@,今年%@岁了!",name,age];
        UIAlertView *av = [[UIAlertView alloc] initWithTitle:@"提示" message:info delegate:nil cancelButtonTitle:nil otherButtonTitles:@"确定", nil];
        [av show];
    };
}

//js

---

Demo代码

ViewController.m

#import "ViewController.h"
#import 

// JSExport 定义与js交互的协议
@protocol JSExportDelagte 
-(void)ocFunction:(NSString *)string;
-(void)ocCallJSFunction;
@end

@interface ViewController ()
@property(nonatomic,strong) UIWebView *webView;
@property(nonatomic,strong) JSContext *jsContext;
@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    
    self.webView = [[UIWebView alloc] initWithFrame:[UIScreen mainScreen].bounds];
    [self.view addSubview:self.webView];
    NSURL *url = [[NSBundle mainBundle] URLForResource:@"index" withExtension:@"html"];
    self.webView.delegate = self;
    [self.webView loadRequest:[NSURLRequest requestWithURL:url]];
}

- (void)webViewDidFinishLoad:(UIWebView *)webView{
    
    //在页面加载完成时，获取webview的上下文 ，并将对象注入js内
    self.jsContext = [self.webView valueForKeyPath:@"documentView.webView.mainFrame.javaScriptContext"];
    //在js中,便可使用ocObject来调用oc中的方法了
    self.jsContext[@"ocObject"] = self;
    
    //使用block 可以实现多个参数传递(由js传递到oc)
    self.jsContext[@"ocBlock"] = ^(NSString *name,NSString *age) {
        NSString *info = [NSString stringWithFormat:@"我的名字叫做:%@,今年%@岁了!",name,age];
        UIAlertView *av = [[UIAlertView alloc] initWithTitle:@"提示" message:info delegate:nil cancelButtonTitle:nil otherButtonTitles:@"确定", nil];
        [av show];
    };
}

#pragma -mark JSExportDelagte
-(void)ocFunction:(NSString *)string{
    UIAlertView *av = [[UIAlertView alloc] initWithTitle:@"提示" message:string delegate:nil cancelButtonTitle:nil otherButtonTitles:@"确定", nil];
    [av show];
}
-(void)ocCallJSFunction{
    //在oc中调用js方法
    JSValue *jsValue = self.jsContext[@"jsFunction"];
    [jsValue callWithArguments:nil];
}

-(void)sumA:(int)a andB:(int)b{
    NSString *s = [NSString stringWithFormat:@"%d+%d=%d",a,b,a+b];
    UIAlertView *av = [[UIAlertView alloc] initWithTitle:@"计算结果" message:s delegate:nil cancelButtonTitle:nil otherButtonTitles:@"确定", nil];
    [av show];
}

@end

index.html