承接众安 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>
JSBridge.debug = true;console.log(JSBridge.env);| 参数 | 类型 | 默认值 | 可选值 | 功能说明 |
|---|---|---|---|---|
| env | String | node：nodejs 渲染 wechat：微信客户端 miniprogram: 微信小程序 za：直营 App iyunbao：i 云保 App ifuli：最福利 App browser：普通浏览器 |
JSBridge.getSystemInfo(callback);| 参数 | 类型 | 默认值 | 可选值 | 功能说明 |
|---|---|---|---|---|
| callback | Function | function(res, success) {} | res: { appName：'品牌', appVersion：'版本', appPlatform：'平台' } success：是否成功 |
回调方法 |
import { browserHistory } from 'react-router';
JSBridge.router = browserHistory;JSBridge.ready(function () {
JSBridge.setTitle('标题');
});JSBridge.go('/xxx/xxx.html');
JSBridge.go('https://www.zhongan.com');| 参数 | 类型 | 默认值 | 可选值 | 功能说明 |
|---|---|---|---|---|
| url | String | 要跳转的链接地址，可以是前端路由，也可以是完整 url |
JSBridge.goBack();JSBridge.goLogin();JSBridge.navigateTo('/xxx/xxx');| 参数 | 类型 | 默认值 | 可选值 | 功能说明 |
|---|---|---|---|---|
| url | String | 要跳转的小程序页面地址 |
JSBridge.setTitle('标题');| 参数 | 类型 | 默认值 | 可选值 | 功能说明 |
|---|---|---|---|---|
| title | String | 标题 |
// 设置左上角按钮
JSBridge.setBackButton(
{
title: '返回',
},
callback
);
// 设置右上角按钮
JSBridge.setRightButton(
{
imageUrl:
'https://ss0.bdstatic.com/5aV1bjqh_Q23odCf/static/superman/img/logo/bd_logo1_31bdc765.png',
},
callback
);| 参数 | 类型 | 默认值 | 可选值 | 功能说明 |
|---|---|---|---|---|
| title | String | 分享按钮名称 | ||
| imageUrl | String | 图片按钮 url 地址 | ||
| callback | Function | function(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
);| 参数 | 类型 | 默认值 | 可选值 | 功能说明 |
|---|---|---|---|---|
| platform | Array | 全部 | ['wechat', 'wechat-timeline', 'qq', 'qzone', 'zuifuli'] wechat：微信 wechat-timeline：朋友圈 qq：手机 QQ qzone：QQ 空间 zuifuli：最福利（仅最福利 app 中支持） |
分享可选平台 |
| title | String | 分享标题 | ||
| desc | String | 分享摘要 | ||
| imageUrl | String | 分享图片 | ||
| link | String | 分享链接 | ||
| direct | Boolean | false | true：直接分享 fase：用户触发分享 |
是否直接分享 |
| callback | Function | function(res, success) {} | res：返回值 success：是否成功 |
回调方法 |
// 二维码识别（用于长按二维码）
JSBridge.scanQRCode(
{
url: 'https://www.zhongan.com',
},
callback
);
// 二维码扫描
JSBridge.scanQRCode(
{
direct: false,
},
callback
);
// 条形码扫描
JSBridge.scanQRCode(
{
direct: true,
},
callback
);| 参数 | 类型 | 默认值 | 可选值 | 功能说明 |
|---|---|---|---|---|
| url | String | 二维码地址 | ||
| direct | Boolean | false | true：扫完直接返回 fase：用户触发返回 |
扫码后是否立即返回 |
| callback | Function | function(res, success) {} | res：返回值 success：是否成功 |
回调方法 |
JSBridge.setNavigationStyle(
{
fontColor: '#ffffff',
backgroundColor: '#000000',
},
callback
);| 参数 | 类型 | 默认值 | 可选值 | 功能说明 |
|---|---|---|---|---|
| fontColor | String | 字体颜色 | ||
| backgroundColor | String | 背景颜色 | ||
| navigationBarHidden | Boolean | false | 是否隐藏导航栏（仅最福利 App 支持） | |
| statusBarMode | Number | 0 | 0：白底黑字 1：黑底白字 |
状态栏模式（仅最福利 App 支持） |
JSBridge.resetConfig();JSBridge.print(obj, callback);