接入文档

更新日志

安装

复制xpay整个文件夹到工程里面，并保持xpay目录存在

准备

在app.ux 中加入

    import xpay from './xpay/xpay'
    export default {
      xpay: xpay
    }

在manifest.json中加入，并调整下微信支付的相关参数

• package 微信支付后台中注册的应用包名，需要和 rpk 中的包名保持一致
• sign 微信支付后台注册时提交的 apk 的签名的 Base64 编码，该 apk 签名证书需要和 rpk 的签名证书保持一致
• url 请配置成 http://xpay-h5.wfipay.com/xpay-h5-static/f9zP5E6C/#/xpay-wechat-page

    "features": [
    { "name": "system.prompt" },
    { "name": "system.router" },
    { "name": "service.alipay" },
    { "name": "system.fetch" },
    { "name": "system.package" },
    {
      "name": "service.wxpay",
      "params": {
        "package": "xxxx",
        "sign": "abcdefg",
        "url": "http://xpay-h5.wfipay.com/xpay-h5-static/f9zP5E6C/#/xpay-wechat-page"
      }
    }
    ...
    "pages": {
      "xpay/xpaySdkWalletResult":{
        "component": "index"
      },
      "xpay/xpaySdkWechatResult":{
        "component": "index"
      },
      "xpay/xpaySdkResult":{
        "component": "index"
      },
      //如果需要单独的支付页面，加入下面这个，否则忽略这个页面
      "xpay/xpaySdkDetail":{
        "component": "index"
      }
      ...
   }

微信支付 sign生成 官方文档地址

主要是在manifest.json中声明wxpay这个feature是填上走微信后台注册流程时用到的包名和签名 这里填的签名需要使用快应用的工具获取，获取的方法和微信的工具一致，但是得到值和微信的不一样，不要和微信的签名混淆．

设置生产\测试环境 (默认生产环境)

this.$app.$def.xpay.setDebug(true/false  测试/生产)

唤起收银台

支付收银台页面样式

    this.$app.$def.xpay.pay(payParam, 'com.application.demo', undefined, function(payStatus, msg){
        //处理返回结果
        //const PAY_SUCCESS = 1
        //const PAY_CANCEL = 0
        //const PAY_ERROR = -2
        //const PAY_INVALID = -1
        //const PAY_CANCEL_BACK = -3
        //const PAY_RESULT_DONE = 11  同时msg可能是：支付成功，支付中，支付失败，支付已关闭，订单异常
    })

    payParam 具体内容，见下面定义
    com.application.demo 为快应用的包名
    pickerData undefined

弹框样式

• 在需要弹框的页面导入

<import name="xpay-sdk-picker" src="../xpay/xpaySdkDetail/xpaySdkPicker"></import>

• 在需要弹框的页面添加属性

pickerData: {
    visible: '0',
    background: 'rgba(0,0,0,0.1)',
    payModel: '{}',
    packageName: ''
}

• 在template中添加

<xpay-sdk-picker visible="{{pickerData.visible}}"
  background="{{pickerData.background}}" pay-model="{{pickerData.payModel}}" package-name={{pickerData.packageName}} @qui-overlay-click="overlayClick"></xpay-sdk-picker>

• 显示弹框

this.$app.$def.xpay.pay(payParam, 'com.application.demo', that.pickerData, function(payStatus, msg){
        //处理返回结果
        //const PAY_SUCCESS = 1
        //const PAY_CANCEL = 0
        //const PAY_ERROR = -2
        //const PAY_INVALID = -1
        //const PAY_CANCEL_BACK = -3
        //const PAY_RESULT_DONE = 11  同时msg可能是：支付成功，支付中，支付失败，支付已关闭，订单异常
})

payParam 具体内容，见下面定义
com.application.demo 为快应用的包名
pickerData 步骤1中的数据

• 点击蒙层消失

overlayClick(){
    this.pickerData.visible = '0'
}

无UI版本

//Step1 
//payParam 具体内容，见下面定义
//payPage 为支付结果页，点击确认需要跳转的目的地

this.$app.$def.xpay.silentPay(JSON.stringify(payParam), payPage, function(payStatus, msg){
//处理全局返回结果
        //const PAY_SUCCESS = 1
        //const PAY_CANCEL = 0
        //const PAY_ERROR = -2
        //const PAY_INVALID = -1
        //const PAY_CANCEL_BACK = -3
        //const PAY_RESULT_DONE = 11  同时msg可能是：支付成功，支付中，支付失败，支付已关闭，订单异常
    }, function(payStatus, msg){
    //处理获取渲染数据的返回结果
    //0 请求成功,msg 为step2 中的payModel
    //-1 请求失败，msg为错误信息
    }
})

//Step2
//payModel 为step1 中的返回结果
//传入的this，需要赋值下  this.packageName = "" 为快应用的包名

//微信支付：this.$app.$def.xpay.useWechatPay(this, this.payModel)
//支付宝支付：this.$app.$def.xpay.useAliPay(this.payModel)
//钱包支付： this.$app.$def.xpay.useWifiPay(this, this.payModel)

payParam

payBizData

payBaseData

Example

{
    "payBizData": {
        "pay_token": "",
        "sign": "...",
        "out_trade_id": "",
        "transaction_id": "",
        "security_type": "RSA"
    },
    "payBaseData": {
        "appid": "",
        "out_user_id": "",
        "request_id": "",
        "version": "2",
        "service_name": "paymentAccessRequest",
        "client_user_id": "",
        "platform": "Quick App",
        "time_stamp": "",
        "language": 0,
        "compress_type": "0",
        "merchant_id": "",
        "guest_id": ""
    }
}

tips

• 小米手机上遇到deeplink回调，会出现缓存的情况，重启手机解决。
• 微信h5支付开通流程
  • 申请微信支付，并开通h5支付
    • 授权域名填写
      • xiaoyiads.com
  • 申请服务号，完成认证
  • 微信支付后台，绑定服务号appid
  • 提供 服务号appid，微信商户merchantid，微信商户 api_key