iOSでのWebとJs間の相互作用

• 問題

  ユニアプリフレームワークには落とし穴があり、フレームワークをプッシュした会社の兄弟が閉鎖されたように感じます。全体的な交換サイクルとコストが非常に大きいことを考えると、ユニアプリベースでH5にパッケージ化して統合することができます。 webview + jsのネイティブな方法。

  基本構造：ネイティブシェル+ webview [iOS＆Android] + js

• プログラム

  基本的なフレームワークを決定した後の主な問題は、Webとjsの間の相互作用であり、技術的な機能に限定され、iOSの方向性のみです。

  まず第一に、UIWebViewはあまり使用されておらず、すでにiOS14 +です。UIWebViewを使用して破棄しない場合、おそらくチームはそのようになり、対応する対話フレームワークはJavaScriptCoreです。パスは話さない

  第3に、リダイレクトされたURLをインターセプトして解析し、合意されたキー/値を使用して元のメソッドを呼び出すことができます。このインタラクティブなメソッドは単純な機能要件を満たし、状況に応じてWebのみがiOS呼び出しを呼び出すことができます。

  次に、WKWebviewでは、JSはWKScriptMessageHandlerプロトコルを介してネイティブメソッドを呼び出します。コアはwindow.webkit.messageHandlersです。メソッド名.postMessage（パラメーター）、ネイティブ呼び出しJSははるかに単純で、コアは次のとおりです。[weblview EvaluationJavaScript：xxxcompletionHandler ：^（idオブジェクト、NSError * _Nullable error）{}];

  上記のように：非同期操作がある場合はどうなりますか？ブロックが実装されていればもっと良いのではないでしょうか？

  最後に：WebViewJavascriptBridge、さあ、あなたはそれに値する

• 
  1.js呼び出しネイティブメソッドを分析します

  - html中web中按钮点击，
  - bridge调用callHandler， 
  - 调用_doSend()
  - 赋值messagingIframe.src = xxx://__wvjb_queue_message__
  - native的webview执行代理方法decidePolicyForNavigationAction
  - 获取url, native执行WKFlushMessageQueue
  - webview执行evaluateJavaScript， 调用js的_fetchQueue()，把_doSend()调用时写入sendMessageQueue中的值取出来，即获取js传递过来的参数
  - native方法flushMessageQueue，处理js传递过来的参数，封装在block中
  - 注意：js传递过来的参数，有可能还有function回调的存在，function是解决js调用native之后，native的执行结果回调给js，形成一个js->native->js的过程。

  2.ネイティブ呼び出しjsメソッド

  - native中的bridge调用callHandler方法
  - BridgeBase中调用-(void)sendData:(id)data responseCallback:(WVJBResponseCallback)responseCallback handlerName:(NSString*)handlerName
  - BridgeBase中调用_queueMessage
  - 这里有个判断，当startupMessageQueue!=nil时，消息放在数组中，当=nil时，直接调用_dispatchMessage
  - native中startupMessageQueue在执行injectJavascriptFile方法后会被设置为nil
  - injectJavascriptFile追溯可知当decidePolicyForNavigationAction中判断url的host=__bridge_loaded__时调用，
  - 而在js中设置的bridge时设置的WVJBIframe.src = 'https://__bridge_loaded__'， 到此应该不用多问，剖析_dispatchMessage
  - _dispatchMessage中执行_evaluateJavascript， 执行的js中的方法_handleMessageFromObjC(xxx)
  - Bridge_JS中查询_dispatchMessageFromObjC， 接着调用_dispatchMessageFromObjC
  - 此时设置回调A-block， 里面的数据是js中的执行结果，js在开始的时候注册registerHandler,是key/block，此时通过key可以找到对应的B-block，将message传递过来的data跟设置的A-block当做对应的key/block的B-block的参数，直接执行该B-block即可。能够在js的registerHandler中获取到native传递过来的参数，同时也能够通过A-block将js的执行结果回调给native

  3.まとめ

  初始化时给web注入不少料，核心是 1.拦截url， 2.回调实现基于初始化注入字典便于key/value方式管理block 3.evaluateJavaScript执行js

  4.拡張

  如上的做法适合UIWebView&WKWebView。实际上如果只针对WKWebView的话，可在_doSend方法中直接调用window.webkit.messageHandlers.xxx.postMessage(null)，而非设置src的方式。可参照WKWebViewJavascriptBridge

• ゲームオーバー。