iOS中OC与JS互调

在app中,经常会嵌入一下HTML 界面,避免不了和JS进行一些交互。
iOS端,经常使用的控件是WKWebView和UIWebView。
今天我来简单的介绍一下,OC与JS互调的方法,以下方法应该可以满足各位码农的一般使用!

下面废话少说,上代码!!!

一、WKWebView 与 OC 的互调

HTML代码


    
        
            WkWebView与JS互调
    
    
        
        
        
    

把以上的创建一个HTML,并把上面的HTML的代码复制到里面,然后,把HTML的工程文件复制到你的工程里面。
创建WKWebView,并把HTML加载到WKWebView。

 /** 加载HTML  */
NSURL *filePath = [[NSBundle mainBundle] URLForResource:@"untitled.html" withExtension:nil];
    NSURLRequest *request = [NSURLRequest requestWithURL:filePath];
    
    /** 以下 方法会接受OC传给JS 的参数 之后再打印出来  */
    WKWebViewConfiguration *theConfiguration = [[WKWebViewConfiguration alloc]init];
    [theConfiguration.userContentController addScriptMessageHandler:self name:@"myName"];
    /** 以上 */
    
    self.wkWeb = [[WKWebView alloc] initWithFrame:self.view.bounds configuration:theConfiguration];
    self.wkWeb.backgroundColor = [UIColor redColor];
    self.wkWeb.navigationDelegate = self;
    self.wkWeb.UIDelegate = self;
    self.wkWeb.clipsToBounds = YES;
    [self.view addSubview:self.wkWeb];
    [self.wkWeb loadRequest:request];

1、OC调用JS

// 页面加载完成之后调用
- (void)webView:(WKWebView *)webView didFinishNavigation:(WKNavigation *)navigation{
    
    /** 此方法是向JS代码传参数 */
    NSString * jsStr = [NSString stringWithFormat:@"payResult('%@')",@"OC调用JS"];
    [self.wkWeb evaluateJavaScript:jsStr completionHandler:^(id _Nullable result, NSError * _Nullable error) {
        NSLog(@"==%@----%@",result, error);
    }];
}
/**
 *  此方法会接受 JS 的alert
 *  但是 JS 的alert 不会在客户端弹出,会接受到 弹窗要弹出的数据 然后可以打印出来
 *  OC 调用 JS
 */
- (void)webView:(WKWebView *)webView runJavaScriptAlertPanelWithMessage:(NSString *)message initiatedByFrame:(WKFrameInfo *)frame completionHandler:(void (^)(void))completionHandler  {
    
    UIAlertController *alertController = [UIAlertController alertControllerWithTitle:@"提示" message:message?:@"" preferredStyle:UIAlertControllerStyleAlert];
    [alertController addAction:([UIAlertAction actionWithTitle:@"确认" style:UIAlertActionStyleDefault handler:^(UIAlertAction * _Nonnull action) {
        completionHandler();
    }])];
    [self presentViewController:alertController animated:YES completion:nil];
}

2、JS调用OC

/**
 *  使用此方法的回调
 *  WKWebViewConfiguration *theConfiguration = [[WKWebViewConfiguration alloc]init];
 *  [theConfiguration.userContentController addScriptMessageHandler:self name:@"myName"];
 *  JS 调用 OC
 */
- (void)userContentController:(WKUserContentController *)userContentController
      didReceiveScriptMessage:(WKScriptMessage *)message {
    
    NSString *str = message.body;
    UIAlertView * messAlert = [[UIAlertView alloc] initWithTitle:nil message:str delegate:nil cancelButtonTitle:@"yes"otherButtonTitles:nil,nil];
    [messAlert show];
}

二、UIWebView 与 OC 的互调

HTML代码

    
        
        iOS上webView与JS交互的之oc调用js的demo
        
    
    
        

下面是网页

1、OC调用JS

- (IBAction)UIWebviewOCAndJS:(id)sender {
    
    [self.webView stringByEvaluatingJavaScriptFromString:[NSString stringWithFormat:@"showTitleMessage('%@')",@"WebView oc调用了js的内容"]];
}

2、JS调用OC

- (void)webViewDidFinishLoad:(UIWebView *)webView {
    
    JSContext *content = [self.webView valueForKeyPath:@"documentView.webView.mainFrame.javaScriptContext"];
    
    content[@"bdgtasdw"] = ^() {
        NSLog(@"js调用oc---------begin--------");
        NSArray *thisArr = [JSContext currentArguments];
        
        dispatch_async(dispatch_get_main_queue(), ^{
            
            for (JSValue *jsValue in thisArr) {
                
                UIAlertView * messAlert = [[UIAlertView alloc] initWithTitle:nil message:[NSString stringWithFormat:@"%@",jsValue] delegate:nil cancelButtonTitle:@"yes"otherButtonTitles:nil,nil];
                [messAlert show];
            }
        });
        
        NSLog(@"js调用oc---------The End-------");
    };
}

Demo地址
希望以上的内容会对你有所启发!

你可能感兴趣的:(iOS中OC与JS互调)