:随着移动APP的快速迭代,开发趋势越来越多的APP中嵌入了html网页,但在一些大中型APP中,尤其是电商类APP。html页面已经不仅仅满足展示功能,这时html要求能与原生语言进行交互、相互传值。
:比如携程APP中一个热门景点的网页中,点击某个景点,可以跳转到原生中的该景点详情页控制器。
JS给OC传值:
- 技术方案:使用自定义url方法,每次点击网页
- 使用场景: 网页中代码中的某个方法,比如点击事件方法,将该方法的参数传值给OC,供OC使用。
比如:携程APP中一个热门景点的网页中,有很多个热门景点,点击某个景点的图片或名称,可以跳转到原生中的该景点详情页控制器。 - 代码实现如下:
JS里要实现的代码:
//对JS传来的值进行调用
- (void)doSomeThingWithParamA:(id)paramA andParamB:(id)paramB{
[self.navigationController popViewControllerAnimated:YES];
// NSLog(@"%@ %@", paramA, paramB);
}
function testClick()
{
var str1=document.getElementById("text1").value;
var str2=document.getElementById("text2").value;
// "objc://"为自定义协议头;
// str1&str2为要传给OC的值,以":/"作为分隔
window.location.href="objc://"+":/"+str1+":/"+str2;
}
在需要给OC传值的函数里(例如:testClick()
)写如上格式的代码。
其中objc://
是自定义的协议头,str1
与str2
为JS要传给OC的值。
OC里要实现的代码:
//遵守UIWebViewDelegate代理协议。
-(BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType{
//拿到网页的实时url
NSString *requestStr = [[request.URL absoluteString] stringByRemovingPercentEncoding];
//在url中寻找自定义协议头"objc://"
if ([requestStr hasPrefix:@"objc://"]) {
// 以"://"为中心将url分割成两部分,放进数组arr
NSArray *arr = [requestStr componentsSeparatedByString:@"://"];
NSLog(@"%@",arr);
//取其后半段
NSString *paramStr = arr[1];
NSLog(@"%@",paramStr);
//以":/"为标识将后半段url分割成若干部分,放进数组arr2,此时arr2[0]为空,arr2[1]为第一个传参值,arr2[2]为第二个传参值,以此类推
NSArray *arr2 = [paramStr componentsSeparatedByString:@":/"];
NSLog(@"%@",arr2);
//取出参数,进行使用
if (arr2.count) {
NSLog(@"有参数");
[self.navigationController popViewControllerAnimated:YES];
// [self doSomeThingWithParamA:arr2[1] andParamB:arr2[2]];
}else{
NSLog(@"无参数");
}
return NO;
}
return YES;
}
//对JS传来的值进行调用
- (void)doSomeThingWithParamA:(id)paramA andParamB:(id)paramB{
[self.navigationController popViewControllerAnimated:YES];
// NSLog(@"%@ %@", paramA, paramB);
}
如果只是简单的区分返回按钮是到哪一层级,如下方法即可。
//如果是H5页面里面自带的返回按钮处理如下:
#pragma mark - webViewDelegate
- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType {
NSString * requestString = [[request URL] absoluteString];
requestString = [requestString stringByReplacingPercentEscapesUsingEncoding:NSUTF8StringEncoding];
//获取H5页面里面按钮的操作方法,根据这个进行判断返回是内部的还是push的上一级页面
if ([requestString hasPrefix:@"objc://"]) {
[self.navigationController popViewControllerAnimated:YES];
}else{
[self.webView goBack];
}
return YES;
}
粗略的写了下,希望对你有帮助哈哈