Skip to content

Latest commit

 

History

History
153 lines (114 loc) · 3.61 KB

README.md

File metadata and controls

153 lines (114 loc) · 3.61 KB

JSBridge

基于 Hybrid App 架构的 JSBridge Javscirpt 端实现

框架底层通信原理可以参考这篇文章

Feature

  • 支持 Promise
  • 支持区分 App Platform & Version
  • 极易扩展的 bridge api
  • 接口分类参考 html5+ 标准

Usage

首先需要与 Native 端约定好每个接口支持的 APP 平台、版本号和对应的接口 id,然后在 bridge/api 中配置对应的接口定义。

下面是实现接口的一些例子:

Module Name ID Params Description Support
share sendWithSystem 1001 | 1002 | 1003 [{Object msg, Function successCB, Function errorCB}] 使用系统组件发送分享 MyAApp | MyBApp | MyCApp
nativeUI alert 2001 [{String title, String message, Function alertCB}] 弹出系统提示对话框 MyAApp
event listen 3001 [{String event, Function onCallback}] 添加App监听事件 MyCApp2.0
event register - [String event, Function callback] 注册供App调用的函数 MyCApp2.0
storage setItem 4001 [{String name, String value}] 修改或添加键值(key-value)对数据到应用数据存储中 MyCApp
storage getItem 4002 [{String name, String value}] 通过键(key)检索获取应用存储的值 MyCApp
webview open 5001 [{String url}] 新建webview打开指定url --
webview close 5002 - 关闭当前webview --

share.sendWithSystem(msg, successCB, errorCB);

弹出系统提示对话框

params

{
  msg: {
    String type;
    String content;
    String[] thumbs;
    String[] pictures;
    String media;
    String href;
    String title;
    JSON extra;
    GEOPosition geo;
    ShareMessageExtra extra;
    WeixinMiniProgramOptions miniProgram;
    String interface;
  }, // 分享消息对象
  successCB: '', // 调用系统分享操作成功时的回调函数,用于返回操作成功信息。 但此回调并不表示分享消息已经发送成功
  errorCB: '', // 分享操作失败回调
}

Example:

import jsbridge from 'jsbridge';

jsbridge.share.sendWithSystem({
  msg: {
    type: 'frends',
    content:'分享内容',
    href:'http://m.baidu.com/'
  },
  successCB () => {},
  alertCB: () => {}
})

nativeUI.alert(options)

弹出系统提示对话框

params

{
  title: '', // 示对话框上显示的标题
  message: '', // 提示对话框上显示的内容
  alertCB: '', // 提示对话框上关闭后的回调函数
}

Example:

import jsbridge from 'jsbridge';

jsbridge.nativeUI.alert({
  title: '提示',
  message: '保存成功',
  alertCB: () => {
    // TODO: 确定按钮回调
  }
}).then(() => {
  // 设置UI成功后逻辑处理
})

event.listen(options)

添加App监听事件

params

{
  event: '', // 订阅事件名称
  onCallback: '', // 事件回调
}

Example:

import jsbridge from 'jsbridge';

jsbridge.event.listen({
  event: 'resume',
  onCallback: () = {
    // 重新激活webview回调
  }
}).then(() => {
  // 订阅成功
})

webview.open(options)

新建webview打开指定url

Example:

import jsbridge from 'jsbridge';

jsbridge.webview.open({url: 'https://m.baidu.com'})

webview.close()

关闭当前webview

Example:

import jsbridge from 'jsbridge';

jsbridge.webview.close()