、WKWebView
WKWebViewの初期化は、コンフィギュレーションと呼ばれるパラメータがある場合、それはパラメータのWKUserContentControllerタイプであり、それはパラメータのWKWebViewConfiguration型であり、WKWebViewConfigurationはuserContentControllerと呼ばれる性質を有しています。
WKWebViewConfiguration *設定= [[WKWebViewConfiguration ALLOC] INIT]。 config.preferences = [[WKPreferences ALLOC] INIT]。 config.preferences.minimumFontSize = 10 。 config.preferences.javaScriptEnabled = YES; config.preferences.javaScriptCanOpenWindowsAutomatically = NO; config.userContentController = [[WKUserContentController ALLOC] INIT]。 config.processPool = [[WKProcessPool ALLOC] INIT]。 config.userContentController = [WKUserContentController 新しい新]; // wkWebViewを作成する場合、方法はJSに呼ばれるように登録する必要があり、OCは、JSを達成するために、エンドに対応する [config.userContentController addScriptMessageHandler：自己名："@ callFunciton " ]; WKWebView * wkWebView = [[WKWebView ALLOC] initWithFrame：self.view.frame設定：CONFIG]。 self.wkWebView = wkWebView。 wkWebView.navigationDelegate = 自己; wkWebView.UIDelegate = 自己; NSURLRequest *リクエスト= [[NSURLRequest ALLOC] initWithURL：self.url]。 [wkWebView loadRequest：要求]。 [self.viewのaddSubview：wkWebView]。
1.JSコールネイティブMessageHandlerの
WKUserContentControllerオブジェクトは、メソッドを持っています
- （無効）addScriptMessageHandler :( ID <WKScriptMessageHandler>）scriptMessageHandler名：（NSStringの*）名。
JSは、OCを呼び出すと、このコードは非常に重要です
// wkWebViewを作成する場合、方法はOCはJSを達成するために、エンドに対応し、jsのに呼ばれるように登録する必要があります [config.userContentController addScriptMessageHandler：自己名：「@ callFunciton 」 ];
名前：addScriptMessageHandlerは、2つのパラメータがありますが、最初のパラメータはuserContentControllerプロキシオブジェクトで、2番目のパラメータは、送信JSのpostMessageの目的です。
だから、MessageHandlerの機能を使用するために、WKScriptMessageHandler合意を実施する必要があります。
WKScriptMessageHandlerプロキシ方式を達成するために1。
JSはcallFunctionメソッドを呼び出すと、これは、コールバックデリゲートメソッドになります。
- （ボイド）userContentController：（WKUserContentController *）userContentController didReceiveScriptMessage：（WKScriptMessage * ）メッセージ{ 場合（[message.name isEqualToString："@ callFunction " ]）{ // 调用原生扫码 } }
ヒント：addScriptMessageHandlerが簡単にコントローラが解放することができない原因と、循環参照を引き起こします
- （ボイド）のdealloc { [self.wkWebView.configuration.userContentController removeScriptMessageHandlerForName："@ callFunction " ]; }
使用中の2.JS：
window.webkit.messageHandlers。<名前> .postMessage（<するmessagebody> ） // ここで、<name>は、上記方法は、第2のパラメータ`NAME`です。 // 2番目のパラメータが記入する場合たとえば、私たちは、APIを呼び出す@「callFunctionを」、そしてJSがあります： window.webkit.messageHandlers.callFunction.postMessage（<するmessagebody> ） // <するmessagebody>キーと値のペアがあり、キー体は、パラメータの値が複数のタイプ、ボディタイプを持つことができます：可タイプはのNSNumber、NSStringの、NSDate、NSArrayの、NSDictionaryの、そしてnsnullをしている
、NULLまたは他のパラメータすることができ、何も書かないためにすることができない、またはプロキシ方式を取ることはありませんするmessagebody
2.ネイティブコールJS
[self.webView evaluateJavaScript：@ "ショー（）" completionHandler：^（ID _Nullable応答、NSError * _Nullableエラー）{
// TODO
}]。
3.WKNavigationDelegate
一部のパラメータは、ネイティブのH5との相互作用もまた、このように単純な接続を通過することができます
- （ボイド）のWebView：（WKWebView *）のWebView decidePolicyForNavigationAction：（WKNavigationAction *）navigationAction decisionHandler :( ボイド（^ ）（WKNavigationActionPolicy））decisionHandler {
NSStringの * URL = navigationAction.request.URL.absoluteString。 もし（！[URL isEqualToString：self.strURL]）{
// 页面跳转 } decisionHandler（WKNavigationActionPolicyAllow）。 }
二、WebViewJavaScriptBridge
WebViewJavaScriptBridge OCとJSの相互作用でWKWebView＆のUIWebViewのため。
その基本的な原理は、ブリッジに登録されたOC方法、JSをコールするように、JSブリッジの登録方法を、OCをコールするようにします。
1.初期化
1.インポートヘッダファイル #import <WebViewJavascriptBridge.h>
WebViewJavaScriptBridgeとWebViewの間の2の関係
_jsBridge = [WebViewJavascriptBridge bridgeForWebView：_webView]。
HTMLファイル3.これらの2つのJS関数をコピーして貼り付けます
関数setupWebViewJavascriptBridge（コールバック）{ 場合（window.WebViewJavascriptBridge）{
リターンコールバック（WebViewJavascriptBridge）。
} 場合（window.WVJBCallbacks）{
戻りwindow.WVJBCallbacks.push（コールバック）。
} window.WVJBCallbacks = [コールバック]; // グローバルプロパティWVJBCallbacksアレイを作成し、コールバックは、アレイ内に挿入されます。 document.createElement WVJBIframe = VAR（' IFRAME '）; // iframe要素を作成
WVJBIframe.style.display = ' なしの' ; //は表示されません
WVJBIframe.src = ' wvjbscheme：// BRIDGE_LOADED__ __を' ; //は、iframeのsrcを設定しますプロパティ document.documentElement.appendChild（WVJBIframe）; // 現在のファイルのナビゲーションにはiframeを追加します。 setTimeout（関数（）{
document.documentElement.removeChild（WVJBIframe）
}、0） } // この主に登録されているOC JSメソッドが呼び出されます。 setupWebViewJavascriptBridge（関数（ブリッジ）{ }）;
2.注入するOC、JS方法
ブリッジは、OC法に注入しました
/ * ScanClickはOCブロックの別名であります *ブロック自体、JSは、いくつかの方法をscanClickするために呼び出すとき、コードのブロック * OC JSの呼び出しによって、この目的のために起因するデータ、データが最後JSからのデータ転送があるので、 *データが終了した後、端部に移行JS端子台responseCallback OC * / [_jsBridge registerHandler：@ " scanClick "ハンドラ：^（識別データ、WVJBResponseCallback responseCallback）{ NSLog（"@ dataFrom JSた：％@ " [、データ" @ データ" ]）。 responseCallback（@ " スキャン結果：www.baidu.com " ）; }]。
JSは、ブリッジ機能に注入しました
/ * * EstJavaScriptFunction：エイリアスOC側コールのためのブリッジJS関数に注入されます。 *データ：データコールバック関数、JS関数は、OCによって呼び出され、そのデータは、OC端からのデータ転送であるからです。 * ResponseCallback：JS終了された後に呼び出さOCを呼び出して、データは、端末OCに送信します * / // これは主にOCが呼び出されます登録するJS方法です。 setupWebViewJavascriptBridge（関数（ブリッジ）{ // JS OCは、メソッドの宣言を呼び出す必要がある。 bridge.registerHanlder（' testJavaScriptFunction ' 、関数（データ、responseCallback）{ // データがデータOCを介して転送される。 // responseCallback JSコールが完了した後OCに渡されたデータ のアラート（「JSのOCと呼ばれます。」）; responseCallback（{データ：" JSデータ"から：" JS " }）。 }） }）;
3.コールOC、JS方法
JSを呼び出しOC
// シンプルなコールJSFunction、JSは、戻り値がのJSFunctionを必要としない、パラメータを渡すことはありません。 [_jsBridge callHandler："@ changeBGColor " ]; //はJSFunctionを呼び出し、パラメータのJSを渡すが、JSFuncitonの戻り値を必要としません。 [_jsBridge callHandler："@ changeBGColor "データ：@ " オレンジ色にHTMLの背景色!!!! " ]; // JSFunctionを呼び出し、またJSFunctionの戻り値を必要とする、パラメータのJSを渡します。 [_jsBridge callHandler：@ " changeBGColor "データ：@ " パスパラメータJSに" responseCallback：^（ID responseData）{ NSLog（@ " JS戻り値：％の@ " 、responseData）。 }]。
JSコールOC
// JSは単にOCブロック呼び出し WebViewJavascriptBridge.callHandler（' scanClickを' ;） // JS OCのブロックを呼び出し、JSパラメータ渡し WebViewJavascriptBridge.callHandler（' scanClick '、" JSパラメータを" ）; // JS OCを呼び出しますブロック、JS通過パラメータ、戻り値およびOCを受け入れます。 WebViewJavascriptBridge.callHandler（' scanClick '、{データ：" これは、JSスキャンデータがOCに送信される" }、関数（dataFromOC）{ アラート（" OCのと呼ばれるJS走査方式！" ）; document.getElementById（" のreturnValue "）.VALUE = dataFromOC。 }）;
4. OCリリースブロック
OC、消失時の電流コントローラが、そうでなければ、状況は、コントローラが発生することが解放できない、ブリッジから除去OCブロック橋、中に注入することを忘れません。
[_jsBridge removeHandler："@ scanClick " ];
例5
1.JS - > OCとの対話
OCでは、修飾navigationBar WebViewJavascriptBridgeの色は、ブロックによって登録します
[_jsBridge registerHandler：@ " colorClick "ハンドラ：^（識別データ、WVJBResponseCallback responseCallback）{ self.navigationController.navigationBar.barTintColor = [UIColor colorWithRed：arc4random_uniform（256）/ 255.0緑：arc4random_uniform（256）/ 255.0青：arc4random_uniform（256）/ 255.0アルファ：1.0 ]。 responseCallback（"@ 色の変更が完了しています！" ）; }]。
ブロックのOCを呼び出すためのJSには、いくつかの方法。
WebViewJavascriptBridge.callHandler（' colorClick ' 、関数（dataFromOC）{ アラート（" JSが登録OCのcolorClickメソッドを呼び出します" ）; document.getElementById（" のreturnValue "）.VALUE = dataFromOC。 }）
OC - > JSの相互作用
カラーJSFunctionを注入するブリッジは、HTMLのボディを修正しました。
// ここで宣言されたメソッドは、OC JSを呼び出すためのイニシアチブをとる必要があります。 setupWebViewJavascriptBridge（関数（ブリッジ）{ bridge.registerHandler（' changeBGColor ' 、関数（データ、responseCallback）{ // 警告（ 'AAAAAA'）; document.body.style.backgroundColor = " オレンジ" 。 document.getElementById（" のreturnValue "）.VALUE = データ。 }）; }）;
そして、ブリッジによってOCの終わりを呼び出します changeBGColor。
[_jsBridge callHandler："@ changeBGColor "データ：@ " HTMLの背景色がオレンジ色に!!!! " ];