H5交互
OC与JS的交互实现方式有很多，之前用的比较多的是WebViewJavaScriptBridge，但在IOS7之后，苹果将JavaScriptCore框架开放。因此，这篇文章不讲理论（其实我也讲不清楚，怕误导，莫怪莫怪）,主要讲的是JavaScriptCore的实际使用。
JS交互无非就是js与oc之间的数据传递，我们可以根据业务逻辑定义一些业务编号，如js调用oc原生的登录界面，下单界面，也可以是相机拍照等业务。注意这个编号的值js与oc要一至。
#import <Foundation/Foundation.h>
#import <JavaScriptCore/JavaScriptCore.h>
typedef NS_ENUM(NSInteger, UCJSType) {
EPGJSType_Login = 1,//登录
EPGJSType_Order,//下单
EPGJSType_OpenPage_Coupon,//打开优惠券
EPGJSType_Error,//出错时用
};
#pragma mark -
@protocol PGJSObjectDelegate <NSObject>
@optional
- (void)jsReponse:(UCJSType)type params:(NSObject *)params;
- (void)jsErrorMessage:(NSString *)message;
@end
#pragma mark-
@protocol PGJSObjectProtocol <JSExport>
//JS调用此方法并传递参数
- (void)wakeUpNativeObject:(NSString *)message;
@end
#pragma mark-
@interface PGJSObject : NSObject<PGJSObjectProtocol>
@property(nonatomic, weak)id<PGJSObjectDelegate> jsDelegate;
//生成调用JS方法的字符串
- (NSString *)wakeUpNativeJSType:(NSInteger)type param:(NSString *)params;
@end
@implementation PGJSObject
//生成调用JS方法的字符串
- (NSString *)wakeUpNativeJSType:(NSInteger)type param:(NSString *)params
{
NSString *szParams = [NSString stringWithFormat:@"wakeUpJS(%ld,'%@')",(long)type, params];
return szParams;
}
#pragma mark -
//JS调用此方法并传递参数
- (void)wakeUpNativeObject:(NSString *)message
{
if(message == nil || [message isKindOfClass:[NSNull class]])
{
if(self.jsDelegate && [self.jsDelegate respondsToSelector:@selector(jsErrorMessage:)])
{
[self.jsDelegate jsErrorMessage:@"参数为空"];
}
return;
}
NSDictionary *dicInfo = [NSJSONSerialization JSONObjectWithData:[message dataUsingEncoding:NSUTF8StringEncoding]
options:kNilOptions
error:nil];
UCJSType type = [[dicInfo objectForKey:@"type" type:EDictionTypeInteger] integerValue];
NSObject *obj = [dicInfo objectForKey:@"param"];
if(self.jsDelegate && [self.jsDelegate respondsToSelector:@selector(jsReponse:params:)])
{
[self.jsDelegate jsReponse:type params:obj];
}
}
@end
PGWebBaseController.h
#import "PGWebBaseController.h"
#import "PGJSObject.h"
@interface PGJSBaseController : PGWebBaseController<PGJSObjectDelegate>
@property(nonatomic, strong)PGJSObject *jsObj;
@end
PGWebBaseController.m
@interface PGJSBaseController ()
@property(nonatomic, strong)JSContext *jsContext;
@end
@implementation PGJSBaseController
- (void)viewDidLoad
{
[super viewDidLoad];
self.jsObj = [[PGJSObject alloc] init];
self.jsObj.jsDelegate = self;
}
- (void)createInitData
{
[super createInitData];
WEAKSELF
self.webViewDidFinishLoadBlock = ^(UIWebView *webView) {
weakSelf.jsContext = [webView valueForKeyPath:@"documentView.webView.mainFrame.javaScriptContext"];
weakSelf.jsContext[@"UCJSObject"] = weakSelf.jsObj;
};
}
#pragma mark -
- (void)jsReponse:(UCJSType)type params:(NSObject *)params
{
NSString *str = [NSString stringWithFormat:@"type: %@, param: %@", @(type).stringValue, params];
NSLog(@"====> %@",str);
dispatch_async(dispatch_get_main_queue(), ^{
[self showMsg:str];
});
}
- (void)jsErrorMessage:(NSString *)message
{
}
@end
web页面中的js脚本
<script>
//业务场景
if(typeof ServiceType == "undefined"){
var ServiceType = {
ServiceType_Type1: 1,
ServiceType_Type2: 2,
ServiceType_Type3: 3,
ServiceType_Type4: 4,
ServiceType_Type5: 5,
ServiceType_Type6: 6
}
}
//JS --> Native
//param 为json字符串
function wakeUpNative(type, param) {
var str = "{\"type\":"+type+",\"param\":\""+param+"\"}";
window.UCJSObject.wakeUpNativeObject(str)
}
//Native --> JS
function wakeUpJS(type, param) {
switch (type) {
case ServiceType.ServiceType_Type1: {
alert("apptojs");
break;
}
case ServiceType.ServiceType_Type2: {
alert(param);
break;
}
}
}
</script>
调用示例：
PGH5JsController *controller = [[PGH5JsController alloc] initWithTitle:@"H5交互实例"];
[self pushNewViewController:controller];
NSString *path = [[NSBundle mainBundle] pathForResource:@"nativeInteraction" ofType:@"html"];
NSString *htmlString = [NSString stringWithContentsOfFile:path encoding:NSUTF8StringEncoding error:nil];
[controller loadWebRequestWithHtmlString:htmlString];
哈哈，完了，不好意思全是代码！！
