成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

web與APP之間的交互---WebViewJavascriptBridge

3fuyu / 2605人閱讀

摘要：在實(shí)際項(xiàng)目之中，經(jīng)常會(huì)遇到之中嵌入網(wǎng)頁的情況，就需要網(wǎng)頁與原生之間交互，比如獲取當(dāng)前用戶信息等。一種簡單的方式就是通過參數(shù)來搞定，但是這種方式異常死板，所以有了。本文章旨在記錄的實(shí)現(xiàn)，如有錯(cuò)誤，還請(qǐng)指正如有需要了解原理，請(qǐng)。

在實(shí)際項(xiàng)目之中，經(jīng)常會(huì)遇到app之中嵌入網(wǎng)頁的情況（Hybrid），就需要web網(wǎng)頁與原生app之間交互，比如獲取當(dāng)前用戶信息等。一種簡單的方式就是通過url參數(shù)來搞定，但是這種方式異常死板，所以有了jsbridge。
本文章旨在記錄WebViewJavascriptBridge的實(shí)現(xiàn)，如有錯(cuò)誤，還請(qǐng)指正！如有需要了解jsbridge原理，請(qǐng)google。

需求：

/**
 * 函數(shù)描述：js調(diào)用webview事件
 *
 * jsBridge.callHandler(method, data, callBack(response));
 * @param method {string} 方法名
 * @param data {Object} 參數(shù)
 * @return {Object} 回調(diào)
 */

/**
 * 函數(shù)描述：webView調(diào)用JS事件
 *
 * jsBridge.registerHandler(method, callBack(response));
 * @param method {string} 方法名
 * @return {Object} 回調(diào)
 */
const JsBridge = {
    init: function (callback) {
        const u = navigator.userAgent;
        const isiOS = !!u.match(/(i[^;]+;( U;)? CPU.+Mac OS X/); //判斷手機(jī)系統(tǒng)
        if (!isiOS) {  //ios
            if (window.WebViewJavascriptBridge) {
                callback(WebViewJavascriptBridge)
            } else {
                //    注冊(cè)事件，WebViewJavascriptBridge加載完成時(shí)調(diào)用
                document.addEventListener(
                    "WebViewJavascriptBridgeReady",
                    function () {
                        callback(WebViewJavascriptBridge)
                    },
                    false
                );
            }
        } else { //Android
            //    如果有WebViewJavascriptBridge，則直接返回callback
            if (window.WebViewJavascriptBridge) {
                return callback(WebViewJavascriptBridge);
            }
            //    如果有WVJBCallbacks，則向WVJBCallbacks中注入事件
            if (window.WVJBCallbacks) {
                return window.WVJBCallbacks.push(callback);
            }
            //    否則創(chuàng)建WVJBCallbacks
            window.WVJBCallbacks = [callback];
            const WVJBIframe = document.createElement("iframe");
            WVJBIframe.style.display = "none";
            WVJBIframe.src = "wvjbscheme://__BRIDGE_LOADED__";
            document.documentElement.appendChild(WVJBIframe);
            setTimeout(function () {
                document.documentElement.removeChild(WVJBIframe)
            }, 0)
        }
    },

    first: function () {
        const u = navigator.userAgent;
        const isiOS = !!u.match(/(i[^;]+;( U;)? CPU.+Mac OS X/);
        if (!isiOS) {
            const _this = this;
            _this.init(function (bridge) {
                bridge.init(function (message, responseCallback) {
                    responseCallback(data);
                })
            })
        }
    },

    registerHandler: function (name, fun) {
        const _this = this;
        _this.init(function (bridge) {
            bridge.registerHandler(name, fun);
        })
    },

    callHandler: function (name, data, fun) {
        const _this = this;
        _this.init(function (bridge) {
            bridge.callHandler(name, data, fun);
        })
    }
}

// 初始化
JsBridge.first();

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/108827.html

相關(guān)文章

  • web與APP之間的交互---WebViewJavascriptBridge

    摘要：在實(shí)際項(xiàng)目之中，經(jīng)常會(huì)遇到之中嵌入網(wǎng)頁的情況，就需要網(wǎng)頁與原生之間交互，比如獲取當(dāng)前用戶信息等。一種簡單的方式就是通過參數(shù)來搞定，但是這種方式異常死板，所以有了。本文章旨在記錄的實(shí)現(xiàn)，如有錯(cuò)誤，還請(qǐng)指正如有需要了解原理，請(qǐng)。 在實(shí)際項(xiàng)目之中，經(jīng)常會(huì)遇到app之中嵌入網(wǎng)頁的情況（Hybrid），就需要web網(wǎng)頁與原生app之間交互，比如獲取當(dāng)前用戶信息等。一種簡單的方式就是通過url參數(shù)...

    mingzhong 評(píng)論0 收藏0

  • WebViewJavascriptBridge原理解析

    摘要：否則按照正常流程處理。如果是表示是初始化環(huán)境的消息，如果是則表示是發(fā)送消息。則立即發(fā)送消息?；卣{(diào)主動(dòng)調(diào)用獲取注冊(cè)的函數(shù)調(diào)用中的對(duì)應(yīng)函數(shù)處理把消息從發(fā)送到，執(zhí)行具體的發(fā)送操作。處理從返回的消息。從而找到具體的實(shí)現(xiàn)執(zhí)行。 基本說明 我們的項(xiàng)目是一個(gè)OC與javascript重度交互的app，OC與javascript交互的那部分是在WebViewJavascriptBridge的githu...

    yck 評(píng)論0 收藏0

  • WebViewJavascriptBridge原理解析

    摘要：否則按照正常流程處理。如果是表示是初始化環(huán)境的消息，如果是則表示是發(fā)送消息。則立即發(fā)送消息?；卣{(diào)主動(dòng)調(diào)用獲取注冊(cè)的函數(shù)調(diào)用中的對(duì)應(yīng)函數(shù)處理把消息從發(fā)送到，執(zhí)行具體的發(fā)送操作。處理從返回的消息。從而找到具體的實(shí)現(xiàn)執(zhí)行。 基本說明 我們的項(xiàng)目是一個(gè)OC與javascript重度交互的app，OC與javascript交互的那部分是在WebViewJavascriptBridge的githu...

    andot 評(píng)論0 收藏0

  • WebViewJavascriptBridge原理解析

    摘要：否則按照正常流程處理。如果是表示是初始化環(huán)境的消息，如果是則表示是發(fā)送消息。則立即發(fā)送消息?；卣{(diào)主動(dòng)調(diào)用獲取注冊(cè)的函數(shù)調(diào)用中的對(duì)應(yīng)函數(shù)處理把消息從發(fā)送到，執(zhí)行具體的發(fā)送操作。處理從返回的消息。從而找到具體的實(shí)現(xiàn)執(zhí)行。 基本說明 我們的項(xiàng)目是一個(gè)OC與javascript重度交互的app，OC與javascript交互的那部分是在WebViewJavascriptBridge的githu...

    syoya 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<