WKWebView 和 JS 的交互

前言

WKWebView是苹果在 iOS8.0以后推出的新的 webView库。目前现在很多 APP 都混合了 webView,这个库将来的用处会越来越大。这一段正好有个小项目用到了WKWebView ,学习了一下,在这里写篇文章总结一下。

WebKit Framework

iOS 中和 webView 相关和交互的文件都放到了 WebKit 这个库中

#import <WebKit/WKBackForwardList.h>
#import <WebKit/WKBackForwardListItem.h>
#import <WebKit/WKContentRuleList.h>
#import <WebKit/WKContentRuleListStore.h>
#import <WebKit/WKError.h>
#import <WebKit/WKFoundation.h>
#import <WebKit/WKFrameInfo.h>
#import <WebKit/WKHTTPCookieStore.h>
#import <WebKit/WKNavigation.h>
#import <WebKit/WKNavigationAction.h>
#import <WebKit/WKNavigationDelegate.h>
#import <WebKit/WKNavigationResponse.h>
#import <WebKit/WKOpenPanelParameters.h>
#import <WebKit/WKPreferences.h>
#import <WebKit/WKPreviewActionItem.h>
#import <WebKit/WKPreviewActionItemIdentifiers.h>
#import <WebKit/WKPreviewElementInfo.h>
#import <WebKit/WKProcessPool.h>
#import <WebKit/WKScriptMessage.h>
#import <WebKit/WKScriptMessageHandler.h>
#import <WebKit/WKSecurityOrigin.h>
#import <WebKit/WKUIDelegate.h>
#import <WebKit/WKURLSchemeHandler.h>
#import <WebKit/WKURLSchemeTask.h>
#import <WebKit/WKUserContentController.h>
#import <WebKit/WKUserScript.h>
#import <WebKit/WKWebView.h>
#import <WebKit/WKWebViewConfiguration.h>
#import <WebKit/WKWebsiteDataRecord.h>
#import <WebKit/WKWebsiteDataStore.h>
#import <WebKit/WKWindowFeatures.h>
#import <WebKit/WebKitLegacy.h>

上面是整个库的头文件。其中核心是WKWebView.h头文件。

WKWebView 注入js代码

WKWebView 执行js代码,是通过 WKUserContentController 和 WKUserScript两个类来实现

NSString *filePath = [[NSBundle mainBundle] pathForResource:@"test" ofType:@"js"];
NSString *filejs = [[NSString alloc] initWithContentsOfFile:filePath encoding:NSUTF8StringEncoding error:nil];
WKUserScript *userscript = [[WKUserScript alloc] initWithSource:filejsinjectionTime:WKUserScriptInjectionTimeAtDocumentStart forMainFrameOnly:NO];
[wkUController addUserScript:userscript];

WKWebViewConfiguration *wkWebConfig = [[WKWebViewConfiguration alloc] init];
WKUserContentController *wkUController = [[WKUserContentController alloc] init];
 wkWebConfig.userContentController = wkUController;

self.webView = [[WKWebView alloc] initWithFrame:self.contentView.frame configuration:wkWebConfig];

首先创建WKUserScript对象,用来保存注入到 web View 的脚本。
一个脚本对应于一个 WKUserScript 对象

 - (instancetype)initWithSource:(NSString *)source injectionTime:(WKUserScriptInjectionTime)injectionTime forMainFrameOnly:(BOOL)forMainFrameOnly;
  • source 对应于脚本的文本
  • injectionTime 对应于脚本注入的时间 是个枚举值, WKUserScriptInjectionTimeAtDocumentStart,
    WKUserScriptInjectionTimeAtDocumentEnd
    -forMainFrameOnly 脚本注入的范围,Yes 表示为仅仅注入到主框架,NO 表示注入到所有的框架

第二步:创建WKUserContentController对象,WKUserContentController用来提供JavaScript 传递到 web view的方法。通过使用 - (void)addUserScript:(WKUserScript *)userScript 方法来增加脚本。

第三步 创建WKWebViewConfiguration 对象 这个对象用来收集初始化WKWebView 相关的属性信息。
他保有一个WKUserContentController类型的属性

@property (nonatomic, strong) WKUserContentController *userContentController;

第四步 初始化 WKWebView

self.webView = [[WKWebView alloc] initWithFrame:self.contentView.frame configuration:wkWebConfig];

WKWebView 执行 js 语句

- (void)evaluateJavaScript:(NSString *)javaScriptString completionHandler:(void (^ _Nullable)(_Nullable id, NSError * _Nullable error))completionHandler;

WKWebView 通过这个语句来执行js语句,js语句执行的结果通过completionHandler block语句传递出来。

JS 传递数据 WKWebView

有时候需要在 JS 返回数据给 iOS APP,例如当点击一个条目的时候,希望把条目的信息传递给 iOS APP,可以
js 可以利用 window.webkit.messageHandlers..postMessage() 来进行传递数据。
例如

window.webkit.messageHandlers.appName.postMessage({body: '传数据'});

appName就是我们要注入的名称,注入以后,就可以在JS端调用了,传数据统一通过body传,可以是多种类型,只支持NSNumber, NSString, NSDate, NSArray,NSDictionary, and NSNull类型。

// 注入JS对象名称AppModel,当JS通过appName来调用时,
// 我们可以在WKScriptMessageHandler代理中接收到
[config.userContentController addScriptMessageHandler:self name:@"appName"];

当JS通过appName发送数据到iOS端时,通过WKScriptMessageHandler 代理,就会收到数据

#pragma mark - WKScriptMessageHandler
- (void)userContentController:(WKUserContentController *)userContentController
      didReceiveScriptMessage:(WKScriptMessage *)message {
  if ([message.name isEqualToString:@"AppModel"]) {
    // 打印所传过来的参数,只支持NSNumber, NSString, NSDate, NSArray,
    // NSDictionary, and NSNull类型
    NSLog(@"%@", message.body);
  }
}
阅读更多
版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/dfman1978/article/details/78929205
文章标签: webkit ios 苹果
个人分类: ios开发学习
想对作者说点什么? 我来说一句

没有更多推荐了,返回首页

关闭
关闭
关闭