在上篇文章中讲述了使用UIWebView拦截URL的方式来处理JS与OC交互。
由于UIWebView比较耗内存,性能上不太好,而苹果在iOS 8中推出了WKWebView。
同样的用WKWebView也可以拦截URL,做JS 与OC交互。关于WKWebView与UIWebView的对比,大家请自动百度或者google。

  打开百度网页前 打开百度网页后
UIWebView 内存47M 内存75.6M,最高峰83M
WKWebView 内存47M 内存51M

WKWebView 拦截URL

WKWebView 与 UIWebView 拦截URL 的处理方式基本一样。除了代理方法和WKWebView的使用不太一样,关于WKWebView更详尽的讲解和用法,还是自行搜索学习,本文重点还是讲解如何实现JS 与OC 互相调用。

提醒:WKWebView 是iOS 8 推出的WebKit.framework中的控件,只有app 不需要兼容iOS 7及以下的时候才可以使用。

先看动态效果图:

1.创建WKWebView,加载本地HTML。

WKWebView的创建有几点不同:

  • 1.初始化多了个configuration参数,当然这个参数我们也可以不传,直接使用默认的设置就好。
  • 2.WKWebView的代理有两个navigationDelegateUIDelegate。我们要拦截URL,就要通过navigationDelegate的一个代理方法来实现。如果在HTML中要使用alert等弹窗,就必须得实现UIDelegate的相应代理方法。
  • 3.在iOS 9之前,WKWebView加载本地HTML会有一些问题。(不能加载本地HTML,或者部分CSS/本地图片加载不了等)

我这里创建WKWebView的示例代码是这样的:

    WKWebViewConfiguration *configuration = [[WKWebViewConfiguration alloc] init];configuration.userContentController = [WKUserContentController new];WKPreferences *preferences = [WKPreferences new];preferences.javaScriptCanOpenWindowsAutomatically = YES;preferences.minimumFontSize = 30.0;configuration.preferences = preferences;self.webView = [[WKWebView alloc] initWithFrame:self.view.frame configuration:configuration];NSString *urlStr = [[NSBundle mainBundle] pathForResource:@"index.html" ofType:nil];NSURL *fileURL = [NSURL fileURLWithPath:urlStr];[self.webView loadFileURL:fileURL allowingReadAccessToURL:fileURL];self.webView.navigationDelegate = self;[self.view addSubview:self.webView];

因为加载的本地HTML内容,跟上一篇UIWebView中介绍的HTML内容一样,所以关于HTML中的内容就不再讲解了。

2.拦截URL

使用WKNavigationDelegate中的代理方法,拦截自定义的URL来实现JS调用OC方法。

#pragma mark - WKNavigationDelegate
- (void)webView:(WKWebView *)webView decidePolicyForNavigationAction:(WKNavigationAction *)navigationAction decisionHandler:(void (^)(WKNavigationActionPolicy))decisionHandler
{NSURL *URL = navigationAction.request.URL;NSString *scheme = [URL scheme];if ([scheme isEqualToString:@"haleyaction"]) {[self handleCustomAction:URL];decisionHandler(WKNavigationActionPolicyCancel);return;}decisionHandler(WKNavigationActionPolicyAllow);
}

需要注意的是:

1.如果实现了这个代理方法,就必须得调用decisionHandler这个block,否则会导致app 崩溃。block参数是个枚举类型,WKNavigationActionPolicyCancel代表取消加载,相当于UIWebView的代理方法return NO的情况;WKNavigationActionPolicyAllow代表允许加载,相当于UIWebView的代理方法中 return YES的情况。
2.其他的关于为什么要统一设置scheme,在上一篇中讲过。

关于如何区分执行不同的OC 方法,也与UIWebView的处理方式一样,通过URL 的host 来区分执行不同的方法:

#pragma mark - private method
- (void)handleCustomAction:(NSURL *)URL
{NSString *host = [URL host];if ([host isEqualToString:@"scanClick"]) {NSLog(@"扫一扫");} else if ([host isEqualToString:@"shareClick"]) {[self share:URL];} else if ([host isEqualToString:@"getLocation"]) {[self getLocation];} else if ([host isEqualToString:@"setColor"]) {[self changeBGColor:URL];} else if ([host isEqualToString:@"payAction"]) {[self payAction:URL];} else if ([host isEqualToString:@"shake"]) {[self shakeAction];} else if ([host isEqualToString:@"goBack"]) {[self goBack];}
}

3.OC 调用 JS 方法

JS 调用OC 方法后,有的操作可能需要将结果返回给JS。这时候就是OC 调用JS 方法的场景。
WKWebView 提供了一个新的方法evaluateJavaScript:completionHandler:,实现OC 调用JS 等场景。

- (void)getLocation
{// 获取位置信息// 将结果返回给jsNSString *jsStr = [NSString stringWithFormat:@"setLocation('%@')",@"广东省深圳市南山区学府路XXXX号"];[self.webView evaluateJavaScript:jsStr completionHandler:^(id _Nullable result, NSError * _Nullable error) {NSLog(@"%@----%@",result, error);}];
}

evaluateJavaScript:completionHandler:没有返回值,JS 执行成功还是失败会在completionHandler 中返回。所以使用这个API 就可以避免执行耗时的JS,或者alert 导致界面卡住的问题。

4.WKWebView中使用弹窗

在上面提到,如果在WKWebView中使用alert、confirm 等弹窗,就得实现WKWebView的WKUIDelegate中相应的代理方法。
例如,我在JS中要显示alert 弹窗,就必须实现如下代理方法,否则alert 并不会弹出。

