理想论坛_专业20年的财经股票炒股论坛交流社区 - 股票论坛

 找回密码
 立即注册
搜索
热搜: 活动 交友 discuz
查看: 2970|回复: 0

vue 项目使用JSbrideg.js与app通信

[复制链接]

9650

主题

9650

帖子

2万

积分

管理员

Rank: 9Rank: 9Rank: 9

积分
28966
发表于 2019-12-27 11:23 | 显示全部楼层 |阅读模式
一、建立JSbrideg.js文件
var jsBridge = {    isAndroid: null,    isIOS: null,    callHandlerFunc: function(json_data){        var that = this;        var res_data = null;        var nv = null;        // alert("callHandlerFunc");        var u = navigator.userAgent;        that.isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端        that.isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
        if(that.isIOS){            // alert("ios");            nv = window.GCWebviewJSBridge;        }else{            nv = window.WebViewJavascriptBridge;        }        nv.callHandler('getOS', json_data, function (response) {            res_data = response;        });        return res_data;    },    initJsBridge: function(readyCallback){        var that = this;        var u = navigator.userAgent;        var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端        var isIOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端        // 注册jsbridge
        function connectWebViewJavascriptBridge(callback) {            if (isAndroid) {                if (window.WebViewJavascriptBridge) {                    callback(WebViewJavascriptBridge)                } else {                    document.addEventListener(                        'WebViewJavascriptBridgeReady'                        , function () {                            callback(WebViewJavascriptBridge)                        },                        false                    );                }                return;            }            if (isIOS) {                // alert("ios2222");                if (window.GCWebviewJSBridge) {                    return callback(GCWebviewJSBridge);                }                if (window.GCWVJSBCallBacks) {                    return window.GCWVJSBCallBacks.push(callback);                }
                window.GCWVJSBCallBacks = [callback];                var GCWVJSBIframe = document.createElement('iframe');                GCWVJSBIframe.style.display = 'none';                GCWVJSBIframe.src = 'gcwvjsbscheme://__GC_BRIDGE_LOADED__';                document.documentElement.appendChild(GCWVJSBIframe);                setTimeout(function() { document.documentElement.removeChild(GCWVJSBIframe)                }, 0);            }        }        // 挪用注册方式        connectWebViewJavascriptBridge(function (bridge) {            if (isAndroid) {                bridge.init(function (message, responseCallback) {                    console.log('JS got a message', message);                    responseCallback(data);                });            }            // 只要在这里注册过的方式,在原声代码里才华用callHandler的方式调?           //jsbridge_getJsMessage 是与app界说的方式,前端界说好参数转达,经过此方式响应回传给前端想要的数据data            bridge.registerHandler('jsbridge_getJsMessage', function (data, responseCallback){                var jsdata = JSON.parse(data);                              responseCallback('native 传过来的是 2:' + data);            });
            readyCallback();        });    }}jsBridge.initJsBridge();
export  default {     //发送数据给原生Native App     callHandler(data) {     let json = data;
    return jsBridge.callHandlerFunc(json);},
}
二、留意:在man.js注册操纵 import bridge  from 'components/JSbridge'Vue.prototype.$bridge = bridge;当需要与app通讯获得用户信息,来在前端做路由权限控制时候,不成以在 router.beforeEach((to, from, next) => {})中挪用,由于此时 页面未加载,window.WebViewJavascriptBridge大要window.GCWebviewJSBridge 都不存在。本人处置赏罚是在 App.vue中      watch:{//监测            '$route'(to,from){                             let app = window.localStorage.getItem('isapp'); //获得能否app进入                let useid = window.localStorage.getItem('user_id'); //获得useid                if(app){                    if(!useid){                        if(to.path == '/' || to.path == '/c' || to.path == '/a' ||  to.path == '/b'){                            return;                        }                 }else{
                                         var json= {"type":101,"videoId":""};                      this.$bridge.callHandler(JSON.stringify(json));向app通讯,会在注册方式中获得用户信息,把用户id(用户信息)记载缓存中
                 }                        }}











免责声明:假如加害了您的权益,请联系站长,我们会实时删除侵权内容,感谢合作!
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

Archiver|手机版|小黑屋|理想论坛_专业20年的财经股票炒股论坛交流社区 - 股票论坛

GMT+8, 2020-7-7 07:01 , Processed in 0.147466 second(s), 28 queries .

Powered by Discuz! X3.2

© 2001-2013 Comsenz Inc.

快速回复 返回顶部 返回列表