iOS-WKWebView(post请求的一个Bug)

WKWebView

1 在性能、稳定性、功能方面有很大提升
2 和 Safari 相同的 JavaScript 引擎,允许JavaScript的Nitro库加载并使用(UIWebView中限制);

WKWebView使用

// 创建webview
WKWebView *webView = [[WKWebView alloc] initWithFrame:self.view.bounds];
// 创建请求
NSURLRequest *request =[NSURLRequest requestWithURL:[NSURL URLWithString:@"http://www.baidu.com"]];
// 加载网页
[webView loadRequest:request];
// 将webView添加到界面
[self.view addSubview:webView];

WKWebView操作JS
WKWebView加载JS

//JS文件路径
NSString *jsPath = [[NSBundle mainBundle] pathForResource:@"demo" ofType:@"js"];
//读取JS文件内容
NSString *jsContent = [NSString stringWithContentsOfFile:jsPath encoding:NSUTF8StringEncoding error:nil];
//创建用户脚本对象,
//WKUserScriptInjectionTimeAtDocumentStart :HTML文档创建后,完成加载前注入,类似于中
//WKUserScriptInjectionTimeAtDocumentEnd :HTML文件完成加载后注入,类似于中
WKUserScript *script = [[WKUserScript alloc] initWithSource:jsContent injectionTime:WKUserScriptInjectionTimeAtDocumentStart forMainFrameOnly:YES];
//添加用户脚本
[webView.configuration.userContentController addUserScript:script];

WKWebView执行JS方法

//执行JS方法
[webView evaluateJavaScript:@"test()" completionHandler:^(id _Nullable result, NSError * _Nullable error) {
    //result为执行js方法的返回值
    if(error){
        NSLog(@"Success");
    }else{
        NSLog(@"Fail");
    }
}];

WKWebView代理方法
WKNavigationDelegate 协议 导航监听

iOS-WKWebView(post请求的一个Bug)_第1张图片
WKNavigationDelegate
#pragma mark - WKNavigationDelegate
// 页面开始加载时调用
#UIWebViewDelegate: - webView:shouldStartLoadWithRequest:navigationType
- (void)webView:(WKWebView *)webView didStartProvisionalNavigation:(WKNavigation *)navigation {
NSLog(@"%s",__FUNCTION__);
}

// 内容开始返回时调用(view的过渡动画可在此方法中加载)
#UIWebViewDelegate: - webViewDidStartLoad:
- (void)webView:(WKWebView *)webView didCommitNavigation:(WKNavigation *)navigation {
NSLog(@"%s",__FUNCTION__);
}
// 页面加载完成时调用(view的过渡动画的移除可在此方法中进行)
#UIWebViewDelegate: - webViewDidFinishLoad:
- (void)webView:(WKWebView *)webView didFinishNavigation:(WKNavigation *)navigation {
NSLog(@"%s",__FUNCTION__);
}
// 页面加载失败时调用
#UIWebViewDelegate: - webView:didFailLoadWithError:
#WKNavigationDelegate: - webView:didFailNavigation:withError:
- (void)webView:(WKWebView *)webView didFailProvisionalNavigation:(WKNavigation *)navigation{
NSLog(@"%s",__FUNCTION__);
}

三个页面跳转的代理方法:

#pragma mark WKNavigation 当web视图需要响应身份验证跳转时调用
- (void)webView:(WKWebView *)webView didReceiveAuthenticationChallenge:(NSURLAuthenticationChallenge *)challenge completionHandler:(void (^)(NSURLSessionAuthChallengeDisposition disposition, NSURLCredential * credential))completionHandler{
}
#pragma mark 接收到服务器跳转请求之后调用
- (void)webView:(WKWebView *)webView didReceiveServerRedirectForProvisionalNavigation:(WKNavigation *)navigation {
}
#pragma mark 在收到响应后,决定是否跳转
- (void)webView:(WKWebView *)webView decidePolicyForNavigationResponse:(WKNavigationResponse *)navigationResponse decisionHandler:(void (^)(WKNavigationResponsePolicy))decisionHandler {
}
#pragma mark 在发送请求之前,决定是否跳转
- (void)webView:(WKWebView *)webView decidePolicyForNavigationAction:(WKNavigationAction *)navigationAction decisionHandler:(void (^)(WKNavigationActionPolicy))decisionHandler {
//需执行decisionHandler的block。
}

Native调用JavaScript方法

原生调用JavaScript的代码需要在页面加载完成之后,就是在 - webView:didFinishNavigation:代理方法里面
OC代码:
[webView evaluateJavaScript:@"showAlert('奏是一个弹框')" completionHandler:^(id item, NSError * _Nullable error) {
        // Block中处理是否通过了或者执行JS错误的代码
    }];

JavaScript调用Native方法

JavaScript的配置
window.webkit.messageHandlers.NativeMethod.postMessage("就是一个消息啊");
这个NativeMethod是和App中要统一的,配置方法将在下面的Native中书写。

Native App的代码配置
创建WKWebView除了有- initWithFrame:方法外,还有一个高端的方法:- initWithFrame:configuration:方法

      // 创建配置
      WKWebViewConfiguration *config = [[WKWebViewConfiguration alloc] init];
      // 创建UserContentController(提供JavaScript向webView发送消息的方法)
      WKUserContentController* userContent = [[WKUserContentController alloc] init];
      // 添加消息处理,注意:self指代的对象需要遵守WKScriptMessageHandler协议,结束时需要移除
      [userContent addScriptMessageHandler:self name:@"NativeMethod"];
      // 将UserConttentController设置到配置文件
      config.userContentController = userContent;
      // 高端的自定义配置创建WKWebView
      WKWebView *webView = [[WKWebView alloc] initWithFrame:[UIScreen mainScreen].bounds configuration:config];
      // 设置访问的URL
      NSURL *url = [NSURL URLWithString:@"http://www.jianshu.com"];
      // 根据URL创建请求
      NSURLRequest *request = [NSURLRequest requestWithURL:url];
      // WKWebView加载请求
      [webView loadRequest:request];
      // 将WKWebView添加到视图
      [self.view addSubview:webView];