#pragma mark - WKUIDelegate
- (void)webView:(WKWebView *)webView runJavaScriptAlertPanelWithMessage:(NSString *)message initiatedByFrame:(WKFrameInfo *)frame completionHandler:(void (^)(void))completionHandler
{UIAlertController *alert = [UIAlertController alertControllerWithTitle:@"提醒" message:message preferredStyle:UIAlertControllerStyleAlert];[alert addAction:[UIAlertAction actionWithTitle:@"知道了" style:UIAlertActionStyleCancel handler:^(UIAlertAction * _Nonnull action) {completionHandler();}]];[self presentViewController:alert animated:YES completion:nil];
}

其中completionHandler这个block 一定得调用,至于在哪里调用,倒是无所谓,我们也可以写在方法实现的第一行,或者最后一行。

iOS下JS与OC互相调用(二)--WKWebView 拦截URL相关推荐

  1. iOS下JS与OC互相调用(五)--UIWebView + WebViewJavascriptBridge

    WebViewJavascriptBridge是一个有点年代的JS与OC交互的库,使用该库的著名应用还挺多的,目前这个库有7000+star.我去翻看了它的第一版本已经是4年前了,在版本V4.1.4以 ...

  2. iOS下JS与OC互相调用(六)--WKWebView + WebViewJavascriptBridge

    2019独角兽企业重金招聘Python工程师标准>>> iOS下JS与OC互相调用(六)--WKWebView + WebViewJavascriptBridge 转载:原地址 ht ...

  3. iOS下JS与OC互相调用(一)--UIWebView 拦截URL

    1.在JS 中做一次URL跳转,然后在OC中拦截跳转.(这里分为UIWebView 和 WKWebView两种,去年因为还要兼容iOS 6,所以没办法只能采用UIWebView来做.) 2.利用WKW ...

  4. iOS下JS与OC互相调用(四)--JavaScriptCore

    前面讲完拦截URL的方式实现JS与OC互相调用,终于到JavaScriptCore了.它是从iOS7开始加入的,用 Objective-C 把 WebKit 的 JavaScript 引擎封装了一下, ...

  5. iOS下JS与OC互相调用(三)--MessageHandler

    使用WKWebView的时候,如果想要实现JS调用OC方法,除了拦截URL之外,还有一种简单的方式.那就是利用WKWebView的新特性MessageHandler来实现JS调用原生方法. Messa ...

  6. iOS下JS与OC互相调用(七)--Cordova 基础

    Cordova 简介 在介绍Cordova之前,必须先提一下PhoneGap.PhoneGap 是Nitobi软件公司2008年推出的一个框架,旨在弥补web 和iOS 之间的不足,使得web 和 i ...

  7. iOS下JS与OC互相调用(八)--Cordova详解+实战

    1.新建工程,添加Cordova 关键类 我这里用Xcode 8 新建了一个工程,叫 JS_OC_Cordova,然后将Cordova关键类添加进工程. 有哪些关键类呢? 这里添加config.xml ...

  8. iOS下JS和原生交互,函数互调

    现在越来越多的APP都是H5和原生混合开发,这样确实方便快捷,但是H5的部分总避免不了很多与原生的交互,原生调JS函数还比较简单,原生的API函数stringByEvaluatingJavaScrip ...

  9. iOS中JS 与OC的交互(JavaScriptCore.framework)

    iOS中实现js与oc的交互,目前网上也有不少流行的开源解决方案: 如:react native 当然一些轻量级的任务使用系统提供的UIWebView 以及JavaScriptCore.framewo ...

最新文章

  1. 《潮流时装设计——世界顶级时装CAD制板技巧》——1.6 服装生产中各部位国际代号...
  2. 基于Springboot实现送水公司信息管理
  3. BUZZER Driver
  4. css3替代图片的尖角圆角效果
  5. 弄懂CNN,然后提升准确率4.21-4.27
  6. notepad正则删除关键词所在行
  7. 尽力去帮助一个陌生人
  8. 编写高质量代码的50条黄金守则-Day 03(首选is或as而不是强制类型转换)
  9. day24-抽象类与接口类
  10. python做一个小游戏_利用python做个小游戏
  11. TODO算子-双Value类型的操作
  12. 微信小程序开发--【Hello World 及代码结构】(二)
  13. head first设计模式之设计原则
  14. 泡沫一般是执行什么标准呢?
  15. Excel获取目标时间点/日期的方法
  16. 上海计算机科学大学排名,2019上海软科世界一流学科排名计算机科学与工程专业排名卡耐基梅隆大学排名第4...
  17. MMORPG开发入门[转]
  18. python中keys的用法_在Python中用keys()方法返回字典键的教程
  19. 论文解读:Making Pre-trained Language Models Better Few-shot Learners(LM-BFF)
  20. 高等数学 - 条件收敛和绝对收敛有什么区别

热门文章

  1. bug诞生记——信号(signal)处理导致死锁
  2. C++中前置声明介绍
  3. 【数据库】sqlite3常用命令及SQL语句
  4. 【Qt】pro 笔记
  5. 【OpenCV】cv::VideoCapture 多线程测试
  6. android8 通知呼吸灯_Android中通知Notification使用实例(振动、灯光、声音)
  7. Java学习总结:1
  8. ios 自动打包命令_iOS自动打包上传脚本
  9. CSS之布局(盒子的尺寸)
  10. python的matplotlib背景线_python中matplotlib的颜色及线条 控制