android webview三方库,关于WebViewJavascriptBridge消息互通三方库的js封装（干货）

废话很少说，直接上代码javascript

注册与app的桥接java

// 注册事件监听

function connectWebViewJavascriptBridge (callback) {

if (window.WebViewJavascriptBridge) {

callback(window.WebViewJavascriptBridge)

} else {

document.addEventListener('WebViewJavascriptBridgeReady', function () {

callback(window.WebViewJavascriptBridge)

}, false)

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)

}

}

// 注册回调函数，第一次链接时调用 初始化函数

// bridge.init 只有android须要调用初始化，能够使用Object.keys(bridge) 打开查看对象，ios没有init方法

connectWebViewJavascriptBridge(function (bridge) {

try {

bridge.init(function (message, responseCallback) {

console.log('JS got a message', message)

var data = {

'Javascript Responds': 'CMYH!'

}

console.log('JS responding with', data)

responseCallback(data)

})

} catch (e) {

console.log(e)

}

})

方法协定与调用android

myfunction (param) {

// 你的方法调用

if (window.WebViewJavascriptBridge) {

window.WebViewJavascriptBridge.callHandler('该位置为你与ios和android协定的方法名', {'json格式要传的参数'}, function (response) {})

} else {

setTimeout(() => {

this.myfunction(param)

}, 50)

}

}

举例(微信分享)ios

wxshare (shareType = 0, imgData = '') {

// 微信分享

if (window.WebViewJavascriptBridge) {

return new Promise((resolve, reject) => {

window.WebViewJavascriptBridge.registerHandler('wxshareCallbak', function (data, responseCallback) {

// IOS必需去注册(registerHandler)一个方法才能用

resolve(JSON.parse(data).state)

})

window.WebViewJavascriptBridge.callHandler('wxshare', {'shareType': shareType, 'imgData': imgData}, function (responseData) {

// Android直接主动调用该方法，能够主动传值

resolve(JSON.parse(responseData).state)

})

})

} else {

setTimeout(() => {

this.wxshare(shareType, imgData)

}, 50)

}

}demo下载：

点击前往下载