插件

插件的开发和使用自微信小程序基础库版本 1.9.6 开始支持。(如果插件包含页面,则需要基础库版本 2.1.0 。)

插件是对一组 js 接口、自定义组件 或页面的封装,用于嵌入到微信小程序中使用。插件不能独立运行,必须嵌入在其他微信小程序中才能被用户使用;而第三方微信小程序在使用插件时,也无法看到插件的代码。因此,插件适合用来封装自己的功能或服务,提供给第三方微信小程序进行展示和使用。

插件开发者可以像开发微信小程序一样编写一个插件并上传代码,在插件发布之后,其他微信小程序方可调用。微信小程序平台会托管插件代码,其他微信小程序调用时,上传的插件代码会随微信小程序一起下载运行。

相对于普通 js 文件或自定义组件,插件拥有更强的独立性,拥有独立的 API 接口、域名列表等,但同时会受到一些限制,如 一些 API 无法调用或功能受限。还有个别特殊的接口,虽然插件不能直接调用,但可以使用 插件功能页 来间接实现。

同时,框架会对微信小程序和微信小程序使用的每个插件进行数据安全保护,保证它们之间不能窃取其他任何一方的数据(除非数据被主动传递给另一方)。

对于插件开发者,请阅读 开发插件 章节;对于插件使用者,请阅读 使用插件 章节。

开发插件

开发插件前,请阅读了解《微信小程序插件接入指南》 了解开通流程及开放范围,并开通插件功能。如果未开通插件功能,将无法上传插件。

创建插件项目

插件类型的项目可以在开发者工具中直接创建。详情

创建插件

新建插件类型的项目后,如果创建示例项目,则项目中将包含三个目录:

  • plugin 目录:插件代码目录。
  • miniprogram 目录:放置一个微信小程序,用于调试插件。
  • doc 目录:用于放置插件开发文档。

miniprogram 目录内容可以当成普通微信小程序来编写,用于插件调试、预览和审核。下面的内容主要介绍 plugin 中的插件代码及 doc 中的插件开发文档。

我们提供了一个可以直接在微信开发者工具中查看的完整插件示例,开发者可以和本文互相对照以便理解。请注意:

  1. 由于插件需要 appid 才能工作,请填入一个 appid;
  2. 由于当前代码片段的限制,打开该示例后请 手动将 appid 填写到 miniprogram/app.json 中(如下图)使示例正常运行。

手动填写 appid

插件目录结构

一个插件可以包含若干个自定义组件、页面,和一组 js 接口。插件的目录内容如下:

plugin
├── components
│   ├── hello-component.js   // 插件提供的自定义组件(可以有多个)
│   ├── hello-component.json
│   ├── hello-component.wxml
│   └── hello-component.wxss
├── pages
│   ├── hello-page.js        // 插件提供的页面(可以有多个,自微信小程序基础库版本 2.1.0 开始支持)
│   ├── hello-page.json
│   ├── hello-page.wxml
│   └── hello-page.wxss
├── index.js                 // 插件的 js 接口
└── plugin.json              // 插件配置文件

插件配置文件

向使用者微信小程序开放的所有自定义组件、页面和 js 接口都必须在插件配置文件 plugin.json 列出,格式如下:

代码示例:

{
  "publicComponents": {
    "hello-component": "components/hello-component"
  },
  "pages": {
    "hello-page": "pages/hello-page"
  },
  "main": "index.js"
}

这个配置文件将向使用者微信小程序开放一个自定义组件 hello-component,一个页面 hello-pageindex.js 下导出的所有 js 接口。

进行插件开发

请注意:在插件开发中,只有部分接口可以直接调用;另外还有部分能力(如获取用户信息和发起支付等)可以通过插件功能页的方式使用。

自定义组件

插件可以定义若干个自定义组件,这些自定义组件都可以在插件内相互引用。但提供给使用者微信小程序使用的自定义组件必须在配置文件的 publicComponents 段中列出(参考上文)。

除去接口限制以外,自定义组件的编写和组织方式与一般的自定义组件相同,每个自定义组件由 wxml, wxss, jsjson 四个文件组成。具体可以参考自定义组件的文档

页面

插件从微信小程序基础库版本 2.1.0 开始支持页面。插件可以定义若干个插件页面,可以从本插件的自定义组件、其他页面中跳转,或从使用者微信小程序中跳转。所有页面必须在配置文件的 pages 段中列出(参考上文)。

除去接口限制以外,插件的页面编写和组织方式与一般的页面相同,每个页面由 wxml, wxss, jsjson 四个文件组成。具体可以参考其他关于页面的文档。

插件执行页面跳转的时候,可以使用 navigator 组件。当插件跳转到自身页面时,url 应设置为这样的形式:plugin-private://PLUGIN_APPID/PATH/TO/PAGE。需要跳转到其他插件时,也可以这样设置 url

代码示例:

<navigator url="plugin-private://wxidxxxxxxxxxxxxxx/pages/hello-page">
  Go to pages/hello-page!
</navigator>

自基础库版本 2.2.2 开始,在插件自身的页面中,插件还可以调用 wx.navigateTo 来进行页面跳转,url 格式与使用 navigator 组件时相仿。

接口

插件可以在接口文件(在配置文件中指定,详情见上文)中 export 一些 js 接口,供插件的使用者调用,如:

代码示例:

module.exports = {
  hello: function() {
    console.log('Hello plugin!')
  }
}

获取微信小程序导出

在开发者工具中预览效果,需要手动填写一下 miniprogram/app.json 中的插件 AppID

从基础库 2.11.1 起,在插件中有全局函数 requireMiniProgram,可以获取由使用者微信小程序导出的内容。

例如,使用者微信小程序做了如下导出:

// 使用者微信小程序
module.exports = {
  greeting() {
    return 'Greetings from Weixin MiniProgram!';
  }
}

那么在插件中,可以这样获得内容:

// 插件
const miniProgramExports = requireMiniProgram();
miniProgramExports.greeting(); // 'Greetings from Weixin MiniProgram!'

另外也可以参考使用者微信小程序的相关文档

引用微信小程序的自定义组件

在开发者工具中预览效果,需要手动填写一下 miniprogram/app.json 中的插件 AppID

有时,插件可能需要在页面或者自定义组件中,将一部分区域交给使用的微信小程序来渲染,因此需要能够引用微信小程序的自定义组件。但由于插件中不能直接指定微信小程序的自定义组件路径,因此无法直接通过 usingComponents 的方式来引用。这里介绍通过抽象节点(generics)来实现引用的方式。

