天天看點

iOS JSBridge實作

iOS JSBridge實作

iOS-Tech https://github.com/sugc/iOS-Tech

jsbridge是實作JS和Navite應用互動的一種方式,分為JS調Native和Native調JS.這邊以WKWebView為例講一下JSBridge的實作。​​

​​

demo位址 https://github.com/sugc/iOS-JSBridge

Native調JS的方式比較簡單, 通過以下方法可以直接執行一段JS腳本,并擷取傳回值

JS調Native本質都是Native通過攔截H5的回調,解析之後根據參數執行native代碼,再回調結果到JS. 目前所了解到的正常主要有以下兩種方式。

目前主流應該是使用第一種方式,第二種方式實際是系統定義好的調用Native輸入框的API,這種使用方式不太符合規範,但好處是可以直接将參數轉成string直接傳回。而第一種方式需要定義回調JS用來傳回Native的執行結果。

這邊通過攔截跳轉Url的方式來設計一個JSBridge實作JS調Native, 主要包含以下幾塊

協定定義

JS調Native方法

Native解析執行子產品

Native回調JS方法

攔截scheme, 如JSBridge, 隻要不和常見的scheme沖突即可  參數定義: 包含以下幾部分部分,參數包成字典,以JSONString的形式拼在url參數中  Native方法名 JS調Native參數 Native如何回調JS的參數  示例:(未編碼) JSBridge://methodName?params={nativeParam={},callback='xxx'}

Native回調JS的關鍵在于,如何去儲存和尋找每次JS調用的回調方法。可以通過JS側用一個字典儲存這些回調,然後将key傳給Native, Native執行完畢之後,再将傳回值和key一起回調到JS。