iOS开发：给UIWebview的导航栏添加返回、关闭按钮
在咱们平日的开发中，难免有原生与H5的交互，好比说：从原生页面的一个按钮，点击以后跳转到了一个H5的页面A，A页面中又有一个按钮，点击以后，又加载了一个新的H5页面B，从B点击一个按钮，又加载一个新的H5页面C，若是此时咱们点击左上角的返回按钮，会直接返回到咱们的原生页面；html
是否是上面给用户的体验很很差（固然残品经理会以为是，咱们都是无所谓的啦），此时咱们想要从新定制返回按钮，咱们想要从C页面判断是否还有上一级H5页面可供返回，若是有上一级页面仍是H5，点击左上角的返回则返回到B页面，而且在B页面的左上角加上一个关闭按钮，这个关闭按钮的做用主要是为了关闭全部的H5的页面，直接返回到咱们原生的页面；若是咱们不点击关闭按钮，仍是点击返回，则从B页面返回到A页面；再次点击返回，则关闭了H5的页面，回到了原生的页面；git
说的也许有点儿绕，不过大体思想就是：先判断当前的H5页面是否能够返回：github
//判断当前H5是否能够返回 [self.webView canGoBack]
若是能够返回，则返回到上一个H5页面，并在左上角添加一个关闭按钮，若是不能够返回，则直接：web
//回到原生页面 [self.navigationController popViewControllerAnimated:YES];
下面是个人主要实现代码，我写一个继承与UIViewController的类，接受了UIWebviewDelegate，并定义了一个UIwebview的属性，给外面留了一个方法，只须要传递一个URL，咱们就能够加载；若是有地方须要加载H5的页面，咱们能够直接集成与这个类，这样的好处在于方便维护；网络
固然我封装的这个类，同时也是支持HTTPS的请求的；话很少说，代码以下：ide
建立一个类，继承与UIViewController，.h中的代码函数
#import <UIKit/UIKit.h> @interface SYWebViewController : UIViewController<UIWebViewDelegate, NSURLConnectionDelegate> //定义一个属性，方便外接调用 @property (nonatomic, strong) UIWebView *webView; //声明一个方法，外接调用时，只须要传递一个URL便可 - (void)loadHTML:(NSString *)htmlString; @end
.m中的实现以下：字体
#import "SYWebViewController.h"
@interface NSURLRequest (InvalidSSLCertificate)
+ (BOOL)allowsAnyHTTPSCertificateForHost:(NSString*)host;
+ (void)setAllowsAnyHTTPSCertificate:(BOOL)allow forHost:(NSString*)host;
@end
@interface SYWebViewController ()
@property (nonatomic, strong) NSURLRequest *request;
//判断是不是HTTPS的
@property (nonatomic, assign) BOOL isAuthed;
//返回按钮
@property (nonatomic, strong) UIBarButtonItem *backItem;
//关闭按钮
@property (nonatomic, strong) UIBarButtonItem *closeItem;
@end
@implementation SYWebViewController
- (void)viewDidLoad {
[super viewDidLoad];
self.view.backgroundColor = [UIColor whiteColor];
self.webView = [[UIWebView alloc] initWithFrame:CGRectMake(0, 0, self.view.frame.size.width, self.view.frame.size.height - 64)];
[self.view addSubview:self.webView];
[self addLeftButton];
}
//加载URL
- (void)loadHTML:(NSString *)htmlString
{
NSURL *url = [NSURL URLWithString:htmlString];
self.request = [NSURLRequest requestWithURL:url cachePolicy:NSURLRequestReloadIgnoringLocalCacheData timeoutInterval:5.0];
[NSURLRequest setAllowsAnyHTTPSCertificate:YES forHost:[url host]];
[self.webView loadRequest:self.request];
}
#pragma mark - UIWebViewDelegate
//开始加载
- (BOOL)webView:(UIWebView *)awebView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType
{
NSString* scheme = [[request URL] scheme];
//判断是否是https
if ([scheme isEqualToString:@"https"]) {
//若是是https:的话，那么就用NSURLConnection来重发请求。从而在请求的过程中吧要请求的URL作信任处理。
if (!self.isAuthed) {
NSURLConnection* conn = [[NSURLConnection alloc] initWithRequest:request delegate:self];
[conn start];
[awebView stopLoading];
return NO;
}
}
return YES;
}
//设置webview的title为导航栏的title
- (void)webViewDidFinishLoad:(UIWebView *)webView
{
self.title = [webView stringByEvaluatingJavaScriptFromString:@"document.title"];
}
#pragma mark ================= NSURLConnectionDataDelegate <NSURLConnectionDelegate>
- (BOOL)connection:(NSURLConnection *)connection canAuthenticateAgainstProtectionSpace:(NSURLProtectionSpace *)protectionSpace
{
return [protectionSpace.authenticationMethod isEqualToString:NSURLAuthenticationMethodServerTrust];
}
- (void)connection:(NSURLConnection *)connection willSendRequestForAuthenticationChallenge:(NSURLAuthenticationChallenge *)challenge
{
if ([challenge previousFailureCount] == 0) {
self.isAuthed = YES;
//NSURLCredential 这个类是表示身份验证凭据不可变对象。凭证的实际类型声明的类的构造函数来肯定。
NSURLCredential *cre = [NSURLCredential credentialForTrust:challenge.protectionSpace.serverTrust];
[challenge.sender useCredential:cre forAuthenticationChallenge:challenge];
}
}
- (void)connection:(NSURLConnection *)connection didFailWithError:(NSError *)error
{
NSLog(@"网络不给力");
}
- (void)connection:(NSURLConnection *)connection didReceiveResponse:(NSURLResponse *)response
{
self.isAuthed = YES;
//webview 从新加载请求。
[self.webView loadRequest:self.request];
[connection cancel];
}
#pragma mark - 添加关闭按钮
- (void)addLeftButton
{
self.navigationItem.leftBarButtonItem = self.backItem;
}
//点击返回的方法
- (void)backNative
{
//判断是否有上一层H5页面
if ([self.webView canGoBack]) {
//若是有则返回
[self.webView goBack];
//同时设置返回按钮和关闭按钮为导航栏左边的按钮
self.navigationItem.leftBarButtonItems = @[self.backItem, self.closeItem];
} else {
[self closeNative];
}
}
//关闭H5页面，直接回到原生页面
- (void)closeNative
{
[self.navigationController popViewControllerAnimated:YES];
}
#pragma mark - init
- (UIBarButtonItem *)backItem
{
if (!_backItem) {
_backItem = [[UIBarButtonItem alloc] init];
UIButton *btn = [UIButton buttonWithType:UIButtonTypeCustom];
//这是一张“<”的图片，可让美工给切一张
UIImage *image = [UIImage imageNamed:@"sy_back"];
[btn setImage:image forState:UIControlStateNormal];
[btn setTitle:@"返回" forState:UIControlStateNormal];
[btn addTarget:self action:@selector(backNative) forControlEvents:UIControlEventTouchUpInside];
[btn.titleLabel setFont:[UIFont systemFontOfSize:17]];
[btn setTitleColor:[UIColor sy_backColor] forState:UIControlStateNormal];
//字体的多少为btn的大小
[btn sizeToFit];
//左对齐
btn.contentHorizontalAlignment = UIControlContentHorizontalAlignmentLeft;
//让返回按钮内容继续向左边偏移15，若是不设置的话，就会发现返回按钮离屏幕的左边的距离有点儿大，不美观
btn.contentEdgeInsets = UIEdgeInsetsMake(0, -15, 0, 0);
btn.frame = CGRectMake(0, 0, 40, 40);
_backItem.customView = btn;
}
return _backItem;
}
- (UIBarButtonItem *)closeItem
{
if (!_closeItem) {
_closeItem = [[UIBarButtonItem alloc] initWithTitle:@"关闭" style:UIBarButtonItemStylePlain target:self action:@selector(closeNative)];
}
return _closeItem;
}
@end
具体的使用方法就是，建立一个类，继承与这类：SYWebViewControlleratom
#import <UIKit/UIKit.h> #import "SYWebViewController.h" @interface SYFlashHTMLViewController : SYWebViewController @end
而后在这个类的.m中的viewDidLoad中，调用父视图加载URL的方法，即：lua
- (void)viewDidLoad {
[super viewDidLoad];
self.webView.delegate = self;
[self loadHTML:self.htmlString];
}
效果以下图：打开百度（图片1），点击图片进入（图片2），点击返回返回到（图片3），图片1和图片的区别在于多了个关闭按钮：
图片1.png
图片2.png
图片3.png
GitHub地址：https://github.com/FirstDKS521/DKSWebView 纯手打，喜欢点个赞，但愿对看到的你有所帮助！！！