如果是插件自定义组件(例如 plugin-view),那么我们可以通过声明一个 generic:

// plugin/components/plugin-view.json
{ "componentGenerics": { "mp-view": true } }

并在希望显示微信小程序组件的位置引用:

<!-- plugin/components/plugin-view.wxml -->
<view>微信小程序组件:</view>
<mp-view /><!-- 这里是一个微信小程序自定义组件 -->

在微信小程序中引用 plugin-view 时,就可以传递组件给插件进行渲染了:

<!-- miniprogram/page/index.wxml -->
<plugin-view generic:mp-view="comp-from-miniprogram" />

如果是插件页,插件页本身就是一个页面顶层组件,微信小程序不会引用它,无法通过 generic:xxx="" 的方式来指定抽象节点实现;因此,从基础库 2.12.2 起,微信小程序可以在插件的配置里为插件页指定抽象节点实现。例如插件页面名为 plugin-index,则可以:

{
  "myPlugin": {
    "provider": "wxAPPID",
    "version": "1.0.0",
    "genericsImplementation": {
      "plugin-index": {
        "mp-view": "components/comp-from-miniprogram"
      }
    }
  }
}

另外也可以参考使用者微信小程序的相关文档

预览、上传和发布

插件可以像微信小程序一样预览和上传,但插件没有体验版。

插件会同时有多个线上版本,由使用插件的微信小程序决定具体使用的版本号。

手机预览和提审插件时,会使用一个特殊的微信小程序来套用项目中 miniprogram 文件夹下的微信小程序,从而预览插件。

  • (建议的方式)如果当前开发者有测试号,则会使用这个测试号;在测试号的设置页中可以看到测试号的 appidappsecret 并设置域名列表。
  • 否则,将使用“插件开发助手”,它具有一个特定的 appid

在开发版微信小程序中测试

通常情况下,可以将 miniprogram 下的代码当做使用插件的微信小程序代码,来进行插件的调试和测试。

但有时,需要将插件的代码放在实际运行的微信小程序中进行调试、测试。此时,可以使用开发版的微信小程序直接引用开发版插件。方法如下:

  1. 在开发者工具的插件项目中上传插件,此时,在上传成功的通知信息中将包含这次上传获得的插件开发版 ID(一个英文、数字组成的随机字符串);
  2. 点击开发者工具右下角的通知按钮,可以打开通知栏,看到新生成的 ID;
  3. 在需要使用开发版本插件的微信小程序项目中,将插件 version 设置为 "version": "dev-[开发版 ID]" 的形式,如 "version": "dev-abcdef0123456789abcdef0123456789" 即可。

如果开发版微信小程序引用了开发版插件,此时这个微信小程序就不能上传发布了。必须要将插件版本设为正式版本之后,微信小程序才可以正常上传、发布。

注意事项:

  • 每次上传插件所生成的 ID 不一定相同,即使是同一个插件和同一个开发者,多次上传也可能会改变 ID;
  • 每个开发者在每个插件中只会同时存在一个有效的开发版插件,即只有最新上传的开发版 ID 有效(使用旧的 ID 会提示失效);
  • 同一个插件不同开发者上传的开发版互不影响,可以同时有效;
  • 开发版插件没有时间限制,长期有效。

插件开发文档

在使用者微信小程序使用插件时,插件代码并不可见。因此,除了插件代码,我们还支持插件开发者上传一份插件开发文档。这份开发文档将展示在插件详情页,供其他开发者在浏览插件和使用插件时进行阅读和参考。插件开发者应在插件开发文档中对插件提供的自定义组件、页面、接口等进行必要的描述和解释,方便使用者微信小程序正确使用插件。

插件开发文档必须放置在插件项目根目录中的 doc 目录下,目录结构如下:

doc
├── README.md   // 插件文档,应为 markdown 格式
└── picture.jpg // 其他资源文件,仅支持图片

其中,README.md 的编写有一定的 限制条件,具体来说:

  1. 引用到的图片资源不能是网络图片,且必须放在这个目录下;
  2. 文档中的链接只能链接到:
    • 微信开发者社区(developers.weixin.qq.com)
    • 微信公众平台(mp.weixin.qq.com)
    • GitHub(github.com)

编辑 README.md 之后,可以在开发者工具左侧资源管理器的文件栏中右键单击 README.md,并选择上传文档。发布上传文档后,文档不会立刻发布。此时可以使用账号和密码登录 管理后台 ,在 微信小程序插件 > 基本设置 中预览、发布插件文档。

插件文档总大小不能大于 2M,超过时上传将返回错误码 80051

其他注意事项

插件间互相调用

插件不能直接引用其他插件。但如果微信小程序引用了多个插件,插件之间是可以互相调用的。

一个插件调用另一个插件的方法,与插件调用自身的方法类似。可以使用 plugin-private://APPID 访问插件的自定义组件、页面(暂不能使用 plugin:// )。

对于 js 接口,可使用 requirePlugin ,但目前尚不能在文件一开头就使用 requirePlugin ,因为被依赖的插件可能还没有初始化,请考虑在更晚的时机调用 requirePlugin ,如接口被实际调用时、组件 attached 时。(未来会修复这个问题。)

插件请求签名

插件在使用 wx.request 等 API 发送网络请求时,将会额外携带一个签名 HostSign ,用于验证请求来源于微信小程序插件。这个签名位于请求头中,形如:

X-WECHAT-HOSTSIGN: {"noncestr":"NONCESTR", "timestamp":"TIMESTAMP", "signature":"SIGNATURE"}

其中, NONCESTR 是一个随机字符串, TIMESTAMP 是生成这个随机字符串和 SIGNATURE 的 UNIX 时间戳。它们是用于计算签名 SIGNATRUE 的参数,签名算法为:

SIGNATURE = sha1([APPID, NONCESTR, TIMESTAMP, TOKEN].sort().join(''))

其中,APPID所在微信小程序 的 AppId (可以从请求头的 referrer 中获得);TOKEN 是插件 Token,可以在微信小程序插件基本设置中找到。

网络请求的 referer 格式固定为 https://servicewechat.com/{appid}/{version}/page-frame.html,其中 {appid} 为微信小程序的 appid,{version} 为微信小程序的版本号,版本号为 0 表示为开发版、体验版以及审核版本,版本号为 devtools 表示为开发者工具,其余为正式版本。

