js與ios橋接使用WebViewJavascriptBridge簡單理解

蓓蕾心晴發表於2018-04-10
JSiOS橋接WebViewJavaScript

https://github.com/marcuswestin/WebViewJavascriptBridge

function setupWebViewJavascriptBridge(callback) {
    if (window.WebViewJavascriptBridge) { return callback(WebViewJavascriptBridge); }
    if (window.WVJBCallbacks) { return window.WVJBCallbacks.push(callback); }
    window.WVJBCallbacks = [callback];
    var WVJBIframe = document.createElement(`iframe`);
    WVJBIframe.style.display = `none`;
    WVJBIframe.src = `https://__bridge_loaded__`;
    document.documentElement.appendChild(WVJBIframe);
    setTimeout(function() { document.documentElement.removeChild(WVJBIframe) }, 0)
}
Finally, call setupWebViewJavascriptBridge and then use the bridge to register handlers and call ObjC handlers:
setupWebViewJavascriptBridge(function(bridge) {
    
    /* Initialize your app here */

    bridge.registerHandler(`JS Echo`, function(data, responseCallback) {
        console.log("JS Echo called with:", data)
        responseCallback(data)
    })
    bridge.callHandler(`ObjC Echo`, {`key`:`value`}, function responseCallback(responseData) {
        console.log("JS received response:", responseData)
    })
})

 

github地址如上

工作中用到了這個橋接，出現了很多問題，

首先，初始化了這個函式之後，然後呼叫這個函式，呼叫ios端定義的handler或者js 註冊自己的handler，

但是好像不可以寫多個該函式的呼叫，否則所有寫的互動不生效。

那麼我如果想呼叫ios定義的多個函式，只能寫在一個呼叫裡，羅列多個

 bridge.registerHandler 
和
bridge.callHandler來寫了。
目前還是出現了個別互動不生效的問題。

registerHandler 就是在網頁端定義一個函式，獲取後端返回的相應引數，後端呼叫使用
callHandler  就是在ios端定義一個函式，網頁端呼叫，傳過去相應引數。
 

我的部落格即將搬運同步至騰訊雲+社群，邀請大家一同入駐：https://cloud.tencent.com/developer/support-plan?invite_code=dd4qxupt8clk
 

相關文章