/gzb-jssdk

MyGZB JSSDK

Primary LanguageTypeScriptMIT LicenseMIT

GZB JSSDK(v1)

工作宝JSSDK, 是工作宝APP面向web应用提供的开发工具包， 用于在工作宝应用的webview内调用APP 服务. 目前支持PC, Android, IOS平台。

通过这些接口可以实现选择图片，获取当前位置，分享，拨打电话， 发送短信，打开工作宝应用对话框等功能， 提升工作宝嵌入应用的网页体验

安装

yarn add @gdjiami/gzb-jssdk

或者

npm install @gdjiami/gzb-jssdk --save

接口协议

GZB-JSSDK-SPECS

文档和DEMO

GZB-JSSDK-DEMO

使用

基本使用

import Api, { BridgeResponseError } from '@gdjiami/gzb-jssdk'
const api = api()

// 简单接口
api.setTitle('hello gzb')

UMD版本

<script src="path/to/gzb-jssdk.umd.js"></script>
<script>
  var api = GZB.api()
  api.setTitle('hello gzb')
</script>

异步回调接口

async function chooseImage() {
  try {
    // 接口返回Promise， 所有可以配合使用async/await 编写更加简洁的异步代码
    const { width, height, name, quality, dataUrl } = await api.chooseImage({
      quality: 80
    })
    preview(dataUrl)
  } catch(error: BridgeResponseError) {
    console.log(error.errCode, error.message)
  }
}

事件接口, 工作宝JSSDK， 目前支持两种类型的事件， beforeunload和beforegoback， 分别对应原生窗口中的关闭和返回按钮.

beforeunload: beforeunload 事件类似于浏览器端的beforeunload 事件，你可以通过返回字符串来弹出一个确认框, 如果用户点击确认就会退出应用。

api.addListener('beforeunload', event => {
  return 'Are Sure to exit?'
})

你也可以通过返回false，会调用event.preventDefault() 来阻止默认行为。 需要注意的是返回 false 还会阻止后续订阅者的调用.

api.addListener('beforeunload', event => {
  event.preventDefault()
  myCustomConfirm('确认退出', () => {
    saveSomething()
    api.exit()
  })
})

事件接口目前有较为严重的问题，当你开发的是单页应用， 可以考虑使用这些接口。如果是多页应用， 由于原生Bridge绑定原有的回调，当切换页面后，会导致绑定事件的按钮失效。详见已知问题 解决这个问题的暂时方法是使用api.locationTo 来进行网站导航

用户代理检测

import { Device } from '@gdjiami/gzb-jssdk'

if (Device.mobile()) {
  // is mobile
} else if (Device.tablet()) {
  // is tablet
} else {
  // is desktop
}

兼容性

1.0 版本使用Typescript重写，依然兼容旧的接口，只不过只在umd压缩版本中提供，文件为dist/gzb-jssdk.umd.js, 可以 通过script标签进行导入 ：

<script src="path/to/gzb-jssdk.umd.js"></script>
<script>
// 接口调用
var api = customApi.init()
api.setTitle('hello')
api.chooseImg({
  quality: 80,
  targetType: 'width',
  target: 700,
}, function(res) {
  if (res.result === 'true') {
    // 调用成功
    // 预览图片
    preview(res.imgData)
  } else {
    console.log(res.errCode, errMsg)
  }
})

// 用户代理检测
var detector =  window.JH.Detector
detector.Android()
detector.isMobile()
detector.IOS()
// ...
</script>

注意：旧版接口将在下一大版本中移除，不要将他们用在新项目中。详见CHANGELOG

JSSDK 依赖于Promise，你需要确保你的环境支持Promise

旧版文档入口

已知问题

  • setBar 不能应用于多页应用，如果在当前页面绑定了close和goback事件， 当跳转到其他页面时，close，goback按钮将会失效, 因为没办法找到原来的回调，所以目前只建议在单页应用只使用api.addListener('beforeunload') 和api.addListener('beforegoback')