美文网首页iOS-Developer-OC
IOS中WKWebView的使用及JS交互

IOS中WKWebView的使用及JS交互

作者: 怀心逝水 | 来源:发表于2017-12-07 16:10 被阅读392次
tooopen_sy_153049663495.jpg

这篇就没有效果图了,主要说说在WKWebView的使用和web前端的简单的交互吧。
知识点:
1.WKWebView对象的创建,当然这个很基础的。

- (WKWebView *)webView
{
    if (!_webView) {
        WKWebViewConfiguration * config = [[WKWebViewConfiguration alloc]init];
        config.userContentController = [[WKUserContentController alloc]init];
        _webView = [[WKWebView alloc] initWithFrame:CGRectZero configuration:config];
        _webView.allowsBackForwardNavigationGestures = YES;
        _webView.navigationDelegate = self;
        _webView.UIDelegate = self;
        _webView.scrollView.delegate = self;
    }
    return _webView;
}

2.WKWebView对象请求数据中头部数据的包装。

NSDictionary *dic = [[NSBundle mainBundle] infoDictionary];
    NSString *ver = [dic objectForKey:@"CFBundleShortVersionString"];
    NSString *newUserAgent = [NSString stringWithFormat:@"user_id*%@&token*%@&appversion*%@&systype*ios",userID,token,ver];
    urlStr = [urlStr stringByAddingPercentEscapesUsingEncoding:NSUTF8StringEncoding];
    NSURL *url = [NSURL URLWithString:urlStr];
    NSMutableURLRequest *mutableRequest = [[NSMutableURLRequest alloc] initWithURL:url];
    [mutableRequest addValue:[NSString stringWithFormat:@"%@",newUserAgent] forHTTPHeaderField:@"User-Agent2"];

这里我们在数据请求中加入一些自己app的参数,并且用User-Agent2这个参数传给后台,这样服务器可根据UA来返回不同版本的内容。

3.WKWebView对象的代理方法
加载的方法:

- (void)webView:(WKWebView *)webView didStartProvisionalNavigation:(WKNavigation *)navigation
{
  //开始加载
}

- (void)webView:(WKWebView *)webView didFinishNavigation:(WKNavigation *)navigation
{
   //加载完成
//这里可以接受web前端的方法,用来初始化web页面的信息
}

- (void)webView:(WKWebView *)webView didFailProvisionalNavigation:(null_unspecified WKNavigation *)navigation withError:(NSError *)error
{
  //网络错误
}

在加载完成的方法中,可以接受web前端的方法,用来初始化web页面的信息,例如页面的navi的右边的图标或是文字,以及对应不同的点击事件。

[self.webView evaluateJavaScript:@"setTing()" completionHandler:^(id _Nullable response, NSError * _Nullable error) {
        //当然在这个setTing()返回的数据可以是个字典的数据形式。
    }];

4.WKWebView页面中点击事件的捕捉以及数据的获取。

- (void)webView:(WKWebView *)webView decidePolicyForNavigationAction:(WKNavigationAction *)navigationAction decisionHandler:(void (^)(WKNavigationActionPolicy))decisionHandler
{
    decisionHandler(WKNavigationActionPolicyAllow);
//允许webView的点击时数据的获取
}

- (void)webView:(WKWebView *)webView runJavaScriptAlertPanelWithMessage:(NSString *)message initiatedByFrame:(WKFrameInfo *)frame completionHandler:(void (^)(void))completionHandler
{
    NSDictionary *dic = [NSDictionary parseJSONStringToNSDictionary:message];
    completionHandler();
}

- (void)webView:(WKWebView *)webView runJavaScriptConfirmPanelWithMessage:(NSString *)message initiatedByFrame:(WKFrameInfo *)frame completionHandler:(void (^)(BOOL))completionHandler
{
    completionHandler(NO);
}

这里是捕捉web的点击事件,并且获得到web前端给的数据,这样我们可以根据数据类型决定是弹出提示框或是跳入新的界面(一个新的web页面或是自己app的原生页面)
若是想要跳原生页面,得和后端统一一下所需要跳入的控制器,这样当字段一样的时候,就创建该控制器,并且跳到该控制器。

以上就是我们在用到web时可能需要用到的东西。

相关文章

网友评论

    本文标题:IOS中WKWebView的使用及JS交互

    本文链接:https://www.haomeiwen.com/subject/inidixtx.html