可以看到,添加消息处理的handler的name,就是JavaScript中调用时候的NativeMethod,这两个要保持一致。请把URL换成你自己的。

请注意第6行的代码配置当前ViewController为MessageHandler,需要服从WKScriptMessageHandler协议,如果出现警告⚠️,请检查是否服从了这个协议。

注意!注意!注意:上面将当前ViewController设置为MessageHandler之后需要在当前ViewController销毁前将其移除,否则会造成内存泄漏。

移除的代码如下:
[webView.configuration.userContentController removeScriptMessageHandlerForName:@"NativeMethod"];
      

WKUIDelegate 协议 网页监听


iOS-WKWebView(post请求的一个Bug)_第2张图片
WKUIDelegate
    #pragma mark - WKUIDelegate
  /// 创建一个新的WebView
  - (WKWebView *)webView:(WKWebView *)webView createWebViewWithConfiguration:(WKWebViewConfiguration *)configuration forNavigationAction:(WKNavigationAction *)navigationAction windowFeatures:(WKWindowFeatures *)windowFeatures {
      return nil;
  }
  - (void)webView:(WKWebView *)webView runJavaScriptAlertPanelWithMessage:(NSString *)message initiatedByFrame:(void (^)())completionHandler {

  }
  /// 输入框
  - (void)webView:(WKWebView *)webView runJavaScriptTextInputPanelWithPrompt:(NSString *)prompt defaultText:(nullable NSString *)defaultText initiatedByFrame:(WKFrameInfo *)frame completionHandler:(void (^)(NSString * __nullable result))completionHandler {
  }
  /// 确认框
  - (void)webView:(WKWebView *)webView runJavaScriptConfirmPanelWithMessage:(NSString *)message initiatedByFrame:(WKFrameInfo *)frame completionHandler:(void (^)(BOOL result))completionHandler {

  }
  /// 警告框
  - (void)webView:(WKWebView *)webView runJavaScriptAlertPanelWithMessage:(NSString *)message initiatedByFrame:(WKFrameInfo *)frame completionHandler:(void (^)(void))completionHandler {

  }

加载顺序

iOS-WKWebView(post请求的一个Bug)_第3张图片
百度测试

WKWebView增加的属性

1 WKWebViewConfiguration *configuration:初始化WKWebView的时候的配置,后面会用到
2 WKBackForwardList *backForwardList:相当于访问历史的一个列表
3 double estimatedProgress:进度,有这个之后就不用自己写假的进度条了

解决WKWebView加载POST请求无法发送参数问题

使用JavaScript解决WKWebView无法发送POST参数问题
1 将一个包含JavaScript的POST请求的HTML代码放到工程目录中
2 加载这个包含JavaScript的POST请求的代码到WKWebView
3 加载完成之后,用Native调用JavaScript的POST方法并传入参数来完成请求
  • 创建包含JavaScript的POST请求的HTML代码
 
 
     
 
 
 

  • 将对应的JavaScript代码通过加载本地网页的形式加载到WKWebView
 // JS发送POST的Flag,为真的时候会调用JS的POST方法(仅当第一次的时候加载本地JS)
 self.needLoadJSPOST = YES;
 // 创建WKWebView
 self.webView = [[WKWebView alloc] initWithFrame:[UIScreen mainScreen].bounds];
 //设置代理
 self.webView.navigationDelegate = self;
 // 获取JS所在的路径
 NSString *path = [[NSBundle mainBundle] pathForResource:@"JSPOST" ofType:@"html"];
 // 获得html内容
 NSString *html = [[NSString alloc] initWithContentsOfFile:path encoding:NSUTF8StringEncoding error:nil];
 // 加载js
 [self.webView loadHTMLString:html baseURL:[[NSBundle mainBundle] bundleURL]];
 // 将WKWebView添加到当前View
 [self.view addSubview:self.webView];
  • Native调用JavaScript脚本并传入参数来完成POST请求
Native调用JavaScript
 // 加载完成的代理方法
 - (void)webView:(WKWebView *)webView didFinishNavigation:(WKNavigation *)navigation {
     // 判断是否需要加载(仅在第一次加载)
     if (self.needLoadJSPOST) {
         // 调用使用JS发送POST请求的方法
         [self postRequestWithJS];
         // 将Flag置为NO(后面就不需要加载了)
         self.needLoadJSPOST = NO;
     }
 }
 // 调用JS发送POST请求
 - (void)postRequestWithJS {
     // 发送POST的参数
     NSString *postData = @"\"username\":\"aaa\",\"password\":\"123\"";
     // 请求的页面地址
     NSString *urlStr = @"http://www.postexample.com";
     // 拼装成调用JavaScript的字符串
     NSString *jscript = [NSString stringWithFormat:@"post('%@', {%@});", urlStr, postData];

     // NSLog(@"Javascript: %@", jscript);
     // 调用JS代码
     [self.webView evaluateJavaScript:jscript completionHandler:^(id object, NSError * _Nullable error) {
     }];
 }

你可能感兴趣的:(iOS-WKWebView(post请求的一个Bug))