npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

@cloudbae-frontend/hybrid-bridge

v2.0.0-alpha.14

Published

Downloads

116

Readme

hybrid-bridge Javascript 文档

引入类库

通过 npm 安装。

npm install @cloudbae-frontend/hybrid-bridge

通过 script 标签引入

<script src="https://file.cloudbae.cn:39400/api/v1/file/hybrid/hybrid-bridge-2.0.0-alpha.12.js"></script>
<script>
// 注意: 如果通过 script 标签引入,则需要在调用时,加上 cloudbae 的命名空间,示例如下:
cloudbae.hybridBridge.device.getLocation().then(function(result) {
  console.log(result);
});
</script>

动态注册方法

// 调用原生方法
hybridBridge.apiRegister.callHandler('methodName', {paramKey: 'paramValue'}).then(function(result) {
  console.log(result);
});
// 注册方法给原生调用
hybridBridge.apiRegister.registerHandler('methodName', function(data, nativeCallback) {
  console.log(data);
  nativeCallback();
});
// 监听原生事件
hybridBridge.apiRegister.listen('methodName', {paramKey: 'paramValue'}, function() {
  console.log('事件触发了')
})
// 示例
import { hybridBridge } from '@cloudbae-frontend/hybrid-bridge';

hybridBridge.location.get().then(result => {
    console.log(result);
})

方法

Device

获取用户定位

hybridBridge.device.getLocation().then(function(location) {
  console.log(location);
  // location = {
  //   /** 经度 */
  //   longitude: string;
  //   /** 纬度 */
  //   latitude: string;
  //   /** 详细地址 */
  //   detailAddress: string;
  //   /** 城市 */
  //   cityName: string;
  //   /** 区域名称 */
  //   region: string;
  // }
})

通过相册或拍照获取图片

var params = {
  max: 10,
  sourceType: ['拍照', '相册']
};
hybridBridge.device.chooseImage(params).then(function(imgList) {
  // imgList = [{
  //   fileName: string,
  //   fileUrl: string
  // }]
})

截图

hybridBridge.device.capture().then(function() {
  console.log('截图成功')
})

扫描二维码

hybridBridge.device.scan('qrCode').then(function(result) {
  console.log(result.text);
})

保存图片到本地

const params = {
  encode: 'url',
  data: 'http://www.example.com/test.jpg'
};
// const params = {
//   encode: 'base64',
//   data: 'base64:img/jpg;XXXXXXXXXXX...'
// };
hybridBridge.device.savePicture(params).then(function() {
  console.log('保存成功');
}).catch(function(error) {
  // error.message 如下:
  // 保存成功 | 保存失败 | 图片转换失败 | 下载图片失败 | 无相册权限保存失败;
  console.log(error.message);
})

获取 APP 版本号

hybridBridge.device.getAppVersion().then(function(version) {
  console.log(version)
})

在浏览器打开 url

hybridBridge.device.openUrlInBrowser('http://www.example.com');

获取系统信息

hybridBridge.device.getSystemInfo().then(function(systemInfo) {
  /**
   systemInfo = {
    brand: string; // 手机品牌
    model: string; // 设备型号,设备内部代码
    extraModel: string; // 设备机型,iphone新机型刚推出一段时间会显示unknown(安卓统一输出unknown),app会尽快进行适配
    system: string; // 系统平台、版本,中划线分割
  }
  */
 console.log(systemInfo)
});

获取网络类型

hybridBridge.device.getNetworkType().then(function(result) {
  /**
   result = wifi/2g|3g|4g|5g|unknown|none;
  */
 console.log(result)
});

User

用户信息授权

var clientID = '*********';
hybridBridge.user.authorization(clientID).then(function(result) {
  // result = {
  //   state: string,
  //   code: string
  // }
})

Util

分享

var params = {
  // title: string;
  // content: string;
  // imageUrl: string;
  // targetUrl: string;
  // description?: string;
  // type?: 'image' | 'text' | 'imageAndText' | 'webpage' | 'music';
};
hybridBridge.util.share(params).then(function() {
  console.log('分享成功')
})

数据采集

var data = {}; // 内部约定格式
hybridBridge.util.dataCollection(data).then(function() {
  console.log('提交成功')
})

混合开发 API 老方法

以下方法,可能在将来被淘汰,请谨慎使用

Device

获取设备UUID

hybridBridge.device.getUUID().then(function(info) {
   console.log(info.uuid); 
});

通过拍照或相册上传一张图片


var params = {
    cancelButton: '取消',
    otherButtons: ['拍照', '相册']
};

hybridBridge.device.chooseImg(params).then(function(info) {
    // info = {result: boolean, picPath: string}
    // info.picPath 为网络地址
    console.log(info.picPath);
});

通过相册或拍照获取图片

var min = 1;
var max = 10;
var options = {
  url: 'http://www.example.com/upload-api',
  filename: 'xxx', // 必填 图片内容key 一般是file 
  method: 'post';
  // headers?: { [key: string]: string };
  // params?: { [key: string]: any };
  // body?: any;
}
hybridBridge.device.uploadImages(min, max, options).then(function(result) {
  console.log(result);
})

