前言：
因?yàn)楣緲I(yè)務(wù)需要，所以在iOS與H5方面的交互進(jìn)行較為復(fù)雜的的處理上就要有更深的了解。查閱了網(wǎng)絡(luò)上的各大神寫的博客。特在這里做一個(gè)總結(jié)。寫的好的只貼鏈接地址，畢竟再來造輪子沒這個(gè)必要。下面我所選擇的，也是經(jīng)過我的篩選，排除了網(wǎng)絡(luò)上面大量的重復(fù)文章和糟糕的排版。這里我選擇的也是可上手實(shí)踐的，至于更多的原理和理論，請大家自行搜索。因?yàn)榭傆X得原理和理論的更應(yīng)該系統(tǒng)去學(xué)習(xí)，所以，在這里不提供。
JS和OC交互
關(guān)于JS和OC的交互，總結(jié)起來大致有以下幾種方式
1.URL地址在OC中攔截跳轉(zhuǎn)
2.利用系統(tǒng)庫JavaScriptCore，來做相互調(diào)用
3.利用第三方庫WebViewJavascriptBridge
4.利用第三方cordova庫，以前叫PhoneGap
5.React Native
關(guān)于4和5，其實(shí)可以歸為一類，非原生開發(fā)。對于cordova因?yàn)橹霸谝粋€(gè)家公司app外包給別人開發(fā)，我接手的時(shí)候做過這方面的插件開發(fā)，算是有所了解，不過，因?yàn)閏ordova開發(fā)的app實(shí)在是太慢了，頁面的流暢度跟原生完全不是一個(gè)級別的，雖說隨著cpu的發(fā)展，兩者不會相差太大，但是還是能夠感覺出來的。故我始終嫌棄cordova的開發(fā)。而React Native據(jù)說是未來的開發(fā)趨勢，因?yàn)槲覜]有深入研究，在此也不做評價(jià)。
下面著重來說下前面的三種方式。
這里首先引入推薦的第一個(gè)人的博文系列：
iOS下JS與原生OC互相調(diào)用(總結(jié))
iOS下JS與OC互相調(diào)用（一）--UIWebView 攔截URL
iOS下JS與OC互相調(diào)用（二）--WKWebView 攔截URL
iOS下JS與OC互相調(diào)用（三）--MessageHandler
iOS下JS與OC互相調(diào)用（四）--JavaScriptCore
iOS下JS與OC互相調(diào)用（五）--UIWebView + WebViewJavascriptBridge
iOS下JS與OC互相調(diào)用（六）--WKWebView + WebViewJavascriptBridge
iOS下JS與OC互相調(diào)用（七）--Cordova 基礎(chǔ)
iOS下JS與OC互相調(diào)用（八）--Cordova詳解+實(shí)戰(zhàn)
這里的已經(jīng)完全涵蓋了前面幾種方法的實(shí)現(xiàn)。所以看完這個(gè)總結(jié)，基本對JS交互有了了解。
接下來一篇博文，是著重對前三種的講解。
JS和OC的交互（基于UIWebView）
推薦
在這里我想推薦的是第三種利用第三方庫WebViewJavascriptBridge。這是原生里我篩選出來的覺得使用簡單功能強(qiáng)大齊全的一個(gè)方式。也是我同事（曾在釘釘?shù)那岸耍恢笔褂玫慕换シ绞健Ｋ赃€是值得認(rèn)可的。
至于使用，下面推薦第三篇博文
[iOS] 使用WebViewJavascriptBridge實(shí)現(xiàn)OC與JS交互
基本上，以上這些推薦就完全滿足js與oc的交互。
WebView的使用總結(jié)
UIWebView的基礎(chǔ)使用
- (void)viewDidLoad {
[super viewDidLoad];
// 1、創(chuàng)建UIWebView：
CGRect bouds = [UIScreen mainScreen].bounds;
UIWebView* webView = [[UIWebView alloc]initWithFrame:bouds];
// 2、加載在線資源http內(nèi)容
NSURL* url = [NSURL URLWithString:@"http://www.baidu.com"];//創(chuàng)建URL
NSURLRequest* request = [NSURLRequest requestWithURL:url];//創(chuàng)建
[webView loadRequest:request];//加載
// 2、 加載本地文件的方法：
/**
*
//第一種方法：
NSString* path = [[NSBundle mainBundle] pathForResource:@"index" ofType:@"html"];//mobile是根目錄，name是文件名稱，html是文件類型
[webView loadRequest:[NSURLRequest requestWithURL:[NSURL fileURLWithPath:path]]]; //加載本地文件
//第二種方法：
NSString *resourcePath = [[NSBundle mainBundle] resourcePath];
NSString *filePath = [resourcePath stringByAppendingPathComponent:@"mobile.html"];
NSString *htmlstring=[[NSString alloc] initWithContentsOfFile:filePath encoding:NSUTF8StringEncoding error:nil];
[webView loadHTMLString:htmlstring baseURL:[NSURL fileURLWithPath:[[NSBundle mainBundle] bundlePath]]];
*/
// 3、導(dǎo)航
// UIWebView類內(nèi)部會管理瀏覽器的導(dǎo)航動(dòng)作，通過goForward和goBack方法你可以控制前進(jìn)與后退動(dòng)作：
[webView goBack];
[webView goForward];
// 4、UIWebViewDelegate委托代理
webView.delegate = self;
// 5、顯示網(wǎng)頁視圖UIWebView：
[self.view addSubview:webView];
}
# pragma mark - UIWebView 的代理方法
- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType;//當(dāng)網(wǎng)頁視圖被指示載入內(nèi)容而得到通知。應(yīng)當(dāng)返回YES，這樣會進(jìn)行加載
- (void)webViewDidStartLoad:(UIWebView *)webView { //當(dāng)網(wǎng)頁視圖已經(jīng)開始加載一個(gè)請求后，得到通知。
// [webView stopLoading];//取消載入內(nèi)容
}
- (void)webViewDidFinishLoad:(UIWebView *)webView;//當(dāng)網(wǎng)頁視圖結(jié)束加載一個(gè)請求之后，得到通知。
- (void)webView:(UIWebView *)webView didFailLoadWithError:(nullable NSError *)error {
// [webView reload];//重載
}//當(dāng)在請求加載中發(fā)生錯(cuò)誤時(shí)，得到通知。會提供一個(gè)NSSError對象，以標(biāo)識所發(fā)生錯(cuò)誤類型。
IOS中UIWebView常用注意點(diǎn)：
1.與UIWebView進(jìn)行交互，調(diào)用web頁面中的需要傳參的函數(shù)時(shí)，參數(shù)需要帶單引號，或者雙引號（雙引號要進(jìn)行轉(zhuǎn)義在轉(zhuǎn)義字符前加\）,傳遞json字符串時(shí)不需要加單引號或雙引號：
-(void)webViewDidFinishLoad:(UIWebView *)webView
{
NSString *sendJsStr=[NSString stringWithFormat:@"openFile(\"%@\")", jsDocPathStr];
[webView stringByEvaluatingJavaScriptFromString:sendJsStr];
}
2.在該代理方法中判斷與webView的交互，可通過html里定義的協(xié)議實(shí)現(xiàn)
- (BOOL)webView:(UIWebView*)webView shouldStartLoadWithRequest:(NSURLRequest*)request navigationType:(UIWebViewNavigationType)navigationType;
3.為webView添加背景圖片
webView.backgroundColor=[UIColor clearColor];
//這句話很重要，webView是否是不透明的，no為透明 在webView下添加個(gè)imageView展示圖片就可以了
webView.opaque=NO;
4.獲取webView頁面內(nèi)容信息
NSString *docStr=[webView stringByEvaluatingJavaScriptFromString:@"document.documentElement.textContent"];
//獲取web頁面內(nèi)容信息，此處獲取的是個(gè)son字符串
SBJsonParser *parserJson=[[[SBJsonParser alloc]init]autorelease];
NSDictionary *contentDic=[parserJson objectWithString:docStr];
//將json字符串轉(zhuǎn)化為字典
5.將文件下載到本地址然后再用webView打開
NSString *path = [[[[NSBundle mainBundle] resourcePath] stringByDeletingLastPathComponent] stringByAppendingPathComponent:@"Documents"];
NSString *resourceDocPath = [[NSString alloc] initWithString:path];
self.filePath = [resourceDocPath stringByAppendingPathComponent:[NSString stringWithFormat:@"maydoc%@",docType]];
NSData *attachmentData = [[NSData alloc] initWithContentsOfURL:[NSURL URLWithString:theUrl]];
[attachmentData writeToFile:filePath atomically:YES];
NSURL *url = [NSURL fileURLWithPath:filePath];
NSURLRequest *requestObj = [NSURLRequest requestWithURL:url];
[attachmentWebView loadRequest:requestObj];
//刪除指定目錄下的文件
NSFileManager *magngerDoc=[NSFileManager defaultManager];
[magngerDoc removeItemAtPath:filePath error:nil];
6.處理webView展示txt文檔亂碼問題
if ([theType isEqualToString:@".txt"]) {
//txt分帶編碼和不帶編碼兩種，帶編碼的如UTF-8格式txt，不帶編碼的如ANSI格式txt
//不帶的，可以依次嘗試GBK和GB18030編碼
NSString* aStr = [[NSString alloc] initWithData:attachmentData encoding:NSUTF8StringEncoding];
if (!aStr)
{
//用GBK進(jìn)行編碼
aStr=[[NSString alloc] initWithData:attachmentData encoding:0x80000632];
}
if (!aStr)
{
//用GBK編碼不行,再用GB18030編碼
aStr=[[NSString alloc] initWithData:attachmentData encoding:0x80000631];
}
//通過html語言進(jìn)行排版
NSString* responseStr = [NSString stringWithFormat:
@"%@",aStr];
[attachmentWebView loadHTMLString:responseStr baseURL:[NSURL fileURLWithPath:[[NSBundle mainBundle] bundlePath]]];
return;
}
更多總結(jié)見這篇博文（IOS開發(fā) - UIWebView(用法全面介紹,含最全的JS交互)）上面的一些是列舉我認(rèn)為常用的，這個(gè)博文會持續(xù)更新，把我后期增加的路由跳轉(zhuǎn)來分享下。
