需求:當前APP許多頁面是由InAppBrowser打開的新的webview展示頁面李茫,但是同時需求需要調用原生的選圖/看圖插件等。
環(huán)境:InAppBrowser插件由原來的uiwebivew升級為wkwebiview内边,基于wkwebivew開發(fā)此功能男摧。
步驟:
1.創(chuàng)建wkwebivew的時候,向js注入cordva方法
WKUserContentController* userContentController = [[WKUserContentController alloc] init];
WKWebViewConfiguration* configuration = [[WKWebViewConfiguration alloc] init];
configuration.userContentController = userContentController;
configuration.processPool = [[CDVWKProcessPoolFactory sharedFactory] sharedProcessPool];
[configuration.userContentController addScriptMessageHandler:self name:IAB_BRIDGE_NAME];
[configuration.userContentController addScriptMessageHandler:self name:@"cordova"];
self.webView = [[WKWebView alloc] initWithFrame:self.view.frame configuration:configuration];
2.h5調用原生插件
// name填入cordova messageBody為插件的參數
// 原生解析的時候斤贰,只需攔截messageBody.name 等于cordova的消息
window.webkit.messageHandlers.<name>.postMessage(<messageBody>)
3.原生調用cordva插件
#pragma mark WKScriptMessageHandler delegate
- (void)userContentController:(nonnull WKUserContentController *)userContentController didReceiveScriptMessage:(nonnull WKScriptMessage *)message {
if ([message.name isEqualToString:@"cordova"]) {
// 獲取到根控制器MainViewContoller,因為這個控制器初始化了Cordova插件次询,需要用這個控制器來調用插件
AppDelegate *appdelegate = (AppDelegate *)[UIApplication sharedApplication].delegate;
UIViewController *rootViewController = appdelegate.window.rootViewController;
CDVViewController *vc = (CDVViewController *) rootViewController;
// 解析調用插件所需要的參數
NSArray *jsonEntry = message.body;
CDVInvokedUrlCommand* command = [CDVInvokedUrlCommand commandFromJson:jsonEntry];
// 用根控制器上的commandQueue方法荧恍,調用插件
if (![vc.commandQueue execute:command]) {
#ifdef DEBUG
NSError* error = nil;
NSString* commandJson = nil;
NSData* jsonData = [NSJSONSerialization dataWithJSONObject:jsonEntry
options:0
error:&error];
if (error == nil) {
commandJson = [[NSString alloc] initWithData:jsonData encoding:NSUTF8StringEncoding];
}
static NSUInteger maxLogLength = 1024;
NSString* commandString = ([commandJson length] > maxLogLength) ?
[NSString stringWithFormat : @"%@[...]", [commandJson substringToIndex:maxLogLength]] :
commandJson;
NSLog(@"FAILED pluginJSON = %@", commandString);
#endif
}
}
}
#pragma mark WKScriptMessageHandler delegate
// didReceiveScriptMessage代理方法接受到消息后,此方方法會接受到回調屯吊,也需處理
- (void)userContentController:(nonnull WKUserContentController *)userContentController didReceiveScriptMessage:(nonnull WKScriptMessage *)message {
if ([message.name isEqualToString:@"cordova"]) {
return;
}
}
這里存在一個問題送巡,我們是通過根控制器調用的插件,如果需要present一個新的控制器顯示盒卸,這時候是顯示在根控制器上骗爆,但是在InAppBrowser之下,這里還需要處理一次世落,重寫present方法,獲取當前最上層控制器進行present淮腾。
#import "UIViewController+Present.h"
#import <objc/runtime.h>
@implementation UIViewController (Present)
+ (void)load {
static dispatch_once_t onceToken;
dispatch_once(&onceToken, ^{
Method presentM = class_getInstanceMethod(self.class, @selector(presentViewController:animated:completion:));
Method presentSwizzlingM = class_getInstanceMethod(self.class, @selector(dy_presentViewController:animated:completion:));
method_exchangeImplementations(presentM, presentSwizzlingM);
});
}
- (void)dy_presentViewController:(UIViewController *)viewControllerToPresent animated:(BOOL)flag completion:(void (^)(void))completion {
UIViewController *currentVc = [self topViewController];
if ([currentVc isKindOfClass:[UIAlertController class]]) {
[self dy_presentViewController:viewControllerToPresent animated:flag completion:completion];
} else {
[[self topViewController] dy_presentViewController:viewControllerToPresent animated:flag completion:completion];
}
}
- (UIViewController *)topViewController {
UIViewController *topVC;
topVC = [self getTopViewController:[[UIApplication sharedApplication].keyWindow rootViewController]];
while (topVC.presentedViewController) {
topVC = [self getTopViewController:topVC.presentedViewController];
}
return topVC;
}
- (UIViewController *)getTopViewController:(UIViewController *)vc {
if (![vc isKindOfClass:[UIViewController class]]) {
return nil;
} if ([vc isKindOfClass:[UINavigationController class]]) {
return [self getTopViewController:[(UINavigationController *)vc topViewController]];
} else if ([vc isKindOfClass:[UITabBarController class]]) {
return [self getTopViewController:[(UITabBarController *)vc selectedViewController]];
} else {
return vc;
}
}
@end
4.插件回傳callback給h5
4.1修改原生本地corodva.js文件
由于原生是調用根控制器上的插件返回callback糟需,是和InAppBrowser不同層級的webview屉佳,所以需要做一層轉發(fā),判斷當前webview的callback數組洲押,是否含有接收到的callbackid,如果不在在數組中武花,則說明不是該webview調用的插件,則調用InAppBrowser里的js回傳方法,回傳開InAppBrowser的webview接收callback
callbackFromNative: function(callbackId, isSuccess, status, args, keepCallback) {
try {
var callback = cordova.callbacks[callbackId];
if (callback) {
if (isSuccess && status == cordova.callbackStatus.OK) {
callback.success && callback.success.apply(null, args);
} else if (!isSuccess) {
callback.fail && callback.fail.apply(null, args);
}
/*
else
Note, this case is intentionally not caught.
this can happen if isSuccess is true, but callbackStatus is NO_RESULT
which is used to remove a callback from the list without calling the callbacks
typically keepCallback is false in this case
*/
// Clear callback if not expecting any more results
if (!keepCallback) {
delete cordova.callbacks[callbackId];
}
} else {
// __globalBrowser為表示當前界面開啟了InAppBrowser
if(window.__globalBrowser) {
var message = 'cordova.callbackFromNative("'+callbackId+'",'+isSuccess+',' + status +',' +JSON.stringify(args) + ',' + keepCallback + ')';
// 調用InAppBrowser插件里的js回傳方法
window.__globalBrowser.executeScript({code: message});
}
}
4.2 修改inappbrowser.js
module.exports = function(strUrl, strWindowName, strWindowFeatures, callbacks) {
// Don't catch calls that write to existing frames (e.g. named iframes).
if (window.frames && window.frames[strWindowName]) {
var origOpenFunc = modulemapper.getOriginalSymbol(window, 'open');
return origOpenFunc.apply(window, arguments);
}
strUrl = urlutil.makeAbsolute(strUrl);
var iab = new InAppBrowser();
callbacks = callbacks || {};
for (var callbackName in callbacks) {
iab.addEventListener(callbackName, callbacks[callbackName]);
}
var cb = function(eventname) {
iab._eventHandler(eventname);
};
strWindowFeatures = strWindowFeatures || "";
exec(cb, cb, "InAppBrowser", "open", [strUrl, strWindowName, strWindowFeatures]);
// 聲明全局變量__globalBrowser杈帐,表示當前界面開啟了InAppBrowser
window.__globalBrowser = iab;
return iab;
5.如果調用了選擇圖片插件体箕,h5回顯本地圖片需要原生攔截scheme請求
5.1 創(chuàng)建wkwebivew专钉,注入js方法,用于h5調用插件
WKWebViewConfiguration* configuration = [[WKWebViewConfiguration alloc] init];
configuration.userContentController = userContentController;
configuration.processPool = [[CDVWKProcessPoolFactory sharedFactory] sharedProcessPool];
[configuration.userContentController addScriptMessageHandler:self name:IAB_BRIDGE_NAME];
// 注冊cordova方法累铅,讓h5調用
[configuration.userContentController addScriptMessageHandler:self name:@"cordova"];
//self.webView = [[WKWebView alloc] initWithFrame:frame];
self.webView = [[WKWebView alloc] initWithFrame:self.view.frame configuration:configuration];
5.2 回傳參數內需要寫入自定義scheme協(xié)議
// 是否是InAppBrowser調用的插件
// ExeInAppBrowserShow 這個值需要在InAppBrowser開啟和關閉的時候賦值
BOOL isInappBro = [[[NSUserDefaults standardUserDefaults] objectForKey:ExeInAppBrowserShow] boolValue];
if (isInappBro) {
[resultStrings addObject:[url.absoluteString stringByReplacingOccurrencesOfString:@"file://" withString:@"miexe.com://"]];
else {
[resultStrings addObject:url.absoluteString];
}
[self.commandDelegate sendPluginResult:[CDVPluginResult resultWithStatus:CDVCommandStatus_OK messageAsArray:resultStrings] callbackId:self.callbackId];
5.3 在MyCustomURLProtocol類中跃须,需要實現三個方法:
// 每次有一個請求的時候都會調用這個方法,在這個方法里面判斷這個請求是否需要被處理攔截娃兽,如果返回YES就代表這個request需要被處理菇民,反之就是不需要被處理。
+ (BOOL)canInitWithRequest:(NSURLRequest*)theRequest{
if ([theRequest.URL.scheme caseInsensitiveCompare:@"miexe.com"] == NSOrderedSame) {
return YES;
}
return NO;
}
// 這個方法就是返回規(guī)范的request投储,一般使用就是直接返回request第练,不做任何處理的
+ (NSURLRequest*)canonicalRequestForRequest:(NSURLRequest*)theRequest{
return theRequest;
}
// 這個方法作用很大,把當前請求的request攔截下來以后玛荞,在這個方法里面對這個request做各種處理娇掏,比如添加請求頭,重定向網絡勋眯,使用自定義的緩存等婴梧。
// 我們在這里將自定義協(xié)議的scheme去除掉。然后返回file協(xié)議給h5
- (void)startLoading{
NSURLResponse *response = [[NSURLResponse alloc] initWithURL:[self.request URL]
MIMEType:@"image/png"
expectedContentLength:-1
textEncodingName:nil];
NSString *imagePath = [self.request.URL.absoluteString componentsSeparatedByString:@"miexe.com://"].lastObject;
NSData *data = [NSData dataWithContentsOfFile:imagePath];
[[self client] URLProtocol:self didReceiveResponse:response cacheStoragePolicy:NSURLCacheStorageNotAllowed];
[[self client] URLProtocol:self didLoadData:data];
[[self client] URLProtocolDidFinishLoading:self];
}