本教程用于帮助开发者在快应用中使用微信支付。

微信的 支付产品 有很多种,快应用目前支持其中的 APP支付H5支付

如果开发者此前只使用过[小程序支付],那么还需要到微信开发平台创建新的[移动应用]或者[网站应用],开通新应用的微信支付能力,并开发好对应的后台接口方可使用。

注意:微信小程序转快应用工具不支持调起小程序支付。

# 1. 快应用接入微信APP支付

# 1.1 快应用接入微信APP支付的前期准备

如果开发者熟悉快应用签名文件,公私钥对,base64,MD5等概念的话,可以直接跳过本小节。

后面接入过程会用到的信息如下:

  • 快应用的包名
  • 快应用签名文件中公钥的base64格式字符串
  • 快应用签名文件中公钥的md5

# 1.1.1 快应用签名文件

快应用项目工程中sign/release目录下的两个文件就是用于签名正式版本快应用的签名文件。

如果该目录下没有文件,可以通过 快应用开发工具 创建新的签名:

  • 单击选项[Hap]
  • 选择[生成证书]
  • 输入必要的信息选择生成即可

# 1.1.2 快应用签名文件中公钥的base64格式字符串

sign/release目录下的certificate.pem就是签名文件的公钥,文本方式打开该文件,其中-----BEGIN CERTIFICATE-----和-----END CERTIFICATE-----之间的内容便是公钥的base64格式字符串。

# 1.1.3 快应用签名文件中公钥的md5

注意这里的md5并不是直接对certificate.pem文件做md5。

公钥md5的生成方法:

  • 确保sign/release下面已有签名文件
  • 单击选项[Hap]
  • 选择[由证书生成MD5]
  • md5生成之后会自动复制到剪贴板,并且在[输出]窗口中打印出来

# 1.2 申请微信APP支付

请按照微信APP支付文档指引,微信公众平台或开放平台提交微信支付申请。

  • 在微信开放平台选择[移动应用],然后选择[创建移动应用]
  • 按要求填写相应的信息
  • 两个关键信息需要填写正确:
    • 应用包名填写[快应用的包名]
    • 应用签名填写[快应用签名文件中公钥的md5]
  • 创建成功申请开通微信支付能力

微信后台开通微信支付功能之后,请按照微信APP支付文档,开发对应的后台接口。

# 1.3 快应用配置文件

快应用接入APP支付需要配置参数:

// 小程序转快应用工具在 app.json文件中配置
{
    "wxpay": {
        "package": "com.your.package",
        "sign": "xxxxxxxxx"
    }
}

1
2
3
4
5
6
7
8

配置参数说明

  • package :快应用的包名
  • sign : 快应用签名文件中公钥的base64格式字符串,注意复制出来的时候需要把换行去掉,变成单行字符串

# 1.4 接口调用

参考微信APP支付文档

以及两个接口文档:

