OC与JS的交互
在实际的开发中手机app经常会嵌套H5的网页,如果只是简单的嵌套,一个webView就可以。可现实中常常会用到H5与webView的交互,需要网页和webView互相传递信息。
(不太会用简书,格式写的有点乱)
JS调用OC
1.拦截连接
webView可以监测到所有网页加载的连接 通过下面这个方法
-(BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType
{
DLog(@"request -> %@",request.URL.absoluteString);
if ([request.URL.absoluteString rangeOfString:@"http://10.0.0.263/goBack.html"].location != NSNotFound ) {
return NO;
}
return YES;
}
这里面你可以拦截到网页要加载的链接,当网页需要向你传递信息的时候,比如点击网页的返回按钮,就加载http://10.0.0.263/goBack.html,webView一旦拦截到这个链接,就可以在上面的if里面做想要的事情。当然需要传值的时候,可以在链接后面拼接参数。比如:
http://api.centwateck.com/hidetabs/id=1&name = @"jack"
这样 拦截到链接之后,对参数按和后台商量的格式就可进行解析。
2. 直接调用oc方法
- (void)webViewDidFinishLoad:(UIWebView *)webView
在webView加载完毕的这个方法里做一些事情
JSContext *context = [webView valueForKeyPath:@"documentView.webView.mainFrame.javaScriptContext"];
context[@"wxpay"] = ^() {
这里 wxpay 是我与网页程序员商量好的,一旦网页上点击了微信支付,就调用这个方法
这个是方法名,网页就可以直接调用这个方法
NSArray *args = [JSContext currentArguments];
这个方法 你可以拿到js传递给你的参数
然后将参数通过
toBool,toNumber ,toString转成oc的类
PS:我没转直接用了,也没事。
}
也可以这么写:
context[@"wxpay"] = ^(NSString *title) {
NSLog(@" %@ ",title);
}
Warning:在block里面刷新UI的话,需要检测一下block里面是否为主线程,不是主线程,控制台一堆输出,打上全局断点会崩溃
这里可以这么解决一下
if ([NSThread isMainThread] == YES) {
//do something
}else {
dispatch_async(dispatch_get_main_queue(), ^{
//dosomething
});
}
OC调用JS
1.直接传参数
在- (void)webViewDidFinishLoad:(UIWebView *)webView 这个方法里面直接调用下面的方法
NSString *jsString = [NSString stringWithFormat:@"doLog('%@','1')",dataString];
//doLog是你需要调用的网页的方法名,参数根据你所需要的进行传值。
[webView stringByEvaluatingJavaScriptFromString:jsString];
Warning:这里的doLog()里面的()一定不要用中文的。不然的话,就刺激了。是一个同步的方法,使用它执行JS方法时,如果JS 方法比较耗的时候,会造成界面卡顿。
2.通过JSContent传值
在- (void)webViewDidFinishLoad:(UIWebView *)webView 这个方法里面直接调用下面的方法
JSContext *jsctt = [webView
valueForKeyPath:@"documentView.webView.mainFrame.javaScriptContext"];
JSValue *function = [jsctt objectForKeyedSubscript:@"test"];
[function callWithArguments:nil];
//这里[function callWithArguments:nil] 当有参数的时候,可以传递一个数组, test是方法名
这里附上gitHub源码连接 https://github.com/tianliangyihou/OCAndJS
webView还可以通过相应的语句,对网页进行调整,如给图片每张图片加上点击事件,或者图片居中等,这个百度上很多方法。