获取手环数据

hybridBridge.device.fetchWearableDeviceData().then(function(result) {
  /*
    result = {
      deviceInfo: {firmwareVersion: string};
      stepArray: [{steps: number
                     distance: number;
                     calories: number;
                     timestamp: number;}];
      sleepArray: [{
                     score: any;
                     timestamp: string;
                   }];
      hrArray: [{
                  pulse: number;
                  timestamp: number;
                }];
      spO2Array: [{
                    spo2: number;
                    timestamp: number;
                  }];
    }
   */
  console.log(result);
})

绑定手环

hybridBridge.device.bindingWearableDevice();

解绑手环

hybridBridge.device.unbindingWearableDevice();

Location

获取当前定位信息

hybridBridge.location.get().then(function(location) {
    /**
    * location = {
    *   longitude: string; // 经度
    *   latitude: string; // 纬度
    *   detailAddress: string; // 详细地址
    *   cityName: string; // 城市
    *   region: string; // 区域名称
    * }
    */
    console.log(location);
});

Navigation

关闭 webview

hybridBridge.navigation.close();

隐藏导航条

hybridBridge.navigation.hide();

显示导航条

hybridBridge.navigation.show();

设置右侧按扭

var isShow = true; // 是否显示
var options = {
    text: 'string', // 按扭文字
    icon: 'string' // 可选的,icon 图片url
};
hybridBridge.navigation.setRightBtn(isShow, options).click(function() {
   console.log('按扭被点击了'); 
});

设置 webview 标题

hybridBridge.navigation.setTitle({title: 'string'})

设置分段控制器

var titles = ['标题1', '标题2'];
hybridBridge.navigation.setSegments(titles).click(function(index) {
    console.log('第' + index + '个标题被点击了');
});

User

用户认证(以APPID为纬度)

var appId = 'appId';
hybridBridge.user.certification(appId).then(function(data) {
    /**
    * data = {
    *   certSuccess: string;  // '0' 失败, '1' 成功,'2'审核中
    *   username: string; // 用户名
    *   idCardNo: string; // 身份证号码
    *   mobile: string; // 手机号码
    * }
    */
    console.log(data); 
});

用户认证(以当前APP账户为纬度)

var params = {
   liveAgain: false, // boolean 默认为false,若当前用户已实人,立即返回,不会再次活体检测,否则直接进行活体检测, 有值且为ture 时,每次都需经过活体检测(该参数仅支持爱梧州)
   certType: '' // string 刷脸方式:certType='' 展示所有活体渠道, certType='zhima' 代表芝麻认证, certType='ps' 代表公安, certType='ss' 代表社保 , certType='ca' 代表ca活体 (爱梧州目前只接CA活体)
 };
hybridBridge.user.identification(params).then(function(data) {
    /**
    * data = {
    *   certSuccess: string;  // '0' 失败, '1' 成功,'2'审核中
    * }
    */
    console.log(data); 
});

用户授权


var targetUrl = 'http://user.test.com';
hybridBridge.user.oldAuthorization(targetUrl).then(function(data) {
    /**
    * data = {
    *   state: string;
    *   code: string;
    * }
    */
    console.log(data);
});

实名校验(仅限爱广西和爱玉林)


var againCheck = false; // false表示当前用户如果已实名则直接通过,否则会进行校验一次,true每次调用都会进行校验
hybridBridge.user.realNameValidate(againCheck).then(function(result) {
    /**
    * result = boolean;
    * }
    */
    console.log(data);
});

用户登录

//  params 可选
var params = {
    returnUrl: 'xxx' // 登录成功后重定向url
};
hybridBridge.user.login(params).then(function(result) {
    if (result.isLogin) {
        console.log('登录成功');
    }
});

眼纹识别

// params 是可选的
var params = {
    certType: '',  // 刷脸方式 取值:字段不传默认为 - 三版, zhima- 芝麻认证, ps - 公安, ss - 社保
    certName: '',   // 刷脸人姓名
    mobile: '',     // 手机号(暂只有公安刷脸需要)
    certNo: ''     // 刷脸人身份证
};
hybridBridge.user.eyePatternRecognition(params).then(function(result) {
    // result = { code: number, key?: any }
    // code = -1, //  用户主动取消
    // code = 0,// 认证成功
    // code = 1, // 认证失败
    // code = 2, // 审核中
    // code = 3, // 认证渠道不可用
    console.log(result); 
});

获取用户健康数据

var params = {
    type: 'stepCount',
    startDate: '2018-03-23', // 时间支持两种格式: yyy-MM-dd 或者 yyyy-MM-dd hh:mm:ss
    endDate: '2018-04-01'
};
hybridBridge.user.healthData(params).then(function(result) {
    console.log(result.stepCount);
})

调用电子社保 SDK 功能

var params = {
    type : 'pwdValidate'
};
hybridBridge.user.essc(params).then(function(result) {
  console.log(result.busiSeq);
})

Util

