http://blog.csdn.net/y550918116j/article/details/49619847
当你在项目中想嵌入网页时，可以使用UIWebView类嵌入Web内容。你只需要创建一个UIWebView对象，并将它附加到一个view窗口。你还可以使用这个类来执行页面历史的前进或后退。
本文主要介绍关于UIWebView的基础，包括：加载网页、实现代理以及JS和OC的互相调用。
1 准备工作
我已经为大家创建了html页面的源代码，只需要复制到记事本，并将文件名改为index.html。
这个页面有输入框、按钮和做显示用的，其简单功能是在输入框输入数据，点击按钮后显示到显示区域。
在浏览器运行可以看到如下效果。
1.2 搭建项目
这个地方就不详细描述了，创建一个简单项目->拉一个UIWebView到界面->UIWebView指向UIViewController的属性名。
搭建后的核心部分如下，这里我使用的VC名为BaseVC。
#import"BaseVC.h"@interfaceBaseVC() @property(weak,nonatomic)IBOutletUIWebView*webView;///< UIWebView
@end@implementationBaseVC
- (void)viewDidLoad {
[superviewDidLoad];
}@end
2 显示Web页面
将我们创建好的index.html拉到项目中，至于位置就随你高兴了。
然后我们改造BaseVC的viewDidLoad方法。
- (void)viewDidLoad {
[superviewDidLoad];
// 找到index.html的路径
NSURL*url = [[NSBundlemainBundle] URLForResource:@"index"withExtension:@"html"];
NSURLRequest*urlRequest = [NSURLRequestrequestWithURL:url];// url的位置[self.webViewloadRequest:urlRequest];// 加载页面
}
由于我们的html页面在项目里面，我们可以直接使用[NSBundle mainBundle]去寻找。如果你使用的是网咯连接“www.baidu.com”,你可以这样获得NSURL。
url =[NSURL URLWithString:@"www.baidu.com"];
然后运行项目，就可以看到和浏览器一样的效果。
3 代理UIWebViewDelegate
UIWebView也有代理，如果你不懂什么是代理模式，查阅我的博文《23设计模式之代理模式(Proxy)》。我们在UIWebViewDelegate发现了四个方法。
__TVOS_PROHIBITED@protocolUIWebViewDelegate
@optional
- (BOOL)webView:(UIWebView*)webView shouldStartLoadWithRequest:(NSURLRequest*)request navigationType:(UIWebViewNavigationType)navigationType;
- (void)webViewDidStartLoad:(UIWebView*)webView;
- (void)webViewDidFinishLoad:(UIWebView*)webView;
- (void)webView:(UIWebView*)webView didFailLoadWithError:(nullableNSError*)error;
@end
这四个代理的作用分别是：
- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType;:
将要加载一个web页面，返回yes代表继续加载，no代表不加载。
- (void)webViewDidStartLoad:(UIWebView *)webView;:
开始加载web页面；
- (void)webViewDidFinishLoad:(UIWebView *)webView;:
加载web页面结束;
- (void)webView:(UIWebView *)webView didFailLoadWithError:(nullable NSError *)error;:
加载web页面出错，你可以在error看到错误信息。
现在我们改造BaseVC。下面都只显示核心代码，不重要的代码不显示。
@interfaceBaseVC()<UIWebViewDelegate>
@property(weak,nonatomic)IBOutletUIWebView*webView;///< UIWebView
@end
@implementationBaseVC
- (void)viewDidLoad {
[superviewDidLoad];
// 找到index.html的路径
NSURL*url = [[NSBundlemainBundle] URLForResource:@"index"withExtension:@"html"];
NSURLRequest*urlRequest = [NSURLRequestrequestWithURL:url];// url的位置self.webView.delegate=self;// 代理UIWebViewDelegate
[self.webViewloadRequest:urlRequest];// 加载页面
}
#pragma mark - UIWebViewDelegate#pragma mark 开始加载网页
- (void)webViewDidStartLoad:(UIWebView*)webView {
NSLog(@"%@", NSStringFromSelector(_cmd));
}
#pragma mark 网页加载完成
- (void)webViewDidFinishLoad:(UIWebView*)webView {
NSLog(@"%@", NSStringFromSelector(_cmd));
}
#pragma mark 网页加载出错
- (void)webView:(UIWebView*)webView didFailLoadWithError:(nullableNSError*)error {
NSLog(@"%@:%@", NSStringFromSelector(_cmd), error.localizedDescription);
}
#pragma mark 网页监听
- (BOOL)webView:(UIWebView*)webView shouldStartLoadWithRequest:(NSURLRequest*)request navigationType:(UIWebViewNavigationType)navigationType {
NSLog(@"%@", NSStringFromSelector(_cmd));returnYES;
}
@end
运行后你会看到如下的输出,也体现了三种回调的顺序。如果你看到了其他输出信息，我想你可能出错了，请查阅前面的介绍，修改后再运行。
webView:shouldStartLoadWithRequest:navigationType:
webViewDidStartLoad:
webViewDidFinishLoad:
4 JS和OC互动
js和oc互动是一件很麻烦的事，毕竟是两种不同的开发语言。oc调js很简单，js回调oc就比较麻烦了。
oc调js:uiwebview就自带这样的方法
- (nullable NSString *)stringByEvaluatingJavaScriptFromString:(NSString *)script;
js掉oc：我们都知道js可以控制页面的跳转，我们还可以在链接中携带参数。而UIWebView又支持拦截这些请求的操作，这就让我们完美的实现了js调oc的操作。至于更高级的方法，我们在以后给大家介绍。
改变原有页面的功能，我们要实现下列需求。
在输入框输入相关信息，点击按钮，将输入的信息传输到oc中；
oc接受到信息后，通过oc调用js的功能将信息发到js；
js收到信息后，在页面显示相关信息。
由于js调用oc是通过url请求发送消息，所以，我们需要制定规范。只有符合我们规范的请求才会执行oc方法，否则不执行。
这里我使用的规范是ios::oc方法名::携带的参数。这样我们在oc端，当发现这样的请求时就开始拦截执行我们的操作。
我这里的三个参数，相信大家都能看懂，我是使用“::”分割，你也可以使用其他方式分割，或者组合你喜欢的规范。
接下来就是改造oc和js了。在BaseVC添加oc接受js调用的方法体，和改写- (BOOL)webView:(UIWebView*)webView shouldStartLoadWithRequest:(NSURLRequest*)request navigationType:(UIWebViewNavigationType)navigationType
#pragma mark - js调OC
- (void)jsCallOC:(NSString*)params {
NSLog(@"%@:%@", NSStringFromSelector(_cmd), params);NSString*jsStr = [NSStringstringWithFormat:@"ocCallJS('%@')", params];
// oc调js
[self.webViewstringByEvaluatingJavaScriptFromString:jsStr];
}
#pragma mark 网页监听
- (BOOL)webView:(UIWebView*)webView shouldStartLoadWithRequest:(NSURLRequest*)request navigationType:(UIWebViewNavigationType)navigationType {
NSLog(@"%@", NSStringFromSelector(_cmd));
// 过滤
NSString*requestString = request.URL.absoluteString.stringByRemovingPercentEncoding;
// 分割
NSArray*urlComps = [requestString componentsSeparatedByString:@"::"];
if ( [urlComps count] ==3&& [@"ios"isEqualToString:[urlComps objectAtIndex:0]] ) {
//解析约定的指令
// 方法名
NSString*methods = [NSStringstringWithFormat:@"%@:", [urlComps objectAtIndex:1]];
SEL selector = NSSelectorFromString(methods);
// 判断类是否有方法
if ( [BaseVC instancesRespondToSelector:selector]) {
// 携带的参数
NSString*params = [urlComps objectAtIndex:2];
NSLog(@"JS调用OC代码->UIWebView\n方法名:%@,参数:%@", methods, params);
// 执行方法，携带参数
[selfperformSelector:selector withObject:params];
}else{
NSLog(@"没有提供调用的%@方法名",methods);
}
returnNO;
}
returnYES;
}
[self performSelector:selector withObject:params];这段代码的意思是执行当前页面的方法体，并携带参数。我们使用通配的方式调用方法体，使代码更优雅便捷。
然后改变js代码。
运行项目，然后神奇的事情发生了，原来在app中嵌入网页这么简单。