插件开发者可以在服务器上按以下步骤校验签名:

  1. sortAPPID NONCESTR TIMESTAMP TOKEN 四个值表示成字符串形式,按照字典序排序(同 JavaScript 数组的 sort 方法);
  2. join 将排好序的四个字符串直接连接在一起;
  3. 对连接结果使用 sha1 算法,其结果即 SIGNATURE

自基础库版本 2.0.7 开始,在微信小程序运行期间,若网络状况正常, NONCESTRTIMESTAMP 会每 10 分钟变更一次。如有必要,可以通过判断 TIMESTAMP 来确定当前签名是否依旧有效。

使用插件

添加插件

在使用插件前,首先要在微信小程序管理后台首页的“微信小程序信息设置页-第三方设置-插件管理”中添加插件。开发者可登录微信小程序管理后台,通过 appid 查找插件并添加。如果插件无需申请,添加后可直接使用;否则需要申请并等待插件开发者通过后,方可在微信小程序中使用相应的插件。

引入插件代码包

使用插件前,使用者要在 app.json 中声明需要使用的插件,例如:

代码示例:

{
  "plugins": {
    "myPlugin": {
      "version": "1.0.0",
      "provider": "wxidxxxxxxxxxxxxxxxx"
    }
  }
}

如上例所示, plugins 定义段中可以包含多个插件声明,每个插件声明以一个使用者自定义的插件引用名作为标识,并指明插件的 appid 和需要使用的版本号。其中,引用名(如上例中的 myPlugin)由使用者自定义,无需和插件开发者保持一致或与开发者协调。在后续的插件使用中,该引用名将被用于表示该插件。

在分包内引入插件代码包

如果插件只在一个分包内用到,可以将插件仅放在这个分包内,例如:

{
  "subpackages": [
    {
      "root": "packageA",
      "pages": [
        "pages/cat",
        "pages/dog"
      ],
      "plugins": {
        "myPlugin": {
          "version": "1.0.0",
          "provider": "wxidxxxxxxxxxxxxxxxx"
        }
      }
    }
  ]
}

在分包内使用插件有如下限制:

  • 默认情况下,仅能在这个分包内使用该插件,除非通过 分包异步化 进行异步的跨分包引用;
  • 同一个插件不能被多个分包同时引用;
  • 如果基础库版本低于 2.9.0 ,不能从分包外的页面直接跳入分包内的插件页面,需要先跳入分包内的非插件页面、再跳入同一分包内的插件页面。

使用插件

使用插件时,插件的代码对于使用者来说是不可见的。为了正确使用插件,使用者应查看插件详情页面中的“开发文档”一节,阅读由插件开发者提供的插件开发文档,通过文档来明确插件提供的自定义组件、页面名称及提供的 js 接口规范等。

自定义组件

使用插件提供的自定义组件,和 使用普通自定义组件 的方式相仿。在 json 文件定义需要引入的自定义组件时,使用 plugin:// 协议指明插件的引用名和自定义组件名,例如:

代码示例:

{
  "usingComponents": {
    "hello-component": "plugin://myPlugin/hello-component"
  }
}

出于对插件的保护,插件提供的自定义组件在使用上有一定的限制:

  • 默认情况下,微信小程序和其他插件的 this.selectComponent 接口无法获得插件的自定义组件实例对象,同样插件的 this.selectComponent 也无法获得微信小程序和其他插件的;
    • 这个限制可以通过 自定义的组件实例获取结果 来去除
  • wx.createSelectorQuery 等接口的 >>> 选择器无法选入插件内部。

插件调用 API 的限制

插件可以调用的 API 与微信小程序不同,主要有两个区别:

  • 插件的请求域名列表与微信小程序相互独立;
  • 一些 API 不允许插件调用(这些函数不存在于 wx 对象下)。

有些接口虽然在插件中不能使用,但可以通过插件功能页来达到目的,请参考 插件功能页。

各接口在插件中的支持情况可以在各接口的文档中确认,接口文档中会有如 「本接口从基础库 2.1.0 起支持在微信小程序插件中使用」 的标识;如果没有标识,说明插件暂未支持,如果有需要的具体使用场景和需求,可以在开发者社区中反馈。

以下表格汇总了目前插件可以调用的 API 及其对应版本要求,但这份表格已经不再更新,是否可以使用,请以具体接口文档中的说明和真机表现为准

插件支持接口情况参考汇总(表格已停止维护)

基础

API 最低版本 备注
wx.arrayBufferToBase64
wx.base64ToArrayBuffer

发起请求

API 最低版本 备注
wx.request 1.9.6

上传、下载

API 最低版本 备注
wx.downloadFile 1.9.6
wx.uploadFile 1.9.6

WebSocket

API 最低版本 备注
wx.connectSocket 1.9.6

图片

API 最低版本 备注
wx.previewImage 1.9.6
wx.chooseImage 1.9.6
wx.getImageInfo 1.9.6
wx.saveImageToPhotosAlbum 1.9.6

录音

API 最低版本 备注
wx.startRecord 1.9.6
wx.stopRecord 1.9.6

实时音视频

API 最低版本 备注
wx.createLivePlayerContext 1.9.6
wx.createLivePusherContext 1.9.6

录音管理

API 最低版本 备注
wx.getRecorderManager 1.9.94

音频播放控制

API 最低版本 备注
wx.pauseVoice 1.9.6
wx.playVoice 1.9.6
wx.stopVoice 1.9.6

音乐播放控制

API 最低版本 备注
wx.onBackgroundAudioPlay 1.9.6
wx.getBackgroundAudioPlayerState 1.9.6
wx.onBackgroundAudioStop 1.9.6
wx.stopBackgroundAudio 1.9.6
wx.onBackgroundAudioPause 1.9.6
wx.seekBackgroundAudio 1.9.6
wx.playBackgroundAudio 1.9.6
wx.pauseBackgroundAudio 1.9.6

背景音频播放管理

API 最低版本 备注
wx.getBackgroundAudioManager 1.9.6

音频组件控制

API 最低版本 备注
wx.createInnerAudioContext 1.9.6
wx.createAudioContext 1.9.6

视频

API 最低版本 备注
wx.chooseVideo 1.9.6
wx.saveVideoToPhotosAlbum 1.9.6

视频组件控制

API 最低版本 备注
wx.createVideoContext 1.9.6

相机组件控制

API 最低版本 备注
wx.createCameraContext 1.9.6

数据缓存

