正在开发的APP中一个特殊的需求，需要在APP内嵌的webview中使用js调用一些原生的方法。通过对javascript的分析，发现能够很好的解决这个问题，但是也发现了一些坑，与大家分享。
1.定义接口
通过protocol实现，这一步大家都很清楚，告诉js那边我有哪些接口。关键是JSExport，这个是我们接口必须遵循的协议，只有遵循这个协议，才能将方法争取的注射到webview中。
@protocol WebViewBridgeDelegate
- (void)showURL:(NSString *)url;
- (NSString*)callDK:(NSString*)func function:(NSString*)param;
@end
使用中发现，这些方法好像不能使用optional，没有进行严格的验证。
2.实现接口
只需要实现WebViewBridgeDelegate中的这些方法就可以了。
#import
#import "WebViewBridgeDelegate.h"
@interface AppJSNative : NSObject
@property (nonatomic, weak) UINavigationController *navigationController;
@end
@implementation LoldkJSNative
- (void)showURL:(NSString *)url
{
NSLog(@"showURL:%@", url);
[JumpHandler jumpToURI:url navigationController:self.navigationController];
}
- (NSString*)callDK:(NSString*)func function:(NSString*)param
{
NSLog(@"%@", func);
if ([func isEqualToString:@"getToken"])
{
NSString *token =xxx;
NSMutableDictionary *result = [[NSMutableDictionary alloc]init];
if (!IsStrEmpty(token))
{
[result setObject:token forKey:@"token"];
[result setObject:@(YES) forKey:@"result"];
}
else
{
[result setObject:@(NO) forKey:@"result"];
}
NSLog(@"%@", token);
return [result JSONString];
}
NSMutableDictionary *result1 = [[NSMutableDictionary alloc]init];
[result1 setObject:@(NO) forKey:@"result"];
return [result1 JSONString];
}
@end
其中主要是实现了一些原生页面跳转的功能，以及获取原生数据的的方法。
3. 注射到webview
- (void)webViewDidStartLoad:(UIWebView *)webView
{
self.jsContext = [_webView valueForKeyPath:@"documentView.webView.mainFrame.javaScriptContext"];
AppJSNative *jsNative = [[AppJSNative alloc]init];
jsNative.navigationController = self.navigationController;
self.jsContext[@"iOS"] = jsNative;
self.jsContext.exceptionHandler = ^(JSContext *context, JSValue *exception) {
context.exception = exception;
NSLog(@"jsContext错误:%@",exception);
};
}
为什么我要在webViewDidStartLoad中进行注射而不是webViewDidEndLoad中。因为在js加载的时候就会调用原生方法，在webViewDidEndLoad中注射会导致JS找不到对应的方法。
保存navigationController是为了方便进行页面跳转。
4. JSContext生成时机的问题
根据上一步的确能够处理大部分问题，但是在实际使用过程中发现，在windows.onload函数中调用的时候，发现原生的接口不存在。根据分析发现是因为JSContext对象只会在onload函数之后才能获取到。此处我们需要自己找到一种方法，能够在正确的时机（越早越好）获取到JSContext对象。
基本原理是这样的：WebKit用WebFrameLoadDelegate回调与客户端进行通讯就好像UIWebView传达页面加载事件通过他自己的UIWebViewDelegate。WebFrameLoadDelegate其中一个方法是webView:didCreateJavaScriptContext:forFrame:就像所有事件源，WebKit的代码去检测他的代理是否实现了回调方法，如果实现了就调用此方法。
证实在iOS，UIWebView内，不论任何对象实现WebKit的WebFrameLoadDelegate方法，并不是真的实现webView:didCreateJavaScriptContext:forFrame:所以WebKit从不会调用此方法。如果此方法存在于代理对象中，它将会被自动调用。
既然如此，在OC中有很多的办法给现有的类和对象动态的增添一个方法。最简单的办法就是通过扩展。我给已有的类NSObject添加一个扩展去实现webView:didCreateJavaScriptContext:forFrame:方法。
的确，添加这个方法让WebKit开始调用它，因为任何对象(包括UIWebView中的一些sink object)都继承自NSObject，现在都实现了webView:didCreateJavaScriptContext:forFrame:这个方法。如果未来UIWebView内部的sink object实现了这个代理方法，那么这个途径就是失效因为我们自己实现的分类永远不会被调用。
当我们的方法被WebKit调用的时候会传给我们一个WebKit中的WebView(不是UIWebView)，一个JavaScriptCore的JSContext对象和WebKit的WebFrame。因为没有一个公开的WebKit框架的头文件提供给我们，所以WebView和WebFrame对我们来说非常透明。但是JSContext正是我们寻找的，通过JavaScriptCore框架对我们来说完全是适用的。(在实际中，我最终在WebFrame中调用方法，作为一个最佳状态)
问题现在就变成怎样根据JSContext反找到对应的UIWebView。首先我尝试使用WebView对象我们控制和沿着继承的view去找到他拥有的UIWebView.但是后来证明这个对象是一些UIView的代理，并不是一个真正的UIView。并且因为他对我们来说是透明的，我也没有打算使用它。
我的解决方案是迭代所有在app中所创建的UIWebViews(参考代码，我是怎么样做的)并且使用stringByEvaluatingJavaScriptFromString:去储存一个token"cookie"在JavaScriptContext中，然后我在JSContext中查找已经存在的这个token，如果他存在这个UIWebView就是我所要找的。
一旦我们有了JSContext我们就可以做一些很有趣的事情。我的测试App展示了我们怎样映射ObjectiveC的blocks和对象到全局命名空间并且通过JavaScript访问和调用它们。
5. JS调用
window.iOS. showURL("app://user?id=1");
var token = window.iOS. callDKFunction("token");
特别注意的是第二个方法，我们OC中实现的方法叫callDK， 但是由于多参数的问题，在JS中对应的方法名不再是callDK，而是将后面的参数的名字加在了函数名后面组成了新的函数名callDKFunction，这个地方耗费了我很久的时间。
6. 回调
我们也是可以在js中传入函数当做参数的，在OC中可以调用
- (void)processRequestWithData:(NSDictionary *)diconary callback:(JSValue *)value{
NSLog(@"%@",diconary);
NSMutableArray *array = [NSMutableArray array];
[array addObject:[NSArray arrayWithObjects:@{@"key1":@"value1"},@{@"key2":@"value2"},nil]];
[value callWithArguments:array];
}
其中value就是js传入的一个回调函数。
总结
以上这些例子，包含了原生页面调用、直接return值、回调。已经涵盖了绝大部分我们想通过js调用原生的场景。十分的方便。