前端开发项目中经常会遇到js代码调用客户端的方法，js如何与原生客户端的方法进行相互调用呢？
实现的原理很简单，就是借助客户端webview的WebViewJavascriptBridge对象的callHandler方法和registerHandler方法进行数据传输，其中callHander用于js调用客户端的方法，registerHandler用于调用客户端调用js的方法，具体实现方法如下:
function setupWebViewJavascriptBridge(callback) { //定义一个setupWebViewJavascriptBridge函数
if (window.WebViewJavascriptBridge) {
callback(WebViewJavascriptBridge) // 向参数中传递WebViewJavascriptBridge全局对象
} else {
if (window.WVJBCallbacks) {
return window.WVJBCallbacks.push(callback);
}
window.WVJBCallbacks = [ callback ];
var WVJBIframe = document.createElement('iframe');
WVJBIframe.style.display = 'none';
WVJBIframe.src = 'weizhujsb://__BRIDGE_LOADED__';
document.documentElement.appendChild(WVJBIframe);
setTimeout(function() {
document.documentElement.removeChild(WVJBIframe)
}, 0)
}
}
setupWebViewJavascriptBridge(function(bridge) { // 调用setupWebViewJavascriptBridge函数，参数接受WebViewJavascriptBridge全局对象
function openUserProfile(userId) {
bridge.callHandler('onPageSkip', { //调用bridge的属性属性方法
'pageName' : 'profile',
'data' : {
'userId' : userId
}
}, function(response) {
});
}
