iOS與JS互動的方法：

1.攔截url（適用於UIWebView和WKWebView）
2.JavaScriptCore（只適用於UIWebView，iOS7+）
3.WKScriptMessageHandler（只適用於WKWebView，iOS8+）
4.WebViewJavascriptBridge（適用於UIWebView和WKWebView，屬於第三方框架）

下面以假設的需求進行示例程式碼講解，需求：
（1）h5頁面呼叫原生掃二維碼（h5呼叫原生）
（2）原生掃碼成功後，將結果返回給h5（原生呼叫h5）

方法一. 攔截url

（1）web呼叫原生：

<1>和後端同事協定好協議，如jxaction://scan表示啟動二維碼掃描，jxaction://location表示獲取定位。
<2>實現UIWebView代理的shouldStartLoadWithRequest:navigationType:方法，在方法中對url進行攔截，如果是步奏<1>中定義好的協議則執行對應原生程式碼，返回false，否則返回true繼續載入原url。

- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType{
    if
 
 ([request.URL.absoluteString hasPrefix:@"jxaction://scan"]) {
        //呼叫原生掃描二維碼
       return NO;
    }
    return YES;
}

h5程式碼：

<a href="jxaction://scan">掃一掃(攔截url)</a>

（2）原生呼叫js

若（1）中掃描二維碼結束後，需要把掃描結果返回給web頁，直接呼叫UIWebView的stringByEvaluatingJavaScriptFromString:方法，或者WKWebView的 evaluateJavaScript:completionHandler:方法。

[self.webView stringByEvaluatingJavaScriptFromString:@"scanResult('我是掃描結果~')"];

方法二. JavaScriptCore

方法一web呼叫原生只適合簡單的呼叫，如果要傳遞引數，雖然也可以拼接在url上，如jxaction://scan?method=aaa，但是需要我們自行對字串進行分割解析，並且特殊字元需要編碼。在iOS7系統提供了JavaScriptCore，可以更優雅地實現js與原生的互動。
（1）js呼叫原生
<1>新建類繼承自NSObject（如AppJSObject）。
<2>.h檔案中宣告一個代理並遵循JSExport，代理內的方法和js定義的方法名一致。
<3>.m檔案中實現<2>代理中對應的方法，可以在方法內處理事件或通知代理。

AppJSObject.h

\#import <Foundation/Foundation.h>
\#import <JavaScriptCore/JavaScriptCore.h>

@protocol AppJSObjectDelegate <JSExport>

-(void)scan:(NSString *)message;

@end

@interface AppJSObject : NSObject<AppJSObjectDelegate>

@property(nonatomic,weak) id<AppJSObjectDelegate> delegate;

@end

AppJSObject.m

#import "AppJSObject.h"

@implementation AppJSObject

-(void)scan:(NSString *)message{
    [self.delegate scan:message];
}

@end

h5程式碼：

<input type="button" name="" value="掃一掃" onclick="scan()">
<br/>
<p id="result">掃描結果：</p>

<script type="text/javascript">
    //呼叫APP的掃描方法   h5->app
    function scan(){
        app.scan('scanResult');
    }

    //掃描結果回撥方法    app->h5
    function scanResult(result){
        document.getElementById("result").innerHTML = '掃描結果：' + result;  
    }
</script>

<4>在UIWebView載入完成的代理中把AppJSObject例項物件類注入到JS中，那麼在js中呼叫方法就會呼叫到原生AppJSObject例項物件中對應的方法了。

-(void)webViewDidFinishLoad:(UIWebView *)webView
{
    JSContext *context=[webView valueForKeyPath:@"documentView.webView.mainFrame.javaScriptContext"];

    AppJSObject *jsObject = [AppJSObject new];
    jsObject.delegate = self;
    context[@"app"] = jsObject;

}

程式碼：https://github.com/dolacmeng/JSDemo/tree/master
*也可以通過block實現而不建立新類AppJSObject:

context[@"openAlbum"] = ^(){
    NSLog(@"js呼叫oc開啟相簿");
};

（2）原生呼叫js

可以通過一中的方法，也可以通過JSContext：

JSContext *context=[_mainWebView valueForKeyPath:@"documentView.webView.mainFrame.javaScriptContext"];
NSString *alertJS= [NSString stringWithFormat:@"%@('%@')",_photoMethod,fileUrl];
[context evaluateScript:alertJS];

方法三. WKScriptMessageHandler

現在很多app都是支援iOS8+，很多人使用WKWebView代替了UIWebView，但是WKWebView並不支援方法二。此時我們可以使用WKWebView的WKScriptMessageHandler
<1>初始化WKWebView時，呼叫addScriptMessageHandler:name:方法，name為js中的方法名，如scan:

- (void)setupWKWebView{
    WKWebViewConfiguration *configuration = [[WKWebViewConfiguration alloc] init];
    configuration.userContentController = [[WKUserContentController alloc] init];
    [configuration.userContentController addScriptMessageHandler:self name:@"scan"];

    WKWebView *webView = [[WKWebView alloc] initWithFrame:self.view.frame configuration:configuration];
    webView.UIDelegate = self;
}

h5:

window.webkit.messageHandlers.scan.postMessage() 

<2>實現WKScriptMessageHandler代理方法，當js呼叫scan方法時，會回撥此代理方法：

- (void)userContentController:(WKUserContentController *)userContentController didReceiveScriptMessage:(WKScriptMessage *)message{
    if ([message.name isEqualToString:@"scan"]) {
        //呼叫原生掃碼
     }
}

方法四 WebViewJavascriptBridge

是一個第三方框架，官方文件和demo都很完整，不再累贅，GitHub地址：
https://github.com/marcuswestin/WebViewJavascriptBridge