赞
踩
- var u = navigator.userAgent;
- window.isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端
- window.isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
-
- window.jsbridge = function (callback) {
-
- if(window.isAndroid){
- if (window.WebViewJavascriptBridge) {
- return callback(WebViewJavascriptBridge);
- } else {
- document.addEventListener(
- 'WebViewJavascriptBridgeReady',
- function () {
- callback(WebViewJavascriptBridge)
- },
- false
- );
- }
- }
-
-
-
-
- if (window.isIOS) {
- // new ios method
- // if (window.WKWebViewJavascriptBridge) { return callback(WKWebViewJavascriptBridge); }
- // if (window.WKWVJBCallbacks) { return window.WKWVJBCallbacks.push(callback); }
- // window.WKWVJBCallbacks = [callback];
- // window.webkit.messageHandlers.iOS_Native_InjectJavascript.postMessage(null)
-
- setupWebViewJavascriptBridge(callback);
- }
-
- }
-
- //初始化 这段代码的意思就是执行加载WebViewJavascriptBridge_JS.js中代码的作用
- function setupWebViewJavascriptBridge(callback) {
-
- console.log("setupWebViewJavascriptBridge");
- if (window.WebViewJavascriptBridge) { return callback(WebViewJavascriptBridge); }
- console.log("WebViewJavascriptBridge complte");
- if (window.WVJBCallbacks) { return window.WVJBCallbacks.push(callback); }
- console.log("WVJBCallbacks complte");
- window.WVJBCallbacks = [callback];
- var WVJBIframe = document.createElement('iframe');
- WVJBIframe.style.display = 'none';
- WVJBIframe.src = 'wvjbscheme://__BRIDGE_LOADED__';
- document.documentElement.appendChild(WVJBIframe);
- setTimeout(function() { document.documentElement.removeChild(WVJBIframe) }, 0)
- }
-
-
- if (!window.isIOS) {
- jsbridge(function (bridge) {
- bridge.init(function (message, responseCallback) {
- var data = {};
- responseCallback(data);
- });
- })
- }
-
- /**
- * @param {option对象}
- * method: 调用的方法
- * data: 传递的参数
- * callback: 回掉方法
- * @return {[type]}
- */
- function bridgeCallHandler(option) {
- // alert(option.method)
- jsbridge(function (bridge) {
- bridge.callHandler(
- option.method,
- option.data || {},
- function (responseData) {
- if (option.callback) {
- option.callback(responseData)
- }
- }
- );
- })
- }
-
- //原生调js
- let registerHandler = function (method, callback) {
- // alert(option.method);
- jsbridge(function (bridge) {
- bridge.registerHandler(
- method,
- function (data, responseCallback) {
- if (callback) {
- callback(data);
- }
- responseCallback(data || {});
- }
- );
- })
- }
-
- /**
- * 传入的option对象格式
- * {
- * method:[String],
- * data:[Object],
- * callback:[Function]
- * }
- */
-
- // js调用原生
-
- let callHandler = function (method, data, callback) {
- bridgeCallHandler({
- method,
- data,
- callback: function (responseData) {
- if (callback) {
- callback(responseData);
- }
- }
- })
- }
-
-
- export default{
- registerHandler,
- callHandler
- }
-
-
-
-
-
-
-
-
-
-
-
- //在main.js中引入
- import jsBridge from "@/utils/jsBridge"
- Vue.prototype.$jsBridge=jsBridge
-
-
-
-
- //在页面中使用
-
- mounted(){
- //监听app触发signatureSuccess,进行监听接收数据
- this.$jsBridge.registerHandler("signatureSuccess", (data)=>{
- console.log("监听获得的数据", data)
- })
- }
-
-
-
-
-
- methods:{
- signature(){
- // showCaBoard: js与原生约定的方法, params: js传递给原生的参数,
- this.$jsBridge.callHandler("showCaBoard", params, (data)=>{
- console.log(data)
- })
- }
-
-
- }
Copyright © 2003-2013 www.wpsshop.cn 版权所有,并保留所有权利。