微信小程序用云开发实现微信支付

343 阅读2分钟

1.前提环境

微信商户平台上注册商户号,在微信公众平台上进入小程序管理后台,绑定小程序的商户号。

2.开通云开发

在微信开发者工具中打开云开发控制台,根据提示开通云开发,并且创建一个新的云开发环境。

3.小程序接入云开发

在app.js中初始化云开发环境连接

//app.js
App({
  onLaunch: function () {
    wx.cloud.init({
      env:"环境id"
    })
  }
})

在project.config.json中指定本地已存在的目录作为云开发的本地根目录

"cloudfunctionRoot":"/cloud",

在项目中创建cloud文件夹,此时云开发根目录(cloud文件夹)的图标会变成 “云开发图标”

右键cloud文件夹选择新建Node.js云函数,输入云函数名称后会生成该云函数的文件夹目录。

4.编写微信支付代码

在云函数的文件夹下的index.js中编写云函数代码,调用云开发的微信支付接口,详情api见官方文档

// 云函数代码
const cloud = require('wx-server-sdk')
cloud.init({
  env: cloud.DYNAMIC_CURRENT_ENV
})

exports.main = async (event, context) => {
  const res = await cloud.cloudPay.unifiedOrder({
    "body" : event.body,//商品名称
    "outTradeNo" : event.outTradeNo,//订单号 在同一个商户号下保持唯一
    "spbillCreateIp" : "127.0.0.1",
    "subMchId" : "1900009231",//商户号 必须为小程序绑定的商户号
    "totalFee" : event.totalFee,//支付金额(分)
    "envId": "你的云开发环境id",
    "functionName": "pay_cb"//结果通知回调云函数名
  })
  return res
}

右击云函数文件夹选择上传并部署(云端安装依赖),右上角会弹出上传成功的提示,此时打开云开发控制台,可以看到刚刚上传的云函数 

云函数完成后就可以写小程序调用代码即可实现微信支付。

wx.cloud.callFunction({
            name: 'paytest',
            data: {
                outTradeNo:id,//订单号保持唯一
                body:'商品名称',
                totalFee:1,
            },
            success: res => {
                console.log("获取支付参数成功",res)
                const payment = res.result.payment
                wx.requestPayment({
                    ...payment,
                    success (res) {
                        console.log('支付成功', res)
                    },
                    fail (res) {
                        console.error('支付失败', res)
                    }
                })
            },
            fail: res => {
                console.log("获取支付参数失败",res)
            },
        })