步骤1. cdn地址引入jsbridge,可复制保存到本地相对地址引入
<script type="text/javascript" charset="utf-8" src="https://qzonestyle.gtimg.cn/qzone/phone/m/v4/widget/mobile/jsbridge.js"></script>
步骤2. mounted生命周期复制去初始化jsbridge
mounted() {
if (/iphone/i.test(navigator.userAgent)) {
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)
}
setupWebViewJavascriptBridge(function (bridge) {
bridge.registerHandler('userInfoCallback',function(data, responseCallback){
responseCallback({})
})
bridge.registerHandler('getLoginStatus',function(data, responseCallback){
document.getElementById('test').innerHTML += '99'
responseCallback({})
})
})
}else{
function connectWebViewJavascriptBridge(callback) {
if (window.WebViewJavascriptBridge) {
callback(WebViewJavascriptBridge)
} else {
document.addEventListener(
'WebViewJavascriptBridgeReady'
, function () {
callback(WebViewJavascriptBridge)
},
false
);
}
}
connectWebViewJavascriptBridge(function (bridge) {
//注册一个登录成功方法(方法名是“successLogin”),客户端进行调用(方法名也是“successLogin”),responseCallback是回调函数
bridge.registerHandler('getLoginStatus', function (data, responseCallback) {
document.getElementById('test').innerHTML += data+responseCallback + '111'
})
})
}
},
步骤3:前端h5 传递方法给安卓和ios,回调函数接收返回的参数
clickbox_bd() {
// document.getElementById('test').innerHTML+='usera:'+navigator.userAgent
// document.getElementById('test').innerHTML+=this.memberId+'this.memberId安卓有吗'
var appLink = '?type=app&target='
if (this.isAndroid) {
setTimeout(() => {
window.WebViewJavascriptBridge.init()
window.WebViewJavascriptBridge.callHandler('getLoginStatus',{},function(responseData) {
document.getElementById('test').innerHTML+=responseData
if (JSON.parse(responseData).userId=='0'||JSON.parse(responseData).userId == '') {
appLink = 'yiqibaziapp://' + '?type=app&target=' + 'MemberLogin'
var ver = navigator.userAgent.toLowerCase().match(/cpu iphone os (.*?) like mac os/)
if (ver && parseInt(ver[1]) >= 9) return window.location.href = appLink
var iframe = document.createElement('iframe')
iframe.src = appLink
iframe.style.display = 'none'
document.body.appendChild(iframe)
setTimeout(function () {
document.body.removeChild(iframe)
}, 2000)
}
}
);
}, 200)
} else {
window.WebViewJavascriptBridge.callHandler('getUserInfo',{},function(responseData){
if(JSON.parse(responseData).userId==0||JSON.parse(responseData).userId==''){
appLink = 'yiqiApp://' + '?type=app&target=' + 'MemberLogin'
var ver = navigator.userAgent.toLowerCase().match(/cpu iphone os (.*?) like mac os/)
if (ver && parseInt(ver[1]) >= 9) return window.location.href = appLink
var iframe = document.createElement('iframe')
iframe.src = appLink
iframe.style.display = 'none'
document.body.appendChild(iframe)
setTimeout(function () {
document.body.removeChild(iframe)
}, 2000)
}
// document.getElementById('test').innerHTML+='222'+responseData.userId
})
}
},