API 最低版本 备注
wx.setStorage 1.9.6
wx.getStorage 1.9.6
wx.removeStorage 1.9.6
wx.setStorageSync 1.9.6
wx.getStorageSync 1.9.6
wx.removeStorageSync 1.9.6

获取位置

API 最低版本 备注
wx.getLocation 1.9.6
wx.chooseLocation 1.9.6
wx.onLocationChange 2.8.0
wx.offLocationChange 2.9.1
wx.stopLocationUpdate 2.8.0
wx.startLocationUpdate 2.8.0

查看位置

API 最低版本 备注
wx.openLocation 1.9.6

地图组件控制

API 最低版本 备注
wx.createMapContext 1.9.6

系统信息

API 最低版本 备注
wx.getSystemInfoSync 1.9.6
wx.getSystemInfo 1.9.6

屏幕亮度

API 最低版本 备注
wx.setKeepScreenOn 1.9.6
wx.setScreenBrightness 1.9.6
wx.getScreenBrightness 1.9.6

用户截屏事件

API 最低版本 备注
wx.onUserCaptureScreen 1.9.6 仅限插件页面中调用
wx.offUserCaptureScreen 2.9.1 仅限插件页面中调用

振动

API 最低版本 备注
wx.vibrateLong 1.9.6
wx.vibrateShort 1.9.6

手机联系人

API 最低版本 备注
wx.addPhoneContact 1.9.6

NFC

API 最低版本 备注
wx.sendHCEMessage 2.1.0
wx.stopHCE 2.1.0
wx.onHCEMessage 2.1.0
wx.offHCEMessage 2.9.1
wx.startHCE 2.1.0
wx.getHCEState 2.1.0

网络状态

API 最低版本 备注
wx.onNetworkStatusChange 1.9.6
wx.offNetworkStatusChange 2.9.1
wx.getNetworkType 1.9.6

加速度计

API 最低版本 备注
wx.startAccelerometer 1.9.6
wx.stopAccelerometer 1.9.6
wx.onAccelerometerChange 1.9.6
wx.offAccelerometerChange 2.9.1

设备方向

API 最低版本 备注
wx.startDeviceMotionListening 2.9.1
wx.stopDeviceMotionListening 2.9.1
wx.offDeviceMotionChange 2.9.1
wx.onDeviceMotionChange 2.9.1

陀螺仪

API 最低版本 备注
wx.startGyroscope 2.9.1
wx.stopGyroscope 2.9.1
wx.offGyroscopeChange 2.9.1
wx.onGyroscopeChange 2.9.1

罗盘

API 最低版本 备注
wx.onCompassChange 1.9.6
wx.offCompassChange 2.9.1
wx.stopCompass 1.9.6
wx.startCompass 1.9.6

拨打电话

API 最低版本 备注
wx.makePhoneCall 1.9.6

扫码

API 最低版本 备注
wx.scanCode 1.9.6

剪贴板

API 最低版本 备注
wx.setClipboardData 1.9.6
wx.getClipboardData 1.9.6

蓝牙

API 最低版本 备注
wx.writeBLECharacteristicValue 1.9.6
wx.startBluetoothDevicesDiscovery 1.9.6
wx.getConnectedBluetoothDevices 1.9.6
wx.notifyBLECharacteristicValueChange 1.9.6
wx.onBluetoothDeviceFound 1.9.6
wx.offBluetoothDeviceFound 2.9.1
wx.readBLECharacteristicValue 1.9.6
wx.openBluetoothAdapter 1.9.6
wx.getBLEDeviceCharacteristics 1.9.6
wx.stopBluetoothDevicesDiscovery 1.9.6
wx.onBLEConnectionStateChange 1.9.6
wx.getBluetoothDevices 1.9.6
wx.getBluetoothAdapterState 1.9.6
wx.onBluetoothAdapterStateChange 1.9.6
wx.offBluetoothAdapterStateChange 2.9.1
wx.getBLEDeviceServices 1.9.6
wx.onBLECharacteristicValueChange 1.9.6
wx.offBLECharacteristicValueChange 2.9.1
wx.createBLEConnection 1.9.6
wx.closeBluetoothAdapter 1.9.6
wx.closeBLEConnection 1.9.6
wx.notifyBLECharacteristicValueChange 1.9.6
wx.onBLEConnectionStateChange 1.9.6
wx.offBLEConnectionStateChange 2.9.1

iBeacon

API 最低版本 备注
wx.getBeacons 1.9.6
wx.startBeaconDiscovery 1.9.6
wx.onBeaconServiceChange 1.9.6
wx.offBeaconServiceChange 2.9.1
wx.onBeaconUpdate 1.9.6
wx.offBeaconUpdate 2.9.1
wx.stopBeaconDiscovery 1.9.6

Wi-Fi

API 最低版本 备注
wx.connectWifi 2.9.1
wx.getConnectedWifi 2.9.1
wx.getWifiList 2.9.1
wx.offGetWifiList 2.9.1
wx.offWifiConnected 2.9.1
wx.onEvaluateWifi 2.9.1
wx.onGetWifiList 2.9.1
wx.onWifiConnected 2.9.1
wx.presetWifiList 2.9.1
wx.setWifiList 2.9.1
wx.startWifi 2.9.1
wx.stopWifi 2.9.1

交互反馈

API 最低版本 备注
wx.hideLoading 1.9.6
wx.showActionSheet 1.9.6
wx.showLoading 1.9.6
wx.hideToast 1.9.6
wx.showToast 1.9.6
wx.showModal 1.9.6

设置导航条

API 最低版本 备注
wx.showNavigationBarLoading 2.1.0 仅限插件页面中调用
wx.hideNavigationBarLoading 2.1.0 仅限插件页面中调用
wx.setNavigationBarColor 2.1.0 仅限插件页面中调用
wx.setNavigationBarTitle 2.1.0 仅限插件页面中调用

背景

API 最低版本 备注
wx.setBackgroundColor 2.4.0 仅限插件页面中调用
wx.setBackgroundTextStyle 2.4.0 仅限插件页面中调用

WXML 节点信息

API 最低版本 备注
wx.createSelectorQuery 1.9.6

WXML 节点布局相交状态

API 最低版本 备注
wx.createIntersectionObserver 1.9.6

导航

API 最低版本 备注
wx.navigateBack 2.1.0 仅限插件页面中调用
wx.navigateTo 2.2.2 仅限插件页面中调用
wx.redirectTo 2.2.2 仅限插件页面中调用
wx.switchTab 2.3.1 仅限插件页面中调用
wx.reLaunch 2.3.1 仅限插件页面中调用

