APP的很大一部分功能都是原生和前端交互的,所以总结一下吧!
最低支持iOS 8.0,所以能用WebKit的地方就没有用UIWebView。
直接说交互吧,我个人站在iOS的角度来理解的交互有两种,一种正向交互,一种逆向交互。正向交互就是H5来调用原生,逆向交互就是原生调用H5,纯粹是个人见解,不喜勿喷。
1、创建
//要用WKWebView肯定需要引入库,有两种方式
1> #import <WebKit/WebKit.h>
2> @import WebKit;
// 一般常用的估计是第一种吧,第二种比较少见,引入系统库的时候可以采用这种方式
// 一般还是声明的全局属性
@property (nonatomic,strong) WKWebView *webView;
// 创建可以直接创建也可以采用懒加载
- (void)creatWebView{
WKWebViewConfiguration *configuration = [[WKWebViewConfiguration alloc] init]
WKUserContentController *userContentController =[[WKUserContentController alloc]init];
configuration.userContentController = userContentController;
// 根据需要去设置对应的属性
WKWebView *webView = [[WKWebView alloc]initWithFrame:self.view.bounds configuration:configuration];
webView.navigationDelegate = self;
[self.view addSubview:webView];
NSMutableURLRequest *request = [NSMutableURLRequest requestWithURL:[NSURL URLWithString:@"URL地址"]];
[self.webView loadRequest:request];
}
2、代理
@protocol WKNavigationDelegate <NSObject>
@optional
//请求之前,决定是否要跳转:用户点击网页上的链接,需要打开新页面时,将先调用这个方法。
- (void)webView:(WKWebView *)webView decidePolicyForNavigationAction:(WKNavigationAction *)navigationAction decisionHandler:(void (^)(WKNavigationActionPolicy))decisionHandler;
//接收到相应数据后,决定是否跳转
- (void)webView:(WKWebView *)webView decidePolicyForNavigationResponse:(WKNavigationResponse *)navigationResponse decisionHandler:(void (^)(WKNavigationResponsePolicy))decisionHandler;
//页面开始加载时调用
- (void)webView:(WKWebView *)webView didStartProvisionalNavigation:(null_unspecified WKNavigation *)navigation;
// 主机地址被重定向时调用
- (void)webView:(WKWebView *)webView didReceiveServerRedirectForProvisionalNavigation:(null_unspecified WKNavigation *)navigation;
// 页面加载失败时调用
- (void)webView:(WKWebView *)webView didFailProvisionalNavigation:(null_unspecified WKNavigation *)navigation withError:(NSError *)error;
// 当内容开始返回时调用
- (void)webView:(WKWebView *)webView didCommitNavigation:(null_unspecified WKNavigation *)navigation;
// 页面加载完毕时调用
- (void)webView:(WKWebView *)webView didFinishNavigation:(null_unspecified WKNavigation *)navigation;
//跳转失败时调用
- (void)webView:(WKWebView *)webView didFailNavigation:(null_unspecified WKNavigation *)navigation withError:(NSError *)error;
// 如果需要证书验证,与使用AFN进行HTTPS证书验证是一样的
- (void)webView:(WKWebView *)webView didReceiveAuthenticationChallenge:(NSURLAuthenticationChallenge *)challenge completionHandler:(void (^)(NSURLSessionAuthChallengeDisposition disposition, NSURLCredential *__nullable credential))completionHandler;
//9.0才能使用,web内容处理中断时会触发
- (void)webViewWebContentProcessDidTerminate:(WKWebView *)webView NS_AVAILABLE(10_11, 9_0);
@end
3、交互
// 首先说正交互吧
// webView创建后调用addScriptMessageHandler:方法,上接creatWebView方法
// 此处的“goBack”为iOS端与前端约定好的
[_userContentController addScriptMessageHandler:delegateController name:@"goBack"];
// 然后
- (void)userContentController:(WKUserContentController *)userContentController didReceiveScriptMessage:(WKScriptMessage *)message {
if ([message.name isEqualToString:@"goBack"]) {
// 如果监控到前端调用了 'goBack' 方法代码就会走进来,在这里做处理就行了
}
}
4、坑
以上代码写完后并不是万事大吉了,你会发现在当前控制器消失时并不会走dealloc方法
原因就在于调用了 'addScriptMessageHandler' 方法
// 点进头文件后你会发现方法是成对出现的
- (void)addScriptMessageHandler:(id <WKScriptMessageHandler>)scriptMessageHandler name:(NSString *)name;
- (void)removeScriptMessageHandlerForName:(NSString *)name;
// 既然有 'add' 那就有 'remove'
// 但是remove的时机就有点好玩了
// 在此我总结了几种
// 1> 'add' 在 viewDidLoad 调用,'remove' 在 viewWillDisappear调用
// 这种写法并不是不可以,前提是当前页面没有二级页面了,如果有二级页面就不能这么写
// 2> 'add' 在 viewDidLoad 调用,'remove' 在当前页面的 'pop' 方法调用
// 次方法解决了第一种方法的缺陷,但是还有一个问题,如果当前页面有右滑返回手势的话就不行
// 3> 使用代理
@interface ViewController ()<WKDelegate,WKNavigationDelegate,WKScriptMessageHandler>{
WKWebView * webView;
WKUserContentController* userContentController;
}
@end
@implementation ViewController
#pragma mark - lifeCircle
- (void)viewDidLoad {
[super viewDidLoad];
WKWebViewConfiguration * configuration = [[WKWebViewConfiguration alloc]init];
userContentController =[[WKUserContentController alloc]init];
configuration.userContentController = userContentController;
webView = [[WKWebView alloc]initWithFrame:CGRectMake(0, 0, 100, 100) configuration:configuration];
WKDelegateController * delegateController = [[WKDelegateController alloc]init];
delegateController.delegate = self;
[userContentController addScriptMessageHandler:delegateController name:@"sayhello"];
[self.view addSubview:webView];
webView.navigationDelegate = self;
[webView loadRequest:[NSURLRequest requestWithURL:[NSURL URLWithString:@"URL地址"]]];
}
- (void)dealloc{
//这里需要注意,前面增加过的方法一定要remove掉。
[userContentController removeScriptMessageHandlerForName:@"goBack"];
}
// 发现代理是最好的一种方式
WKDelegateController.h代码:
#import <UIKit/UIKit.h>
#import <WebKit/WebKit.h>
@protocol WKDelegate <NSObject>
- (void)userContentController:(WKUserContentController *)userContentController didReceiveScriptMessage:(WKScriptMessage *)message;
@end
@interface WKDelegateController : UIViewController <WKScriptMessageHandler>
@property (weak , nonatomic) id<WKDelegate> delegate;
@end
WKDelegateController.m代码:
#import "WKDelegateController.h"
@interface WKDelegateController ()
@end
@implementation WKDelegateController
- (void)viewDidLoad {
[super viewDidLoad];
// Do any additional setup after loading the view.
}
- (void)userContentController:(WKUserContentController *)userContentController didReceiveScriptMessage:(WKScriptMessage *)message{
if ([self.delegate respondsToSelector:@selector(userContentController:didReceiveScriptMessage:)]) {
[self.delegate userContentController:userContentController didReceiveScriptMessage:message];
}
}
@end
5、原生调用JS代码
// 在需要调用JS的地方执行如下代码
// 有参数
[self.webView evaluateJavaScript@"postInfo('参数1,参数2')"completionHandler:nil];
// 无参数
[self.webView evaluateJavaScript@"postInfo()"completionHandler:nil];
// 此处的 'postInfo()' 是前端的方法,需要前端告诉你
网友评论