前言：
在iOS应用开发中，会经常用到WebView，当我们对WebView进行操作的时候，会需要APP源生和网页端的数据交互。这里做了一个总结、在iOS7系统提供了JavaScriptCore，可以更优雅地实现js与原生的交互。 本文介绍的就是JavaScriptCore + UIWebView。 完整版Demo下载地址。
需求：
网页端（下面统称JS）APP端（下面统称OC）。
JS和OC可以相互调用方法。
JS和OC可以相互传递参数。
JS和OC传递的参数（多个/单个/无参数）。
思路：
模拟一个微信支付场景正好可满足上门所有需求：
JS调用OC，传递多个支付参数。
OC拿到参数跳转微信进行支付。
支付后OC将结果返回给JS。
流程完成。
实现：
我们先看JS代码
1、首先定义一个Button、注册一个按钮点击事件wechatPay()。
2、在这里面通过 app.onWechatPay('wechatPayBack'); 来实现JS调用OC方法。
app 这个是和OC约定，随便写都可以只要OC里面的context[@"app"] 对应就好。。
onWechatPay就是OC响应JS的方法，方法名字和OC的代码需要一一对应。
wechatPayBack就是OC进行数据回传的方法，方法名字和OC的代码需要一一对应。
onPayParameter就是JS传递参数给OC，里面可以多个单数，单个参数，如果无参数则该段代码可以注释。
function wechatPayBack(){}方法就是JS接受OC传递过来参数方法。和上面的app.onWechatPay('wechatPayBack'); 里面的方法名一一对应。另外在闭包函数{}里面做自己逻辑处理。
Insert title here
OC代码
1、首先在info.plist里面添加如下代码，不要问为什么、
NSAppTransportSecurity
NSAllowsArbitraryLoads
2、增加工具类，
<1>新建一个工具类AppJSObject继承NSObject
<2>.h文件中声明一个代理并遵循JSExport，代理内的方法和js定义的方法名一致。
<3>.m文件中实现<2>代理中对应的方法，可以在方法内处理事件或通知代理。
#import
#import
@protocol AppJSObjectDelegate
// 方法名和JS代码必须一一对应
-(void)onWechatPay:(NSString *)message;
@end
@interface AppJSObject : NSObject
@property(nonatomic,weak) id delegate;
@end
#import "AppJSObject.h"
@implementation AppJSObject
-(void)onWechatPay:(NSString *)message{
[self.delegate onWechatPay:message];
}
@end
3、加载UIWebView
//UIWebView初始化
-(void)initWebViewAction{
self.webView = [[UIWebView alloc]initWithFrame:self.view.bounds];
NSURL *url = [[NSBundle mainBundle] URLForResource:@"OCJSTest" withExtension:@"html"];
NSURLRequest *request = [NSURLRequest requestWithURL:url];
[self.webView loadRequest:request];
self.webView.delegate = self;
[self.view addSubview:self.webView];
}
//网页即将开始加载
-(BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType{
return YES;
}
//网页加载完成
-(void)webViewDidFinishLoad:(UIWebView *)webView{
JSContext *context=[webView valueForKeyPath:@"documentView.webView.mainFrame.javaScriptContext"];
AppJSObject *jsObject = [AppJSObject new];
jsObject.delegate = self;
context[@"app"] = jsObject; // 这里的app和JS里面的app对应
// 这里通过onPayParameter接受JS传递的参数
context[@"onPayParameter"] = ^(NSString * p1, NSString * p2) {
NSLog(@"这里相应JS传递的参数，参数1:%@, 参数2:%@", p1, p2);
};
}
// 微信第三方支付JS->OC
- (void)onWechatPay:(NSString*)message{
NSLog(@"这里相应JS传递的事件，按照业务逻辑执行相关代码");
// 执行完毕，在需要的时候OC调用JS方法进行回调想用。
[self wechatPayBack];
}
// 微信第三方支付结果返回OC->JS
- (void)wechatPayBack{
JSContext *context=[self.webView valueForKeyPath:@"documentView.webView.mainFrame.javaScriptContext"];
NSString *alertJS= [NSString stringWithFormat:@"wechatPayBack('%@','%@')",@"回调参数1",@"回调参数2"];
[context evaluateScript:alertJS];//通过OC方法调用JS
}