动画

API 最低版本 备注
wx.createAnimation 1.9.6

位置

API 最低版本 备注
wx.pageScrollTo 2.1.0 仅限插件页面中调用

绘图

API 最低版本 备注
wx.createOffscreenCanvas 2.7.1
wx.canvasPutImageData 1.9.6
wx.canvasToTempFilePath 1.9.6
wx.createCanvasContext 1.9.6
wx.canvasGetImageData 1.9.6

下拉刷新

API 最低版本 备注
wx.stopPullDownRefresh 2.1.0 仅限插件页面中调用
wx.startPullDownRefresh 2.1.0 仅限插件页面中调用

当前账号信息

API 最低版本 备注
wx.getAccountInfoSync 2.2.2

转发

API 最低版本 备注
wx.hideShareMenu 2.1.0 仅限插件页面中调用
wx.getShareInfo 2.1.0 仅限插件页面中调用
wx.showShareMenu 2.1.0 仅限微信小程序插件页面中调用
wx.updateShareMenu 2.1.0 仅限微信小程序插件页面中调用

实时日志

API 最低版本 备注
wx.getRealtimeLogManager 2.16.0

其他

API 最低版本 备注
wx.getSetting 2.6.3
wx.openSetting 2.10.3
wx.reportAnalytics 1.9.6 见下方备注

登录和获取用户信息

这一组接口仅限在用户信息功能页中获得用户授权之后调用。否则将返回 fail 。详见 用户信息功能页 。

API 最低版本 备注
wx.login 2.3.1
wx.getUserInfo 2.3.1

Bugs & Tips

  • wx.reportAnalytics 可以被正常调用,但目前不会进行统计展示。

插件功能页

插件功能页从微信小程序基础库版本 2.1.0 开始支持。

某些接口不能在插件中直接调用(如 wx.login),但插件开发者可以使用插件功能页的方式来实现功能。目前,插件功能页包括:

  • 获取用户信息,包括 openid 和昵称等(相当于 wx.login 和 wx.getUserInfo 的功能),详见 用户信息功能页;

从基础库版本 2.22.1 起,以下功能页已经废弃,可以直接调用对应接口实现功能:

  • 支付(直接使用 wx.requestPluginPayment)

从基础库版本 2.16.1 起,以下三个功能页已经废弃,可以直接调用对应接口实现功能;原有和新使用的 <functional-page-navigator> 在点击后将不会跳到功能页,而是直接生效:

  • 收货地址功能页(直接使用 wx.chooseAddress)
  • 发票抬头功能页(直接使用 wx.chooseInvoiceTitle)
  • 发票功能页(直接使用 wx.chooseInvoice)

要使用插件功能页,需要先激活功能页特性,配置对应的功能页函数,再使用 functional-page-navigator 组件跳转到插件功能页,从而实现对应的功能。详情请参考下文。

使用插件功能页前,需要确定插件已经 开通,否则可能出现 functional-page-navigator 点击后无响应等情况

插件所有者微信小程序

开始开发之前,我们需要知道,插件功能页是指 插件所有者微信小程序 中的一个特殊页面。

插件所有者微信小程序,指的是与插件 AppID 相同的微信小程序。例如,“微信小程序示例”微信小程序开发了一个“微信小程序示例插件”,那么无论这个插件被哪个微信小程序使用,这个插件的 插件所有者微信小程序 都是“微信小程序示例”。下文中会继续使用 插件所有者微信小程序 这个说法。

插件所有者微信小程序开发方法

通常,在开始使用插件功能页的时候,需要开启两个开发者工具窗口,其中一个打开插件项目,另一个打开插件所有者微信小程序的微信小程序项目。例如,一个打开“微信小程序示例插件”项目,另一个打开“微信小程序示例”项目。

这两个窗口,前者用于编辑插件,后者用于编辑插件所有者微信小程序。下文中所有需要编辑插件所有者微信小程序的内容,都是在后者中进行。

激活功能页特性

要在插件中调用插件功能页,需要先激活插件所有者微信小程序的功能页特性。具体来说,在插件所有者微信小程序的 app.json 文件中添加 functionalPages 定义段,并令其值为 true ,例如:

代码示例:

{
  "functionalPages": {
    "independent": true
  }
}

目前,兼容旧式写法:

{
  "functionalPages": true
}

旧式写法将在未来将被移除支持,未来将不能编译上传。

这两种写法的区别在于,新式的写法 "independent": true 会使得插件功能页的代码独立于其他代码,这意味着插件功能页可以被独立下载、加载,具有更好的性能表现。 但也同时使得插件功能页目录 functional-pages/ (支付功能页会使用其中的文件)不能 require 这个目录以外的文件(反之亦然:这个目录以外的文件也不能调用这个目录内的)。

注意,新增或改变这个字段时,需要这个微信小程序发布新版本,才能在正式环境中使用插件功能页。

跳转到功能页

功能页不能使用 wx.navigateTo 来进行跳转,而是需要一个名为 functional-page-navigator 的组件。以获取用户信息为例,可以在插件中放置如下的 functional-page-navigator:

代码示例:

<functional-page-navigator name="loginAndGetUserInfo" args="" version="develop" bind:success="loginSuccess">
  <button>登录到插件</button>
</functional-page-navigator>

用户在点击这个 navigator 时,会自动跳转到插件所有者微信小程序的对应功能页。功能页会提示用户进行登录或其他相应的操作。操作结果会以组件事件的方式返回。

functional-page-navigator 的参数和详细使用方法可以参考 组件说明 。

从微信小程序基础库版本 2.4.0 开始,支持插件所有者微信小程序跳转到自己的功能页。在基础库版本低于 2.4.0 时,点击跳转到自己的功能页的 functional-page-navigator 将没有任何反应。

真机开发测试的常规步骤

目前,功能页的跳转目前不支持在开发者工具中调试,请在真机上测试。初次进行真机开发测试时,通常步骤如下:

  1. 在开发者工具上打开插件所有者微信小程序项目,并点击“预览”;
  2. 用测试用的真机扫一下预览二维码,此时会进入插件所有者微信小程序,进入后就可以直接退出这个微信小程序;
  3. 在开发者工具上打开插件项目,将插件中 functional-page-navigator 中的 version 属性设置为 develop
  4. 点击预览可以生成插件预览二维码,用测试用的真机扫码即可预览功能页;如果更改了插件代码,重新生成并扫描插件的预览二维码即可;
  5. 如果过了一段时间之后,跳转功能页时出现“开发版已过期”这样的提示,从第 1 步开始重试一次。

