如今app中H5頁面越來越多，app如何與H5頁面交互是開發者不可避免的問題，今天就和大家探討這個問題。
示例網頁源碼：
<html>
<head>
<title>webView與H5交互方法</title>
<meta http-equiv="Content-Type"content="text/html; charset=UTF-8">
<script>
function alertTest()
{
alert("網頁提示框！");
}
function postString(){
return document.getElementById("text1").value;
}
</script>
<body>
<br/>
<br/>
<br/>
<a href='ios://openMyAlbum'>打開相冊</a><br><br/>
<a href = 'ios://openMyCamera'>打開相機</a>
<p><input type="text" id="text1" value="返回值"/></p>
<p><input type="button" id="btn" value="提交" onclick="postString()"/></p>
</body>
</html>
一、借助于第三方
推薦一個比較好的第三方庫即：WebViewJavascriptBridge
該庫使用起來非常簡單：
1.[WebViewJavascriptBridge enableLogging]; // 開啟日志
2.//初始化WebViewJavascriptBridge方法
_bridge= [WebViewJavascriptBridge bridgeForWebView:self.webView webViewDelegate:self handler:^(id data,WVJBResponseCallback responseCallback) {
}];
3.JS調用OC方法 //原生與JS約定接口名為“openMyCamera”，data是JS傳遞過來的信息，responseCallback來將信息傳遞給JS
[_bridge registerHandler:@"openMyCamera" handler:^(id data,WVJBResponseCallback responseCallback) {
[self openMyCamera];
responseCallback（"postInfomationToJS"）
}];
4.OC調用JS方法 data傳入參數，response返回參數
[_bridge callHandler:@"postString" data:nil responseCallback:^(id response) {
NSLog(@"paySuccessJavascriptHandler responded: %@", response);
}];
深入了解的可以看這篇文章
二、不借助于第三方
1.OC調用JS方法
如上實例代碼調用JS的 alertTest與postString方法:
NSString *str = [_webView stringByEvaluatingJavaScriptFromString:@"postString();"];
[_webView stringByEvaluatingJavaScriptFromString:@"alertTest();"];
2.H5頁面調用OC方法
- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType
webview每次加載之前都會調用這個方法，在此方法中攔截網頁加載的URL 我們可以與網頁制定協議，例如：以 iOS://開頭的URL我們就攔截，再根據攔截信息調用對應的方法。
<a href='ios://openMyAlbum'>打開相冊</a><br><br/>
<a href = 'ios://openMyCamera'>打開相機</a>
這樣就可以調用OC的方法了。
- (void)openMyAlbum {
//打開相冊
}
- (void)openMyCamera {
//打開相機
}
- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType {
//在此方法中攔截網頁加載的URL 我們可以與網頁制定協議，例如：以iOS://開頭的URL我們就攔截，再根據攔截信息調用對應的方法
NSString *urlstr = request.URL.absoluteString;
NSRange range = [urlstr rangeOfString:@"ios://"];
if (range.length!=0) {
NSString *method = [urlstr substringFromIndex:(range.location+range.length)];
SEL selctor = NSSelectorFromString(method);
[self performSelector:selctor withObject:nil];
}
return YES;
}
