如今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;
}
网友评论