WKWebView使用及交互

        首先创建一个WKWebView对象:initWithFrame:(CGRect)frame configuration:(WKWebViewConfiguration*)configuration,从这里面可以看出我们需要传入一个WKWebViewConfiguration对象,这里的WKWebViewConfiguration其实就是设置一些webView的配置信息,在他的属性里面我们可以看到WKPreferences *preferences,这就是设置偏好配置信息。

//创建配置信息对象

WKWebViewConfiguration*config=[[WKWebViewConfiguration alloc]init];

// 创建偏好设置对象

WKPreferences*preference=[[WKPreferences alloc]init];

//最小字体大小 当将javaScriptEnabled属性设置为NO时,可以看到明显的效果preference.minimumFontSize=0;

//设置是否支持javaScript 默认是支持的preference.javaScriptEnabled=YES;

// 在iOS上默认为NO,表示是否允许不经过用户交互由javaScript自动打开窗口,这里设置并没有什么用,后面再补充说一下

preference.javaScriptCanOpenWindowsAutomatically=YES;

config.preferences=preference;

WKWebView *wkWeb = [[WKWebView alloc] initWithFrame:rect configuration:config];

wkWeb.UIDelegate = self;

wkWeb.navigationDelegate = self;

// 设置是否允许左滑返回

wkWeb.allowsBackForwardNavigationGestures = YES;

[self.view addSubview:wkWeb];

NSString *path = [[NSBundle mainBundle] pathForResource:@"WKWeb.html" ofType:nil];

NSString *htmlString = [[NSString alloc]initWithContentsOfFile:path encoding:NSUTF8StringEncoding error:nil];

[wkWeb loadHTMLString:htmlString baseURL:nil];

        到这里一个网页就可加载出来了,下面说一下OC和JS的交互。在WKWebViewConfiguration类中有个WKUserContentController类对象,这个类主要用来与JavaScript的交互管理。

 WKUserContentController * wkUserController = [[WKUserContentController alloc] init];

// js掉起oc步骤,注册一个name为jsToOcNoPrams的js方法,设置处理接收JS方法的代理

[wkUController addScriptMessageHandler:self  name:@"jsToOcWithPrams"];

config.userContentController= wkUController;

// 这里在js中调用我们注册的方法jsToOcWithPrams,这里还可以传参数

window.webkit.messageHandlers.jsToOcWithPrams.postMessage('https://www.baidu.com/');

// 这里实现代理方法,注意这里遵守WKScriptMessageHandler协议,代理是由WKUserContentControl设置 ,通过接收JS传出消息的name进行捕捉的回调方法

- (void)userContentController:(WKUserContentController *)userContentController didReceiveScriptMessage:(WKScriptMessage *)message{

         //用message.body获得JS传过来的参数

        NSString* parameter = message.body;

        if([message.name isEqualToString:@"jsToOcWithPrams"]){

            // 页面按钮点击js响应,这里做对应的处理

        }

}

// oc调用js方法

[wkWeb evaluateJavaScript:@"ocToJs('我传参数了......')" completionHandler:^(idresponse, NSError *error) {}];

// 在js里面实现ocToJs方法

function ocToJs(text){

console.log(text);

// 这里做一个属性测试javaScriptCanOpenWindowsAutomatically

window.open('https://www.baidu.com/');

}

   这里最后说一下WKWebView默认是不支持window.open()打开新的页面,javaScriptCanOpenWindowsAutomatically属性默认是NO,设置为YES也并没有反应,这里可以实现下面方法即可使用window.open('https://www.baidu.com/');打开新的网页。

- (WKWebView*)webView:(WKWebView*)webView  createWebViewWithConfiguration:(WKWebViewConfiguration*)configuration  forNavigationAction:(WKNavigationAction*)navigationAction windowFeatures:(WKWindowFeatures*)windowFeatures{

    if(navigationAction.targetFrame==nil|| !navigationAction.targetFrame.isMainFrame)

    {

        [webView loadRequest:navigationAction.request];

    }

    return nil;

}


        最后补充,由UIWebView换为WKWebView后,会发现字体小了很多,这应该是WKWebView与html的兼容问题,解决办法是修改原网页,要么我们手动注入JS,下面代码适配文本大小

    NSString *jSString = @"var meta = document.createElement('meta'); meta.setAttribute('name', 'viewport'); meta.setAttribute('content', 'width=device-width'); document.getElementsByTagName('head')[0].appendChild(meta);";

//用于进行JavaScript注入

WKUserScript *wkUScript = [[WKUserScript alloc] initWithSource:jSString injectionTime:WKUserScriptInjectionTimeAtDocumentEnd forMainFrameOnly:YES];

[config.userContentController addUserScript:wkUScript];

你可能感兴趣的:(WKWebView使用及交互)