注意functional-page-navigatorversion=develop 仅用于调试,因此在插件提审前,需要:

  1. 确保已发布设置了 "functionalPages": true 的插件所有者微信小程序;
  2. 确保所有的 functional-page-navigator 组件属性设置为 version="release"

功能页常见问题 FAQ

如何正确编辑插件所有者微信小程序?

  • 应该在开发者工具的“微信小程序”类型项目中编辑,而不是在“插件”类型的项目中编辑。比如,“微信小程序示例插件”的所有者微信小程序是“微信小程序示例”,它们的 AppID 都是 wxidxxxxxxxxxxxxxx ,如果是初次开发“微信小程序示例”微信小程序,可以在开发者工具中创建一个微信小程序项目,其 AppID 为 wxidxxxxxxxxxxxxxx ;如果之前开发过“微信小程序示例”微信小程序,直接打开之前的微信小程序项目即可。

点击 functional-page-navigator 之后没有任何反应。

  • 请检查引用插件的微信小程序和插件本身是不是同一个 AppID ,如果是,跳转到自己的功能页需要基础库 2.4.0 支持,否则使用 functional-page-navigator 不会有任何反应。

点击 functional-page-navigator 之后,展示了一个页面提示“页面不存在”。

  • 这种情况是因为插件所有者微信小程序没有正确设置 "functionalPages": true 。如果 functional-page-navigatorversion="develop" ,这部手机需要扫码并进入插件所有者微信小程序一次;如果 version="release" ,请确保包含 "functionalPages": true 的插件所有者微信小程序已被发布。

点击 <functional-page-navigator version="develop"> 之后,弹窗提示“微信小程序开发版已过期”。

  • 遇到这种情况,重新扫码并进入插件所有者微信小程序一次即可。

点击 <functional-page-navigator name="requestPayment"> 之后,展示了一个页面提示“该功能无法使用”。

  • 在使用插件功能页时,微信小程序不能是个人微信小程序,同时,插件也需要额外的步骤申请开通插件支付权限(位于 管理后台 -> 微信小程序插件 -> 基本设置 -> 支付能力 )。

点击 <functional-page-navigator name="requestPayment"> 之后,点击页面中的“支付”按钮,立刻退出了支付功能页。

  • 这通常是因为没有找到功能页函数 beforeRequestPayment ,请检查插件所有者微信小程序的 functional-pages/request-payment.js 文件和其中的 beforeRequestPayment 函数是否存在。

点击 functional-page-navigator 之后,展示了一个仅有返回按钮的页面。

  • 请检查 functional-page-navigator 的 name 属性是否被正确设置。

开发版可以正常跳转,但审核反馈不能跳转。

  • 请发布设置了 "functionalPages": true 的插件所有者微信小程序,且所有的 functional-page-navigator 组件属性设置为 version="release"

Bugs & Tip

  • 功能页是插件所有者微信小程序中的一个特殊页面,开发者不能自定义这个页面的外观。
  • 插件所有者微信小程序本身也可以引用这个插件,此时,functional-page-navigator 组件的 version 属性将不会生效,而是取决于当前运行的插件所有者微信小程序的版本。
  • functional-page-navigator 可以在开发者工具中使用,但功能页的跳转目前不支持在开发者工具中调试,请在真机上测试。
  • Bug:在微信版本 6.6.7 中,功能页被拉起时会触发 App 的部分生命周期并使得功能页启动时间变得比较长。在后续的微信版本中这一行为会发生变更,使 App 生命周期不再被触发。

用户信息功能页

用户信息功能页用于帮助插件获取用户信息,包括 openid 和昵称等,相当于 wx.login 和 wx.getUserInfo 的功能。

在基础库版本 2.3.1 前,用户信息功能页是插件中唯一的获取 code 和用户信息的方式;

自基础库版本 2.3.1 起,用户在该功能页中进行过授权后,插件可以直接调用 wx.login 和 wx.getUserInfo:

  • 授权是以【用户 + 微信小程序 + 插件】为维度进行授权的,即同一个用户在不同微信小程序中使用同一个插件,或同一个微信小程序中使用不同插件,都需要单独进行授权
  • 自基础库版本 2.6.3 起,可以使用 wx.getSetting 来查询用户是否授权过

另外,在满足以下任一条件时,插件可以直接调用 wx.login:

  1. 使用插件的微信小程序与插件拥有相同的 AppId
  2. 使用插件的微信小程序与插件绑定了同一个 微信开放平台 账号,且使用插件的微信小程序与插件均与开放平台账号为同主体或关联主体

不满足以上条件时,wx.login 和 wx.getUserInfo 将返回失败。

调用参数

用户信息功能页使用 functional-page-navigator 进行跳转时,对应的参数 name 应为固定值 loginAndGetUserInfo,其余参数与 wx.getUserInfo 相同,具体来说:

args 参数说明:

参数名 类型 必填 说明
withCredentials Boolean 是否带上登录态信息
lang String 指定返回用户信息的语言,zh_CN 简体中文,zh_TW 繁体中文,en 英文。默认为 en。
timeout Number 超时时间,单位 ms

注:当 withCredentials 为 true 时,返回的数据会包含 encryptedData, iv 等敏感信息。

bindsuccess 返回参数说明:

参数 类型 说明
code String 同 wx.login 获得的用户登录凭证(有效期五分钟)。开发者需要在开发者服务器后台调用 api,使用 code 换取 openid 和 session_key 等信息
errMsg String 调用结果
userInfo OBJECT 用户信息对象,不包含 openid 等敏感信息
rawData String 不包括敏感信息的原始数据字符串,用于计算签名。
signature String 使用 sha1( rawData + sessionkey ) 得到字符串,用于校验用户信息,参考文档 signature。
encryptedData String 包括敏感数据在内的完整用户信息的加密数据,详细见 加密数据解密算法
iv String 加密算法的初始向量,详细见 加密数据解密算法

userInfo 参数说明:

参数 类型 说明
nickName String 用户昵称
avatarUrl String 用户头像,最后一个数值代表正方形头像大小(有 0、46、64、96、132 数值可选,0 代表 132*132 正方形头像),用户没有头像时该项为空。若用户更换头像,原有头像 URL 将失效。
gender String 用户的性别,值为 1 时是男性,值为 2 时是女性,值为 0 时是未知
city String 用户所在城市
province String 用户所在省份
country String 用户所在国家
language String 用户的语言,简体中文为 zh_CN

