0.0.28 • Published 1 year ago

nv-jsbridge v0.0.28

Weekly downloads
-
License
MIT
Repository
gitlab
Last release
1 year ago

za-jsbridge

承接众安 JSBridge 接口,用于统一多平台下调用原生 App 的 api 方法。

支持的平台有:

  • 普通浏览器(仅支持 go,goBack,setTitle)
  • 微信客户端(同普通浏览器)
  • 微信小程序(仅支持 navigateTo,小程序内嵌的 h5 跳转到小程序页面,其余同普通浏览器)
  • 直营 App(除 setBackButton 外全支持)
  • 最福利 App(全支持)
  • i 云保 App(全支持)

安装和引入

  • commonJS 方式
    npm install za-jsbridge;
    import JSBridge from 'za-jsbridge';

  • 外链方式(umd)
    <script type="text/javascript" src="dist/za-jsbridge.js"></script>

开启 debug 模式

JSBridge.debug = true;

获取当前 JSBridge 环境

console.log(JSBridge.env);
参数类型默认值可选值功能说明
envStringnode:nodejs 渲染wechat:微信客户端miniprogram: 微信小程序za:直营 Appiyunbao:i 云保 Appifuli:最福利 Appbrowser:普通浏览器

获取系统信息

JSBridge.getSystemInfo(callback);
参数类型默认值可选值功能说明
callbackFunctionfunction(res, success) {}res: { appName:'品牌', appVersion:'版本', appPlatform:'平台' } success:是否成功回调方法

设置前端路由

import { browserHistory } from 'react-router';

JSBridge.router = browserHistory;

使用以下方法时请用ready方法包裹,以确保当前 APP 内部的桥接 js 在 jsbridge 代码运行前加载完成。例:

JSBridge.ready(function () {
  JSBridge.setTitle('标题');
});

跳转到指定页面

JSBridge.go('/xxx/xxx.html');
JSBridge.go('https://www.zhongan.com');
参数类型默认值可选值功能说明
urlString要跳转的链接地址,可以是前端路由,也可以是完整 url

返回页面

JSBridge.goBack();

返回登录页面

JSBridge.goLogin();

跳转到小程序页面

JSBridge.navigateTo('/xxx/xxx');
参数类型默认值可选值功能说明
urlString要跳转的小程序页面地址

设置页面 title

JSBridge.setTitle('标题');
参数类型默认值可选值功能说明
titleString标题

设置左、右上角按钮

// 设置左上角按钮
JSBridge.setBackButton(
  {
    title: '返回',
  },
  callback
);

// 设置右上角按钮
JSBridge.setRightButton(
  {
    imageUrl:
      'https://ss0.bdstatic.com/5aV1bjqh_Q23odCf/static/superman/img/logo/bd_logo1_31bdc765.png',
  },
  callback
);
参数类型默认值可选值功能说明
titleString分享按钮名称
imageUrlString图片按钮 url 地址
callbackFunctionfunction(res, success) {}res:返回值 success:是否成功按钮触发事件

执行分享功能

JSBridge.share(
  {
    platform: ['wechat', 'wechat-timeline'],
    title: '分享标题',
    desc: '分享摘要',
    imageUrl:
      'https://ss0.bdstatic.com/5aV1bjqh_Q23odCf/static/superman/img/logo/bd_logo1_31bdc765.png',
    link: 'https://www.zhongan.com',
  },
  callback
);
参数类型默认值可选值功能说明
platformArray全部'wechat', 'wechat-timeline', 'qq', 'qzone', 'zuifuli'wechat:微信wechat-timeline:朋友圈 qq:手机 QQ qzone:QQ 空间 zuifuli:最福利(仅最福利 app 中支持)分享可选平台
titleString分享标题
descString分享摘要
imageUrlString分享图片
linkString分享链接
directBooleanfalsetrue:直接分享fase:用户触发分享是否直接分享
callbackFunctionfunction(res, success) {}res:返回值 success:是否成功回调方法

二维码

// 二维码识别(用于长按二维码)
JSBridge.scanQRCode(
  {
    url: 'https://www.zhongan.com',
  },
  callback
);

// 二维码扫描
JSBridge.scanQRCode(
  {
    direct: false,
  },
  callback
);

// 条形码扫描
JSBridge.scanQRCode(
  {
    direct: true,
  },
  callback
);
参数类型默认值可选值功能说明
urlString二维码地址
directBooleanfalsetrue:扫完直接返回fase:用户触发返回扫码后是否立即返回
callbackFunctionfunction(res, success) {}res:返回值 success:是否成功回调方法

设置顶部导航栏样式

JSBridge.setNavigationStyle(
  {
    fontColor: '#ffffff',
    backgroundColor: '#000000',
  },
  callback
);
参数类型默认值可选值功能说明
fontColorString字体颜色
backgroundColorString背景颜色
navigationBarHiddenBooleanfalse是否隐藏导航栏(仅最福利 App 支持)
statusBarModeNumber00:白底黑字1:黑底白字状态栏模式(仅最福利 App 支持)

重置设置(直营 App 专用)

JSBridge.resetConfig();

打印小票(最福利 App 专用)

JSBridge.print(obj, callback);
0.0.28

1 year ago

0.0.23

1 year ago