关于WebKit
最近接手的一个app页面全部用H5写的,使用的是WebKit框架。我之前写的app也有H5页面,不过只有两页,用的是webView,全H5写app用WebKit是很有必要的,在这里推荐两篇文章快速了解WebKit:
iOS 8 WebKit框架概览(上)
iOS 8 WebKit框架概览(下)
打电话失败
然后,问题来啦。app有联系客服功能,点击客服电话,发现电话打不出去。
*注:电话打不出去的意思是压根没有调用电话这个功能,不是没人接啊~ *
题外话: 最近电话号码13585904041很火,我也拿来用一下
通过控制台Log可以发现,请求失败了:
#pragma mark 页面加载失败之后调用
- (void)webView:(WKWebView *)webView didFailProvisionalNavigation:(WKNavigation *)navigation withError:(NSError *)error
{
NSLog(@"页面加载失败:\n %@",error);
}
页面加载失败:
Error Domain=NSURLErrorDomain Code=-1002 "unsupported URL" UserInfo={_WKRecoveryAttempterErrorKey=<WKReloadFrameErrorRecoveryAttempter: 0x7fe7f3d7a3c0>, NSErrorFailingURLStringKey=tel:13585904041, NSErrorFailingURLKey=tel:13585904041, NSUnderlyingError=0x7fe7f3d6e260 {Error Domain=kCFErrorDomainCFNetwork Code=-1002 "unsupported URL" UserInfo={NSErrorFailingURLStringKey=tel:13585904041, NSLocalizedDescription=unsupported URL, NSErrorFailingURLKey=tel:010-57745342}}, NSLocalizedDescription=unsupported URL}
看这些Log不要头晕啊,总而言之一句话,不支持打开 tel:13585904041 这个URL,到这里,我们先复习一下打电话的代码。
iOS打电话的代码
方法一:
[[UIApplication sharedApplication] openURL:[NSURL URLWithString:@"tel://10010"]];//打电话```
使用openURL这个API打电话结束后,返回的是系统的拨打电话界面,如何才能返回自己的应用呢?看下面的方法。
#####方法二:
使用UIWebView加载电话,这种是合法的,可以上App Store的。
UIWebView *callWebview =[[UIWebView alloc] init];
NSURL *telURL =[NSURL URLWithString:@"tel:13585904041"];
[callWebview loadRequest:[NSURLRequest requestWithURL:telURL]];
//记得添加到view上
[self.view addSubview:callWebview];
还有一种是私有方法,不能上App Store的(自己没试过,有求真精神的可以试试然后告诉我被拒没)。
[[UIApplication sharedApplication] openURL:[NSURL URLWithString:@"telprompt://10010"]];```
到这里我们可以发现UIWebView是可以打开 tel:13585904041 的,但是,很明显,WebKit框架里的WKWebView不支持 打开tel:XXX 这种URL。
解决方法
通过打断点,可以发现打开一个url大概需要依次走以下代理方法(不全):
#pragma mark 在发送请求之前,决定是否跳转
-(void)webView:(WKWebView *)webView decidePolicyForNavigationAction:(WKNavigationAction *)navigationAction decisionHandler:(void (^)(WKNavigationActionPolicy))decisionHandler
{
NSLog(@"在收到响应前,决定是否跳转");
decisionHandler(WKNavigationActionPolicyAllow);//允许跳转
}
#pragma mark 页面开始加载时调用
-(void)webView:(WKWebView *)webView didStartProvisionalNavigation:(WKNavigation *)navigation
{
NSLog(@"页面开始加载");
}
#pragma mark 页面加载完成之后调用
- (void)webView:(WKWebView *)webView didFinishNavigation:(WKNavigation *)navigation;
{
NSLog(@"页面加载完成");
}
#pragma mark 页面加载失败之后调用
- (void)webView:(WKWebView *)webView didFailProvisionalNavigation:(WKNavigation *)navigation withError:(NSError *)error
{
NSLog(@"页面加载失败:\n %@",error);
}
在加载一个页面之前会先决定是否跳转,我刚开始设置所有的请求都允许加载,收到@"tel:13585904041"请求后,就进到didStartProvisionalNavigation方法开始打开这个URL,然后就失败了,所以我们需要截掉tel请求。
修改后的代理方法:
#pragma mark 在发送请求之前,决定是否跳转
-(void)webView:(WKWebView *)webView decidePolicyForNavigationAction:(WKNavigationAction *)navigationAction decisionHandler:(void (^)(WKNavigationActionPolicy))decisionHandler
{
NSLog(@"在收到响应前,决定是否跳转");
NSString *urlString = [[navigationAction.request URL] absoluteString];
urlString = [urlString stringByRemovingPercentEncoding];//解析url
if ([urlString hasPrefix:@"tel"])//截获电话请求
{
//取消WKWebView 打电话请求
decisionHandler(WKNavigationActionPolicyCancel);
//用openURL 这个API打电话
[[UIApplication sharedApplication] openURL:[NSURL URLWithString: urlString];
}
else
{
decisionHandler(WKNavigationActionPolicyAllow);//允许其他请求
}
}
修改后就解决啦~
对纯H5的吐槽
即使WebKit比WebView性能好些,但是纯H5页面还是卡死的感觉,用户体验很不好,兼容性也不好(快速开发的省的时间都用来调兼容了然而并没有什么卵用),最后吐槽一句,界面好丑,一点苹果的风格都没了,然后,我们,决定用React Native了~