var payType = qa.getWxPaymentType()
if (payType === 'APP') {
  qa.requestWxPayment({
    //微信 app支付的prepayId
    prepayid: 'your order prepayid,eg: wx20170101abcdef1234567890',
    extra: {
      app_id: 'your app_id',
      partner_id: 'your partner_id',
      package_value: 'your package_value',
      nonce_str: 'your nonce_str',
      time_stamp: 'your time_stamp',
      order_sign: 'your order sign'
    },
    fail: function(ret) {
      console.log(`WX PAY failed, code = ${ret.errCode}`)
    },
    cancel: function() {
      console.log('WX PAY cancelled by user')
    },
    success: function() {
      console.log('WX PAY success')
    }
  })
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25

# 2. 快应用接入微信H5支付

快应用有两种接入微信H5支付的方式,目前只推荐使用referer方式,不再介绍中间页方式。如果有已按照中间页方式接入的开发者,建议转成referer方式。

# 2.1 快应用接入微信H5支付的前期准备

只需要准备[用户下单的网页域名],也就是用户最终发起支付时所在的网页域名

# 2.2 申请微信H5支付

请按照微信H5支付文档指引,微信公众平台或开放平台提交微信支付申请。

  • 在微信开放平台选择[H5应用],然后选择[创建网站应用]
  • 按要求填写相应的信息
  • 其中关键信息需要填写正确:
    • 授权域名填写[用户下单的网页域名]
  • 创建成功申请开通微信支付能力

微信后台开通微信支付功能之后,请按照微信H5支付文档,开发对应的后台接口。

# 2.3 调用开发接口

快应用接入微信H5支付不需要配置app.json参数。

调用接口的时候,referer填写的是在微信后台设置的[网页域名](商户平台--“产品中心”--“开发配置”)。

参考 微信H5支付文档

以及两个接口文档:

var payType = qa.getWxPaymentType()
if (payType === 'MWEB') {
  qa.requestWxPayment({
    // 微信网页支付的prepayId
    prepayid: 'your order prepayid,eg: wx20170101abcdef1234567890',
    referer: 'your host name configured in wechat, eg: https://www.quickapp.cn',
    extra: {
      // 需要将微信返回的MWEB_URL地址配置到这里
      mweb_url: 'https://wx.tenpay.com/cgi-bin/mmpayweb-bin'
    },
    fail: function(ret) {
      console.log(`WX H5 PAY handling fail, code = ${ret.errCode}`)
    },
    cancel: function() {
      console.log('WX H5 PAY handling cancel')
    },
    success: function(data) {
      //H5方式下,支付成功的回调仅仅只是指将订单递交给微信,并不意味着支付已经成功完成
      console.log('WX H5 PAY handling success')
    }
  })
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22

# 3. FAQ

# 问题 1 :选择微信APP支付还是微信H5支付?

微信APP支付更安全,也是微信在安卓手机上推荐的使用方式。

但不是所有支持快应用的设备都能支持APP支付,所以遇到这种设备我们也可以使用微信H5支付。

为了覆盖更多的用户,建议同时支持微信APP支付和微信H5支付。

# 问题 2 :快应用是否支持微信小程序支付?

不支持的。

已有微信小程序支付的开发者,需要申请微信APP支付或者微信H5支付才能在快应用上使用微信支付能力。

ps. 微信小程序开发者在使用转换工具将小程序转换成快应用时,需要另外接入微信APP支付/微信H5支付。

# 问题 3 :开发者是否可以指定使用微信APP支付或者微信H5支付?

开发者并不能指定使用那种微信支付方式,因为不是所有的设备都支持微信APP支付。

系统在运行时会确定当前应该使用那种微信支付方式。

开发者需要通过获取支付类型的接口来判断当前应该使用哪种微信支付产品,从而调用不同的支付代码(APP支付 or H5支付):

qa.getWxPaymentType()

# 问题 4 :快应用在运行时如何选择微信APP支付或者微信H5支付?

微信APP支付需要设备框架支持,支持快应用的设备分成两种:

  • 同时支持微信APP支付和微信H5支付的设备
  • 只支持微信H5支付的设备

快应用根据app.json是否配置微信APP支付参数,可以分成两种类型:

  • 在app.json中同时配置package和sign参数
  • 没有配置package和sign参数

实际上

如果设备支持微信APP支付,并且快应用接入了微信APP支付的情况下,系统会优先选择APP支付。

下面是不同设备环境下,系统接口返回的微信支付类型(APP指微信APP支付,MWEB指微信H5支付)的对应关系:

快应用接入方式 设备同时支持微信APP支付和微信H5支付 设备只支持微信H5支付
在app.json中同时配置package和sign参数 APP MWEB
没有配置package和sign参数 MWEB MWEB

# 其它常见问题

大部分问题都可以在微信的官方文档上找到原因,具体参考:

微信H5支付 开发步骤&常见问题

微信APP支付 接口安全规范

另外论坛上也有部分总结供参考:

微信支付接入问题解答集中帖

在线客服