WKWebView和JS交互

直接上代码

#import "ViewController.h"
#import 
@interface ViewController ()
@property (strong, nonatomic) WKWebView *wkweb;
@property (weak, nonatomic) IBOutlet UIButton *button1;
@property (weak, nonatomic) IBOutlet UIButton *button2;
@property (weak, nonatomic) IBOutlet UIButton *getNameBtn;

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    [self testWKJS];
}
- (void)testWKJS{
    WKWebViewConfiguration *config = [[WKWebViewConfiguration alloc] init];
    [config.userContentController addScriptMessageHandler:self name:@"webViewApp22"];
    self.wkweb = [[WKWebView alloc] initWithFrame:CGRectMake(0, 0, CGRectGetWidth(self.view.frame), CGRectGetHeight(self.view.frame)-100) configuration:config];
    self.wkweb.UIDelegate = self;
    [self.view addSubview:self.wkweb];
    NSURLRequest *request = [[NSURLRequest alloc] initWithURL:[NSURL fileURLWithPath:[[NSBundle mainBundle] pathForResource:@"index" ofType:@"html"]]];
    [self.wkweb loadRequest:request];
   
}
//app注册方法后，js调用ios的委托
- (void)userContentController:(WKUserContentController *)userContentController didReceiveScriptMessage:(WKScriptMessage *)message{
    NSDictionary *body = (NSDictionary *)message.body;
    if (body && [body isKindOfClass:[NSDictionary class]]) {
        NSString *method = [NSString stringWithFormat:@"%@",body[@"method"]];
        NSString *param1 = [NSString stringWithFormat:@"%@",body[@"param1"]];
        if ([method isEqualToString:@"hello"]) {
            [self hello:param1];
        }
    }
}
//js端的alert需要客户端协助才能弹框，其实就是js告诉客户端我要弹框了，然后客户端负责实现弹框。
- (void)webView:(WKWebView *)webView runJavaScriptAlertPanelWithMessage:(NSString *)message initiatedByFrame:(WKFrameInfo *)frame completionHandler:(void (^)(void))completionHandler{
    completionHandler();
    UIAlertController *alertCon = [UIAlertController alertControllerWithTitle:@"客户端弹框" message:message preferredStyle:(UIAlertControllerStyleAlert)];
    UIAlertAction *ok = [UIAlertAction actionWithTitle:@"ok" style:UIAlertActionStyleDefault handler:^(UIAlertAction * _Nonnull action) {
        
    }];
    UIAlertAction *cancle = [UIAlertAction actionWithTitle:@"cancle" style:UIAlertActionStyleCancel handler:^(UIAlertAction * _Nonnull action) {
        
    }];
    [alertCon addAction:ok];
    [alertCon addAction:cancle];
    [self presentViewController:alertCon animated:YES completion:nil];
}
//js调用本地方法
-(void)hello:(NSString *)name{
    NSLog(@"js-调用本地方法-name=%@",name);
}
//app调用js方法
- (IBAction)button1:(id)sender {
    [self.wkweb evaluateJavaScript:@"hi()" completionHandler:nil];
}
//app调用js并传递值@“123”
- (IBAction)button2:(id)sender {
    [self.wkweb evaluateJavaScript:@"hello('wqq')" completionHandler:nil];
}
//app调用js方法并从js获取值
- (IBAction)getName:(id)sender {
    [self.wkweb evaluateJavaScript:@"getName()" completionHandler:^(id _Nullable result, NSError * _Nullable error) {
        NSLog(@"result===%@",result);
    }];
}

代码中需要注意的几点：

ios代码段

js代码段

PS:以上两张图中的红色框框中的字符串一定要一致。否则js调用ios代码会失效的。

Demo git 链接地址
里面用到了原作者的一些资源文件，如有异议，请留言删除。原文地址