iOS中JavaScript和OC交互

時間 2019-11-11

標籤 ios javascript 交互欄目 iOS 简体版

原文原文鏈接

轉載自：http://www.devzeng.com/blog/ios-uiwebview-interaction-with-javascript.htmljavascript

還可參考的文章：http://blog.csdn.net/lwjok2007/article/details/47058101html

在iOS開發中不少時候咱們會和UIWebView打交道，目前國內的不少應用都採用了UIWebView的混合編程技術，最多見的是微信公衆號的內容頁面。前段時間在作微信公衆平臺相關的開發，發現不少應用場景都是利用HTML5和UIWebView來實現的。java

機制

Objective-C語言調用JavaScript語言，是經過UIWebView的 - (NSString *)stringByEvaluatingJavaScriptFromString:(NSString *)script;的方法來實現的。該方法向UIWebView傳遞一段須要執行的JavaScript代碼最後獲取執行結果。ios

JavaScript語言調用Objective-C語言，並無現成的API，可是有些方法能夠達到相應的效果。具體是利用UIWebView的特性：在UIWebView的內發起的全部網絡請求，均可以經過delegate函數獲得通知。git

示例

下面提供一個簡單的例子介紹如何相互的調用，實現的效果是在界面上點擊一個連接，而後彈出一個對話框判斷是否登陸成功。github

（1）示例的HTML的源碼以下：web

 
     <html>  <head>  <meta http-equiv="content-type" content="text/html;charset=utf-8" />  <meta http-equiv="X-UA-Compatible" content="IE=Edge" />  <meta content="always" name="referrer" />  <title>測試網頁</title>  </head>  <body>  <br />  <a href="devzeng://login?name=zengjing&password=123456">點擊連接</a>  </body> </html>

（2）UIWebView Delegate回調方法爲：編程

 
     - (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType {  NSURL *url = [request URL];  if([[url scheme] isEqualToString:@"devzeng"]) {  //處理JavaScript和Objective-C交互  if([[url host] isEqualToString:@"login"])  {  //獲取URL上面的參數  NSDictionary *params = [self getParams:[url query]];  BOOL status = [self login:[params objectForKey:@"name"] password:[params objectForKey:@"password"]];  if(status)  {  //調用JS回調  [webView stringByEvaluatingJavaScriptFromString:@"alert('登陸成功!')"];  }  else  {  [webView stringByEvaluatingJavaScriptFromString:@"alert('登陸失敗!')"];  }  }  return NO;  }  return YES; }

說明：微信

一、同步和異步的問題網絡

（1）Objective-C調用JavaScript代碼的時候是同步的

- (NSString *)stringByEvaluatingJavaScriptFromString:(NSString *)script;

（2）JavaScript調用Objective-C代碼的時候是異步的

- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType;

二、常見的JS調用

（1）獲取頁面title

NSString *title = [webview stringByEvaluatingJavaScriptFromString:@"document.title"];

（2）獲取當前的URL

NSString *url = [webview stringByEvaluatingJavaScriptFromString:@"document.location.href"];

三、使用第三方庫

https://github.com/marcuswestin/WebViewJavascriptBridge

使用案例

一、動態將網頁上的圖片所有縮放

JavaScript腳本以下：

 
     function ResizeImages() {  var myImg, oldWidth;  var maxWidth = 320;  for(i = 0; i < document.images.length; i++) {  myImg = document.images[i];  if(myImg.width > maxWidth) {  oldWidth = myImg.width;  myImg.width = maxWidth;  myImg.heith = myImg.height*(maxWidth/oldWidth);  }  } }

在iOS代碼中添加以下代碼：

 
     [webView stringByEvaluatingJavaScriptFromString:  @"var script = document.createElement('script');"  "script.type = 'text/javascript';"  "script.text = \"function ResizeImages() { "  "var myimg,oldwidth;"  "var maxwidth=380;" //縮放係數  "for(i=0;i <document.images.length;i++){"  "myimg = document.images[i];"  "if(myimg.width > maxwidth){"  "oldwidth = myimg.width;"  "myimg.width = maxwidth;"  "myimg.height = myimg.height * (maxwidth/oldwidth);"  "}"  "}"  "}\";"  "document.getElementsByTagName('head')[0].appendChild(script);"]; [webView stringByEvaluatingJavaScriptFromString:@"ResizeImages();"];