打开新的 webview 或 APP 页面

var url = 'http://user.test.com';
var params = {name: 'name'};
// params 是可选的
hybridBridge.util.openLink(url, params);

打开外部链接

var url = 'http://user.test.com';
var params = {name: 'name'};
// params 是可选的
hybridBridge.util.openSchemeURI(url, params);

// 免密支付签约示例代码

var url = '签约url';
hybridBridge.util.openSchemeURI(url, {
    paySign: 'wx', // 或者 'alipay'
    // universalLink: 'xxxx' 微信 iOS SDK 需要的参数
}).then(function(result) {
    if (result.signStatus) {
      console.log('签约成功');
    }
});

分享

var args = {
    title: '标题', // 标题
    content: '分享内容', // 分享内容
    imageUrl: 'http://test.user.com/a.jpg', // 分享图片地址
    targetUrl: 'http://test.user.com/target', // 分享跳转的目标地址
    description: '', // 运营文案
    type: 'webpage' // 分享类型 'image' | 'text' | 'imageAndText' | 'webpage' | 'music'
};
hybridBridge.util.oldShare(args).then(function() {
    console.log('分享成功!');
}).catch(function(error) {
    console.log(error);
    console.log('分享失败!');
})

扫描二维码

var scanType = 'qrCode';
hybridBridge.util.scan(scanType).then(function(result) {
    // result = {text: 'text text'}
    console.log(result);
});

支付


var params = '{key: value}'; // 由后台提供的字符串
var type = 'Pay'; // type 是可选参数,根据不同应用,传递 'Pay' 或者 'InputPassword'
hybridBridge.util.pay(params, type).then(function(response) {
    /**
    * response = {
    *     stateCode?: number; // 1. 支付成功 2.支付失败 3.用户主动取消支付 4.版本不支持或 type 不支持
    *     errCode?: any; // 支付出错时,支付平台返回的errorCode,具体值参考:
    *     // 支付宝:https://docs.open.alipay.com/204/105301/
    *     // 微信:https://pay.weixin.qq.com/wiki/doc/api/app/app.php?chapter=8_5
    *     resultDes?: string; // 结果描述,具体描述为各个支付平台对应的错误描述
    *     payPassword?: string; // 加密后的支付密码
    * }
    */
   console.log(response); 
});

获取本地IP

hybridBridge.util.getIP().then(function(response) {
    console.log(response.clientIP);
});

获取浏览器指纹信息

hybridBridge.util.fingerprint().then(function(result) {
   console.log(result); 
});

微信H5支付

拿到指纹采集的结果和IP,并传给后台,由后台生成微信支付的 url,前端跳转到对应地址即可。示例如下:

Promise.all([hybridBridge.util.fingerprint(), hybridBridge.util.getIP()]).then(function(result) {
    var fingerprint = result[0];
    var ip = result[1].clientIP;

    $.ajax({
        url: '此URL为商户生成预支付charge对象后端服务地址',
        method: 'post',
        // 必传参数
        data: {
            // 浏览器指纹
            fingerprint: fingerprint,
            // 当前客户端IP地址
            ip: ip
        }
    }).success(function(response) {
        // 若 failureCode 为 null 即为预支付成功
        // 若 failureCode 不为 null 则预支付生成存在异常,具体异常信息请查看 response.failureMsg
        if (response.failureCode === null) {
            // 获得到订单号
            var orderNo = response.orderNo;
            // 经过encodeURIComponent转义
            var url = encodeURIComponent('此URL为商户支付完毕后的回传地址?orderNo=' + orderNo);
            
            location.href = response.credential.wx.mweb_url + '&redirect_url=' + url;
        }
    });
});

弹出微信支付结果模态框

在调用微信支付后的回调页面,可以调用弹出窗,由用户选择是支付成功,还是重新支付,不管用户选择什么,真正的支付结果,均以查询后台接口为准

hybridBridge.util.showWeixinPayModal().then(function(selectResult) {
    if (selectResult) {
        console.log('用户选择了支付成功');
    } else {
        console.log('用户选择了重新支付');
    }
});

获取APP版本号

hybridBridge.util.getAppVersion().then(function(result) {
    console.log(result.appVersion);
    console.log(result.updateUrl);
});

屏幕截图

hybridBridge.util.snapshot();

打开微信小程序

/**
*@param username {string} 表示小程序原始ID
*@param miniProgramType {string} 小程序类型,正式版:WXMiniProgramTypeRelease 测试版: WXMiniProgramTypeTest; 体验版: WXMiniProgramTypePreview;
*@param path {string} 可选, 表示要跳转到目标小程序的具体 page 页面,默认到首页
*/

var username = '';
var miniProgramType = '';
var path = '';
hybridBridge.util.openWeiXinMiniProgram(username, miniProgramType, path).then(function() {
  console.log('打开成功')
})

检测手机是否安装某款app

var params = {
  ios: '', // schemaURL
  android: '' // 包名
};
hybridBridge.util.canOpenURL(params).then(function(result) {
  console.log(result.isCanOpen);
})