小程序云开发如何实现微信支付功能

一、在微信公众平台上开通微信支付,绑定商户号

在这里插入图片描述
要完成这个步骤只需要根据提示完成,如果你是乙方,只是帮助甲方开发,那这个操作应该由甲方完成。因为这个步骤需要很多企业和法人相关的文件。在这个步骤中,需要开通微信商户平台的账号。当甲方开通好后,让他给开发人员商户平台的管理员账号,方便以后的开发。

在这里插入图片描述

二、在云开发控制台做相应的配置

在这里插入图片描述
点击添加商户号会自动提示已经绑定的商户号。添加商户号后需要分别进行帐号绑定、jsapi 和 api 退款权限授权。请注意:

  • 帐号绑定:商户号的超级管理员需要在微信支付提供的【微信支付商家助手】小程序上确认授权。

  • jsapi 和 api 退款权限,需要前往微信支付商户平台我的授权产品中进行确认授权。

完成授权后即可调用微信支付相关接口能力。

三、代码调用

微信支付的关键流程是

  1. 小程序调用云函数,在云函数中调用统一下单接口,参数中带上接收异步支付结果的云函数名和其所在云环境 ID
  2. 统一下单接口返回的成功结果对象中有 payment 字段,该字段即是小程序端发起支付的接口(wx.requestPayment)所需的所有信息
  3. 小程序端拿到云函数结果,调用 wx.requestPayemnt 发起支付
  4. 支付完成后,在统一下单接口中配置的云函数将收到支付结果通知
  async onPay(e) {
  	//outTradeNo() 是生成外部商户订单号的函数
    const outTradeNo = app.outTradeNo();
    //创建订单
    const order = await db.collection('orders').add(
      {
        data: {
          shop: {
            _id: this.data.shop._id,
            avatar: this.data.shop.avatar,
            name: this.data.shop.name,
            phone: this.data.shop.phone
          },
          money: this.data.buyed.totalPrice,
          ticket: this.data.ticket,
          address: this.data.address,
          buyed: this.data.buyed,
          deliverTime: this.data.currentTime,
          remark: this.data.remark,
          outTradeNo,
          _createTime: new Date().valueOf(),
          state: 1,
        }
      }
    )
    console.log(order._id);
    //处理支付过程,调用cloudPay云函数
    wx.cloud.callFunction({
      name: 'cloudPay',
      data: {
        body: this.data.shop.name + "-农产品",
        //totalFee付款价格,单位为“分”,只能是整数
        totalFee: new BigNumber(this.data.buyed.totalPrice).times(100).toNumber(), 
        //唯一
        noncestr: app.guid(), //这个是类似uuid()的生成方式,网上有很多现成的代码
        outTradeNo,
      },
      success: async (res) => {
        //返回的payment 是我们需要的支付信息
        const payment = res.result.payment;
        wx.requestPayment({
          ...payment,
          success: async (res) => {
            console.log('pay success', res)
            //更新订单的信息
            db.collection('orders').doc(order._id).update({
              data: { state: 2, orderTime: new Date().valueOf(), outTradeNo }
            })
            //更改商品剩余数量
            const comPromise = this.data.buyed.comList.map(item => this.comPromise(item))
            Promise.all(comPromise)
              .then(val => {
                console.log("修改商品数量", val);
              }).catch(err => console.log(err));
          },
          fail: (err) => {
            console.error('pay fail', err)
          },
          complete: () => {
            //清空本商店的购物车
            const curPages = getCurrentPages();
            this.prePage = curPages[curPages.length - 2];
            this.prePage.clearCart();
            //跳转到订单详情页面
            wx.redirectTo({
              url: '/pages/orderDetail/orderDetail?id=' + order._id,
            });
          }
        });
      }
    })
  }

cloudPay云函数
const cloud = require('wx-server-sdk')

cloud.init()

// 云函数入口函数
exports.main = async (event, context) => {
	//传过来的参数
  const { body, totalFee, nonceStr, outTradeNo } = event;
  const res = await cloud.cloudPay.unifiedOrder({
    body: body,
    outTradeNo: outTradeNo,
    nonceStr: nonceStr,
    spbillCreateIp: "127.0.0.1", //填固定ip就可以
    subMchId: "", //字商户号在云开发控制台中查看
    totalFee: totalFee,
    envId: "test-dev-cbt0b6c1e82",
    functionName: "pay_cb", //这个云函数需要自己创建,里面可以什么都不做
    tradeType: "JSAPI"
  })
  return res
}
outTradeNo函数

这个函数可以自己自由编写,只要保证唯一性就可以,以下列出代码。

  outTradeNo() {
    const date = new Date();
    let month = date.getMonth() + 1
    if (month < 10) {
      month = '0' + month;
    }
    let dates = date.getDate();
    if (dates < 10) {
      dates = '0' + dates;
    }
    let hour = date.getHours();
    if (hour < 10) {
      hour = '0' + hour;
    }
    let minute = date.getMinutes();
    if (minute < 10) {
      minute = '0' + minute;
    }
    let seconds = date.getSeconds();
    if (seconds < 10) {
      seconds = '0' + seconds;
    }
    let milliscondes = date.getMilliseconds();
    if (milliscondes < 10) {
      milliscondes = '00' + milliscondes;
    } else if (milliscondes < 100) {
      milliscondes = '0' + milliscondes;
    }
    //上面是时间格式化
    //下面加上五个随机数,这样的话可以确保不重复。
    let outTradeNo = '';
    for (let i = 0; i < 5; i++) {
      outTradeNo += Math.floor(Math.random() * 10);
    }
    outTradeNo = "WH" + date.getFullYear() + month +
      dates + hour + minute + seconds + milliscondes + outTradeNo;
    console.log(outTradeNo);
    return outTradeNo;
  },

到此为止云开发的微信支付功能就实现了。调起支付后,用自己的微信账号支付会收到微信支付的通知。微信支付在技术上是非常简单的,但是开通需要的资料很多,并且仅支持企业、个体工商户、政府及事业单位等组织的开通。

  • 1
    点赞
  • 24
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值