1.0.2 • Published 2 years ago

jdhybrid_xbridge v1.0.2

Weekly downloads
-
License
MIT
Repository
-
Last release
2 years ago

简体中文文档

XBridge JS

引入

//npm install jdhybrid_xbridge
var XBridge = require("jdhybrid_xbridge")

Use APIs in the XBridge object to communicate with native

Call Native Plugin

JS Call Native Plugin1 (callback only once)

// call function
var callback = function (result) {
	showLog('Received result from MyNativePlugin, result = ' + result)
}
// NativePluginName 
// action type:string
// params type:string,json
XBridge.callNative('NativePlugin', {action: 'MyAction', params: params, success: callback})

JS Call Native Plugin2(Callback Continuouslly)

var successCallback = function (result) {
	showLog('Received success from MySequenceNativePlugin, result = ' + result)
}
var progressCallback = function (result, response) {
	showLog('Received progress from MySequenceNativePlugin, complete = ' + response.complete + ', msg = ' + response.msg + ', result = ' + result)
}

XBridge.callNative({name: 'NativePlugin', params: params, success: successCallback, progress: progressCallback})

JS Call Default Plugin

JS will call a default plugin if no plugin name specify clearly

var callback = function (result, response) {
	showLog('Received result from native, complete = ' + response.complete + ', msg = ' + response.msg + ', result = ' + result)
}
XBridge.callNative({params: params, success: callback})

Register JSPlugin

Callback Only Once

//JsPluginName
//Sync return
XBridge.registerPlugin('JsPluginName', function (params) {
  showLog('MySyncJsPlugin invoked by native, params = ' + JSON.stringify(params))
  return JSON.stringify(result)
})

//Async return
XBridge.registerPlugin('JsPluginName', function (params, callback) {
  showLog('MyAsyncJsPlugin invoked by native, params = ' + JSON.stringify(params))
  callback(JSON.stringify(result))
})

//may fail
XBridge.registerPlugin('JsPluginName', function (params, callback) {
  showLog('MyAsyncJsPlugin invoked by native, params = ' + JSON.stringify(params))
  var isSuccess = true;//false
  callback(JSON.stringify(result), isSuccess)
})

Callback Continuouslly

//JsPluginName
//callback,complete indicates finished or not
XBridge.registerPlugin('JsPluginName', function (params, callback) {
  showLog('MySequenceJsPlugin invoked by native, params = ' + JSON.stringify(params))
  var isSuccess = true;//false
  var time = 0
  var timer = setInterval(function () {
    var complete = false
    time++
    if (time == 10) {
      clearInterval(timer)
      complete = true
    }
    callback((time * 10) + '%, MySequenceJsPlugin returns ' + JSON.stringify(result), isSuccess, complete)
  }, 500)
})

Remove JSPlugin

XBridge.unregisterPlugin('JsPluginName')

Default JSPlugin

JS can register a default plugin that native can call without plugin name

XBridge.registerDefaultPlugin(function (params, callback) {
  showLog('Default JS plugin invoked by native, params = ' + JSON.stringify(params))
  callback('Default JS plugin returns ' + JSON.stringify(params))
})

JS Initial

Native should load xbridge.js for the web. Please use all js functions after XBridge is initialized.

function connectXBridge(callback) {
  if (window.XBridge) {
  	callback(XBridge)
  } else {
  	document.addEventListener(
  		'XBridgeReady',
  		function () {
  			callback(XBridge)
  		},
  		false
  	);
  }
}

//run this function
connectXBridge(function (bridge) {
  showLog('XBridge is ready.')
  //do your work with XBridge
})

WebView Event

We defined webview event mechanism with a friendly way ----- window.addEventListener

XWebView Default Event

  • webView visible
    window.addEventListener('ContainerShow', function(event){
        alert(event);
    }, false);
    window.addEventListener('ContainerHide', function(event){
        alert(event);
    }, false);
  • App enter foreground/background(only iOS)
    window.addEventListener('AppShow', function(event){
        alert(event);
    }, false);
    window.addEventListener('AppHide', function(event){
        alert(event);
    }, false);

Listen Custom Event

window.addEventListener('customEvent', function(event){
	alert(JSON.parse(event.params));
}, false);