UIWebView 常用操作

UIWebView

---

加载本地HTML页面

使用 -(void)loadHTMLString:(NSString *)string baseURL:(nullable NSURL *)baseURL;

NSString *localHTMLPageName = @"myPage";
NSString *path = [[NSBundle mainBundle] pathForResource:localHTMLPageName ofType:@"html"];

// 从html文件中读取html字符串
NSFileHandle *readHandle = [NSFileHandle fileHandleForReadingAtPath:path];

NSString *htmlString = [[NSString alloc] initWithData:
                    [readHandle readDataToEndOfFile] encoding:NSUTF8StringEncoding];
// 或使用                 
// NSString *htmlString = [NSString stringWithContentsOfFile:path encoding:NSUTF8StringEncoding error:NULL];

// baseURL用来确定htmlString的基准地址，
// 相当于HTML的<base>标签的作用，定义页面中所有链接的默认地址。
[webView loadHTMLString:htmlString baseURL:[[NSBundle mainBundle] bundleURL]];

-(void)loadRequest:(NSURLRequest *)request;

NSString *localHTMLPageName = @"myPage";

NSString *localHTMLPageFilePath = [[NSBundle mainBundle] 	pathForResource:localHTMLPageName ofType:@"html"];

NSURL *localHTMLPageFileURL = [NSURL 	fileURLWithPath:localHTMLPageFilePath];

[webView loadRequest:[NSURLRequest 	requestWithURL:localHTMLPageFileURL]];	

---

移除滚动后的外边阴影

UIWebView包含一个scrollView组件，用来将关联web内容实现滚动效果，页面滚动后的UIWebView的面板周围会出现阴影效果，该效果是在四周添加UIImageView实现的，因此移除这种阴影效果的代码如下：

 UIScrollView *scrollView = webView.scrollView;

for (int i = 0; i < scrollView.subviews.count ; i++) {
    UIView *view = [scrollView.subviews objectAtIndex:i];
    if ([view isKindOfClass:[UIImageView class]]) {
        view.hidden = YES ;
    }
}  

---

在Safari中打开UIWebview中的链接地址

实现weiviewDelegate 的 shouldStartLoadWithRequest方法，再用openUrl方法 打开safari

-(BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request 
 navigationType:(UIWebViewNavigationType)navigationType
{
if ( navigationType == UIWebViewNavigationTypeLinkClicked ) {
    [[UIApplication sharedApplication] openURL:[request URL]];
    return NO;
}
return YES;
}

---

禁用页面滚动弹跳

之前提到UIWebView使用一个UIScrollView对象来关联web页面的内容，通过UIWebView的scrollView属性即可获得该对象，默认情况下网页长度超出设备视口长度后页面会滚动，用户使用手指滚动页面到页面边距并放开手指后页面会产生一个弹跳效果，去除这个效果的方法如下

webView.scrollView.bounces = NO ;

---

调用javascript代码

使用 - (nullable NSString *)stringByEvaluatingJavaScriptFromString:(NSString *)script;方法。

该方法规定执行的脚本时长限定在10s内，为的是防止过长时间的阻塞页面主线程，超过执行时间上线会自动停止脚本运行，并且脚本可分配内存限定在10MB内，超过分配上线将会引发异常。

//比如获取web页面标题
NSString *pageTitle = [webView stringByEvaluatingJavaScriptFromString:@"document.title"];	

javascript调用native代码

还是通过 shouldStartLoadWithRequest 方法

通过js代码模拟一次特殊的网络请求来达到调用该代理方法的作用，并通过过滤“特殊的url”来达到有目的性的js代码调用native代码的效果。所谓的“特殊的url”主要的目的是达到一种标识的效果，我们可以规定url的scheme部分，如appscheme://appName?invokeMethodName=objcMethod&paramA=xxx;也可以在常规的url后面附加特殊的参数标识，如http://www.yoursite.com?objecMethodCallFlag=1&methodName=methodA&paramA=xxx。之后根据规定在代理方法中去相应的解析url并做出if else判断即可。

---

让UIWebView更加接近native

某些情况下，我们既想要UIWebView加载web页面，又想使得所加载的页面的外观和操作行为更加接近native感觉。这时需要使用一些CSS样式来达到这些效果，这些CSS只适用于IOS中的Safari。

• -webkit-touch-callout

禁用长按触控对象弹出的菜单。IOS中，当你长按一个触控对象时，如链接，safari会弹出包含链接信息的菜单。禁用此行为CSS代码

.disable-callout{
-webkit-touch-callout:none ;
}

或在webViewDidFinisheLoad中使用

[webView stringByEvaluatingJavaScriptFromString:@"document.documentElement.style.webkitTouchCallout='none';"];

• -webkit-user-select

控制用户是否可以选择页面元素内容。IOS中，在页面元素中进行长按操作，safari会弹出菜单，来允许进行选择行为。禁用此行为代码

.disable-select{
	-webkit-user-select:none;
}

或在webViewDidFinisheLoad中使用

[webView stringByEvaluatingJavaScriptFromString:@"document.documentElement.style.webkitUserSelect='none';"];

• -webkit-tap-highlight-color

覆盖当用户tap链接或clickable元素时默认产生的高亮颜色（灰色）。如

.no-highlight{
-webkit-tap-highlight-color:rgba(0,0,0,0);
}

参考Apple CSS

---

清除缓存和cookie

//清除cookies
NSHTTPCookie *cookie;
NSHTTPCookieStorage *storage = [NSHTTPCookieStorage sharedHTTPCookieStorage];
for (cookie in [storage cookies]) 
{
[storage deleteCookie:cookie];
}

//UIWebView清除缓存：
[[NSURLCache sharedURLCache] removeAllCachedResponses];

---

UIWebView拖动不露底

UIScrollView  *scroller = [webView.subviews objectAtIndex:0];    
if (scroller)    {        
	scroller.bounces = NO;        
	scroller.alwaysBounceVertical = NO;    
	}