WkWebView和UIWebView及底层实现

背景：

UIWebView是在iOS2推出的，在iOS8之后，使用WKWebView来取代UIWebView。因为UIWebView加载速度慢，占用内存多，优化困难，所以iOS8以后，苹果推出了新框架Webkit，提供了组件WKWebView。

注意：WKWebView在ios8系统上，JS进行post请求有数据不正确的问题，所以从ios9开始使用WKWebView(静等ios8以下系统被淘汰)

##UIWebView

一、初始化与三种加载方式

UIWebView继承于UIView，因此，其初始化方法和一般的view一样，通过alloc和init进行初始化，其加载数据的方式有三种：

//1，这是加载网页最常用的一种方式，通过一个网页URL来进行加载，这个URL可以是远程的也可以是本地的，例如我加载百度的主页
- (void)loadRequest:(NSURLRequest *)request;

//2，这个方法需要将html文件读取为字符串，其中baseURL是我们自己设置的一个路径，用于寻找html文件中引用的图片等素材。
- (void)loadHTMLString:(NSString *)string baseURL:(NSURL *)baseURL;

//3，这个方式使用的比较少，但也更加自由，其中data是文件数据，MIMEType是文件类型，textEncodingName是编码类型，baseURL是素材资源路径。
- (void)loadData:(NSData *)data MIMEType:(NSString *)MIMEType textEncodingName:(NSString *)textEncodingName baseURL:(NSURL *)baseURL;

##二、一些常用的属性和变量

//设置webView的代理
@property (nonatomic, assign) id <UIWebViewDelegate> delegate;
//内置的scrollView
@property(nonatomic, readonly, retain) UIScrollView *scrollView;
//URL请求
@property(nonatomic, readonly, retain) NSURLRequest *request;

//重新加载数据
- (void)reload;
//停止加载数据
- (void)stopLoading;
//返回上一级
- (void)goBack;
//跳转下一级
- (void)goForward;

//获取能否返回上一级
@property(nonatomic, readonly, getter=canGoBack) BOOL canGoBack;
//获取能否跳转下一级
@property (nonatomic, readonly, getter=canGoForward) BOOL canGoForward;
//获取是否正在加载数据
@property (nonatomic, readonly, getter=isLoading) BOOL loading;
//通过javaScript操作web数据
- (NSString *)stringByEvaluatingJavaScriptFromString:(NSString *)script;       

//设置是否缩放到适合屏幕大小
@property (nonatomic) BOOL scalesPageToFit;

//设置某些数据变为链接形式，这个枚举可以设置如电话号，地址，邮箱等转化为链接
@property (nonatomic) UIDataDetectorTypes dataDetectorTypes NS_AVAILABLE_IOS(3_0);

//设置是否使用内联播放器播放视频
@property (nonatomic) BOOL allowsInlineMediaPlayback NS_AVAILABLE_IOS(4_0);

//设置视频是否自动播放
@property (nonatomic) BOOL mediaPlaybackRequiresUserAction NS_AVAILABLE_IOS(4_0);

//设置音频播放是否支持ari play功能
@property (nonatomic) BOOL mediaPlaybackAllowsAirPlay NS_AVAILABLE_IOS(5_0);

//设置是否将数据加载如内存后渲染界面
@property (nonatomic) BOOL suppressesIncrementalRendering NS_AVAILABLE_IOS(6_0);

//设置用户交互模式
@property (nonatomic) BOOL keyboardDisplayRequiresUserAction NS_AVAILABLE_IOS(6_0);               

##三、iOS7中的一些新特性

//这个属性用来设置一种模式，当网页的大小超出view时，将网页以翻页的效果展示，枚举如下
@property (nonatomic) UIWebPaginationMode paginationMode NS_AVAILABLE_IOS(7_0);

typedef NS_ENUM(NSInteger, UIWebPaginationMode) {
    UIWebPaginationModeUnpaginated,//不使用翻页效果
    UIWebPaginationModeLeftToRight,//将网页超出部分分页，从左向右进行翻页
    UIWebPaginationModeTopToBottom,//将网页超出部分分页，从上向下进行翻页
    UIWebPaginationModeBottomToTop,//将网页超出部分分页，从下向上进行翻页
    UIWebPaginationModeRightToLeft//将网页超出部分分页，从右向左进行翻页
};

//设置每一页的长度
@property (nonatomic) CGFloat pageLength NS_AVAILABLE_IOS(7_0);

//设置每一页的间距
@property (nonatomic) CGFloat gapBetweenPages NS_AVAILABLE_IOS(7_0);
 
//获取分页数
@property (nonatomic, readonly) NSUInteger pageCount NS_AVAILABLE_IOS(7_0);

四、代理方法

UIWebView有一个UIWebViewDelegate

//网页加载之前会调用此方法（这个方法在每次进行加载网页的时候都会执行,可以监听每一次webView发送的请求）
-(BOOL)webView:(UIWebView )webView shouldStartLoadWithRequest:(NSURLRequest )request navigationType:(UIWebViewNavigationType)navigationType
{
//retrun YES 表示正常加载网页
//返回NO 将停止网页加载
return YES;
}

//开始加载网页调用此方法
-(void)webViewDidStartLoad:(UIWebView *)webView
{
}

//网页加载完成调用此方法
-(void)webViewDidFinishLoad:(UIWebView *)webView
{
}

//网页加载失败 调用此方法
-(void)webView:(UIWebView )webView didFailLoadWithError:(NSError )error
{
}

JS交互

#####oc调用js：

[UIWebview stringByEvaluatingJavaScriptFromString:javaScriptString];

######js调用oc：
拦截url scheme（自定义的url）

- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType
{
    NSURL * url = [request URL];
    if ([[url scheme] isEqualToString:@"firstclick"])
    //做参数的拼接
}

而在iOS 7之后，apple添加了一个新的库JavaScriptCore，用来做js交互。

//首先导入JavaScriptCore库, 然后在OC中获取JS的上下文。
JSContext *context = [self.webView valueForKeyPath:@"documentView.webView.mainFrame.javaScriptContext"];

JSContext：js执行环境，包含了js执行时所需要的所有函数和对象；
js执行时，会在执行环境搜索需要的函数然后执行，或者保存传入的变量或函数；

context[@"share"] = ^() {
        NSLog(@"+++++++Begin Log+++++++");
        NSArray *args = [JSContext currentArguments];
        NSMutableString *strM = [NSMutableString string];
        for (JSValue *jsVal in args) {
            NSLog(@"%@", jsVal.toString);
            [strM appendString:jsVal.toString];
        }

使用JSContext 的方法-evaluateScript，可以实现 OC 调用 JS 方法

// 法一 
- (void)transferJS { 
    JSContext *context = [self.webView valueForKeyPath:@"documentView.w