示例代码

<!--plugin/components/hello-component.wxml-->
  <functional-page-navigator
    name="loginAndGetUserInfo"
    args="{{ args }}"
    version="develop"
    bind:success="loginSuccess"
    bind:fail="loginFail"
  >
    <button class="login">登录到插件</button>
  </functional-page-navigator>
// plugin/components/hello-component.js
Component({
  properties: {},
  data: {
    args: {
      withCredentials: true,
      lang: 'zh_CN'
    }
  },
  methods: {
    loginSuccess: function (res) {
      console.log(res.detail);
    },
    loginFail: function (res) {
      console.log(res);
    }
  }
});

用户点击该 navigator 后,将跳转到如下的用户信息功能页:

用户信息功能页

在微信开发者工具中查看示例

  1. 由于插件需要 appid 才能工作,请填入一个 appid;
  2. 由于当前代码片段的限制,打开该示例后请 手动将 appid 填写到 miniprogram/app.json 中(如下图)使示例正常运行。

手动填写 appid

微信小程序支付功能页

自2025年6月26日起,不再支持新申请插件支付功能,如果要在微信小程序中实现给向第三方支付,请使用「打开半屏微信小程序」功能

支付功能页用于帮助插件完成支付,相当于 wx.requestPayment 的功能。

自基础库版本 2.22.1 起,可以直接在插件中调用 wx.requestPluginPayment 实现跳转支付;通过 functional-page-navigator 跳转将会被废弃。

在满足以下条件时,调用 wx.requestPluginPayment 或点击 navigator 都将直接拉起支付收银台,跳过支付功能页:

  • 微信小程序与插件绑定在同一个 open 平台账号上

  • 微信小程序与插件均为 open 账号的同主体 / 关联主体时。

需要注意的是:插件使用支付功能,需要进行额外的权限申请,申请位置位于 管理后台 的“微信小程序插件 -> 基本设置 -> 支付能力”设置项中。另外,无论是否通过申请,主体为个人微信小程序在使用插件时,都无法正常使用插件里的支付功能。

调用参数

参数说明:

参数名 类型 必填 说明
fee Number 需要显示在页面中的金额,单位为分
paymentArgs Object 任意数据,传递给功能页中的响应函数
currencyType String 需要显示在页面中的货币符号的代码,默认为 CNY

currencyType 的合法值:

说明 最低版本
CNY 货币符号 ¥
USD 货币符号 US$
JPY 货币符号 J¥
EUR 货币符号 €
HKD 货币符号 HK$
GBP 货币符号 £
AUD 货币符号 A$
MOP 货币符号 MOP$
KRW 货币符号 ₩

示例代码

wx.requestPluginPayment 方式

自基础库版本 2.22.1 起,推荐使用该方式。

<!-- plugin/components/pay.wxml -->
<button bindtap="handlePay">支付 0.01 元</button>
// plugin/components/pay.js
Component({
  data: {
    fee: 1,             // 支付金额,单位为分
    paymentArgs: 'A', // 将传递到功能页函数的自定义参数
    currencyType: 'USD' // 货币符号,页面显示货币简写 US$ 
    version: 'develop', // 上线时,version 应改为 "release",并确保插件所有者微信小程序已经发布
  },
  methods: {
    handlePay() {
        const { fee, paymentArgs, currencyType, version } = this.data
        wx.requestPluginPayment({
            fee,
            paymentArgs,
            currencyType,
            version,
            success(r) {
                console.log(r)
            },
            fail(e) {
                console.error(e)
            }
        })
    }
  }
})

functionl-page-navigator 方式(将废弃)

该方式将会被废弃,仅供参考

<!-- plugin/components/pay.wxml -->
<!-- 上线时,version 应改为 "release",并确保插件所有者微信小程序已经发布 -->
<!-- name 参数固定为 "requestPayment" -->
<functional-page-navigator
  version="develop"
  name="requestPayment"
  args="{{ args }}"
  bind:success="paymentSuccess"
  bind:fail="paymentFailed"
>
  <button class="payment-button">支付 0.01 元</button>
</functional-page-navigator>
// plugin/components/pay.js
Component({
  data: {
    args: {
      fee: 1,             // 支付金额,单位为分
      paymentArgs: 'A', // 将传递到功能页函数的自定义参数
      currencyType: 'USD' // 货币符号,页面显示货币简写 US$ 
    }
  },
  methods: {
    // 支付成功的回调接口
    paymentSuccess: function (e) {
      console.log(e);
      e.detail.extraData.timeStamp // 用 extraData 传递数据,详见下面功能页函数代码
    },
    // 支付失败的回调接口
    paymentFailed: function (e) {
      console.log(e);
    }
  }
})

用户调用 wx.requestPluginPayment 或点击 navigator 后,将会进行权限判断,然后直接拉起支付收银台或跳转到如下的支付功能页:

支付功能页

配置功能页函数

支付功能页需要插件开发者在插件所有者微信小程序中提供一个函数来响应插件中的支付调用。即,在插件中跳转到支付功能页或调用 wx.requestPluginPayment 时,这个函数就会在合适的时机被调用,来帮助完成支付。如果不提供功能页函数,功能页调用将通过 fail 事件返回失败。

支付功能页函数应以导出函数的形式提供在插件所有者微信小程序的根目录下的 functional-pages/request-payment.js 文件中,名为 beforeRequestPayment。该函数应接收两个参数:

参数名 类型 说明
paymentArgs Object 即通过 functional-page-navigator 的 arg 参数中的 paymentArgs 字段传递到功能页的自定义数据
callback Function 回调函数,调用该函数后,微信小程序将发起支付(类似于 wx.requestPayment)

callback 函数的参数:

参数名 类型 说明
error Object 失败信息,若无失败,应返回 null
requestPaymentArgs Object 支付参数,用于调用 wx.requestPayment,参数如下

requestPaymentArgs 的参数:

用于发起支付,和 wx.requestPayment 的参数相同,但没有回调函数(success, fail, complete):

