Mobile terminal plug-in

  • IOS: github.com/marcuswesti…
  • IOS (new) : github.com/Lision/WKWe…
  • Android: github.com/lzyzsd/JsBr…

H5 call encapsulation

var u = navigator.userAgent;
window.isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > 1; // Android terminal window.isios =!! u.match(/\(i[^;] +; ( U;) ? CPU.+Mac OS X/); // Ios terminal window.jsbridge =function (callback) {
    if (window.WebViewJavascriptBridge) {
        return callback(WebViewJavascriptBridge);
    } else {
        document.addEventListener(
            'WebViewJavascriptBridgeReady'.function () {
                callback(WebViewJavascriptBridge)
            },
            false
        );
    }
    if (window.isIOS) {
        // old ios method
        //setTimeout(function () {
        //    if (window.WVJBCallbacks) {
        //        return window.WVJBCallbacks.push(callback);
        //    }
        //}, 500)
        //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)

        // 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)
    }
}

if(! window.isIOS) { jsbridge(function (bridge) {
        bridge.init(function(message, responseCallback) { var data = {}; responseCallback(data); }); })} /** * @param {option object} * method: called method * data: passed parameters * callback: callback method * @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) } } ); })} / / native tone js window. BridgeRegisterHandler =function (option) {
    // alert(option.method);
    jsbridge(function (bridge) {
        bridge.registerHandler(
            option.method,
            function (data, responseCallback) {
                if(option.callback) { option.callback(data); } responseCallback(option.data || {}); }); * {* method:[String], * data:[Object], * callback:[Function] *} */ window.callnativePage =function (option) {
    bridgeCallHandler({
        method: option.method,
        data: option.data,
        callback: function (responseData) {
            if(option.callback) { option.callback(responseData); }}})}Copy the code

Invoke the sample

  • Js call native
callNativePage({
    data: { msg : 'test send msg' },
    callback:function(responseData){
        console.log('Sourced feedback',responseData)
    }
})
Copy the code
  • Native call JS methods, active registration required
window.bridgeRegisterHandler({
    method:"Method name supplied to native call",
    callback:function(data){// data: data passed natively to the front end}})Copy the code