参数 类型 必填 说明
timeStamp String 时间戳从 1970 年 1 月 1 日 00:00:00 至今的秒数,即当前的时间
nonceStr String 随机字符串,长度为 32 个字符以下。
package String 统一下单接口返回的 prepay_id 参数值,提交格式如:prepay_id=***
signType String 签名算法,暂支持 MD5
paySign String 签名,具体签名方案参见 微信小程序支付接口文档;
extraData any 由开发者决定的自定义数据段,该字段将被无修改地透传到支付成功的回调参数中,具体见代码示例中的使用方法。基础库 2.9.1 开始支持

了解更多信息,请查看 微信支付接口文档

功能页函数代码示例:

// functional-pages/request-payment.js
exports.beforeRequestPayment = function (paymentArgs, callback) {
  // 注意:
  // 功能页函数(这个函数)不应 require 其他非 functional-pages 目录中的文件,
  // 其他非 functional-pages 目录中的文件也不应 require 这个目录中的文件,
  // 这样的 require 调用在未来将不被支持。
  //
  // 同在 functional-pages 中的文件可以 require
  var getOpenIdURL = require('./URL').getOpenIdURL;
  var paymentURL = require('./URL').paymentURL;

  // 自定义的参数,此处应为从插件传递过来的 'A'
  var customArgument = paymentArgs.customArgument;

  // 第一步:调用 wx.login 方法获取 code,然后在服务端调用微信接口使用 code 换取下单用户的 openId
  // 具体文档参考 https://mp.weixin.qq.com/debug/wxadoc/dev/api/api-login.html?t=20161230#wxloginobject
  wx.login({
    success: function (data) {
      wx.request({
        url: getOpenIdURL,
        data: { code: data.code },
        success: function (res) {
          // 拉取用户 openid 成功
          // 第二步:在服务端调用支付统一下单,返回支付参数。这里的开发和普通的 wx.requestPayment 相同
          // 文档可以参考 https://pay.weixin.qq.com/doc/v2/merchant/4011938514
          wx.request({
            url: paymentURL,
            data: { openid: res.data.openid },
            method: 'POST',
            success: function (res) {
              console.log('unified order success, response is:', res);
              var payargs = res.data.payargs;
              // 第三步:调用回调函数 callback 进行支付
              // 在 callback 中需要返回两个参数: err 和 requestPaymentArgs:
              // err 应为 null (或者一些失败信息);
              // requestPaymentArgs 将被用于调用 wx.requestPayment,除了 success/fail/complete 不被支持外,
              // 应与 wx.requestPayment 参数相同。
              var error = null;
              var requestPaymentArgs = {
                timeStamp: payargs.timeStamp,
                nonceStr: payargs.nonceStr,
                package: payargs.package,
                signType: payargs.signType,
                paySign: payargs.paySign,
                extraData: { // 用 extraData 传递自定义数据
                  timeStamp: payargs.timeStamp
                },
              };
              callback(error, requestPaymentArgs);
            }
          });
        },
        fail: function (res) {
          console.log('拉取用户 openid 失败,将无法正常使用开放接口等服务', res);
          // callback 第一个参数为错误信息,返回错误信息
          callback(res);
        }
      });
    },
    fail: function (err) {
      console.log('wx.login 接口调用失败,将无法正常使用开放接口等服务', err)
      // callback 第一个参数为错误信息,返回错误信息
      callback(err);
    }
  });
}

注意:功能页函数不应 require 其他非 functional-pages 目录中的文件,其他非 functional-pages 目录中的文件也不应 require 这个目录中的文件。这样的 require 调用在未来将不被支持。

这个目录和文件应当被放置在插件所有者微信小程序代码中(而非插件代码中),它是插件所有者微信小程序的一部分(而非插件的一部分)。 如果需要新增或更改这段代码,需要发布插件所有者微信小程序,才能在正式版中生效;需要重新预览插件所有者微信小程序,才能在开发版中生效。

微信小程序收货地址功能页

从基础库版本 2.16.1 起,该功能页已经废弃,可以直接使用 wx.chooseAddress 实现对应的功能;点击 functional-page-navigator 也将不再进入功能页,直接进入收货地址选择页。

文档

收货地址功能页用于展示用户的收货地址列表,用户可以选择其中的收货地址。自基础库版本 2.4.0 开始支持。

调用参数

用户信息功能页使用 functional-page-navigator 进行跳转时,对应的参数 name 应为固定值 chooseAddress ,返回参数与 wx.chooseAddress 相同。

bindsuccess 返回参数说明:

属性 类型 说明 最低版本
userName string 收货人姓名
postalCode string 邮编
provinceName string 国标收货地址第一级地址
cityName string 国标收货地址第一级地址
countyName string 国标收货地址第一级地址
detailInfo string 详细收货地址信息
nationalCode string 收货地址国家码
telNumber string 收货人手机号码
errMsg string 错误信息

示例代码

<!--plugin/components/hello-component.wxml-->
  <functional-page-navigator
    name="chooseAddress"
    version="develop"
    bind:success="onSuccess"
    bind:fail="onFail"
  >
    <button>选择收货地址</button>
  </functional-page-navigator>
// plugin/components/hello-component.js
Component({
  methods: {
    onSuccess: function (res) {
      console.log(res.detail);
    },
    onFail: function (res) {
      console.log(res);
    }
  }
});

发票功能页

从基础库版本 2.16.1 起,该功能页已经废弃,可以直接使用 wx.chooseInvoice 实现对应的功能;点击 functional-page-navigator 也将不再进入功能页,直接进入发票选择页。

文档

发票功能页用于展示用户的发票列表,用户可以选择其中的发票。自基础库版本 2.14.1 开始支持。

调用参数

发票功能页使用 functional-page-navigator 进行跳转时,对应的参数 name 应为固定值 chooseInvoice ,返回参数与 wx.chooseInvoice 相同。

bindsuccess 返回参数说明:

属性 类型 说明
invoiceInfo String 用户选中的发票信息,格式为一个 JSON 字符串,包含三个字段: card_id:所选发票卡券的 cardId,encrypt_code:所选发票卡券的加密 code,报销方可以通过 cardId 和 encryptCode 获得报销发票的信息,app_id: 发票方的 appId。

示例代码

<!--plugin/components/hello-component.wxml-->
  <functional-page-navigator
    name="chooseInvoice"
    version="develop"
    bind:success="onSuccess"
    bind:fail="onFail"
  >
    <button>选择发票</button>
  </functional-page-navigator>
// plugin/components/hello-component.js
Component({
  methods: {
    onSuccess: function (res) {
      console.log(res.detail);
    },
    onFail: function (res) {
      console.log(res);
    }
  }
});