Best practice丨Use cloud function + cloud call to realize WeChat payment in four steps

Overview

WeChat payment is one of the WeChat ecological capabilities natively supported by cloud development. Developers only need to simply call the corresponding functions to complete the entire payment process, which is safe and efficient. Some advantages include:

• No need to care about certificates and signatures, and the payment process is simplified;
• Based on WeChat private protocol and private link, it is more secure and efficient;
• Free operation and maintenance, high availability;
• Expansion on demand, flexible expansion, billing according to quantity, cost reduction;
• Support accepting payment callbacks through cloud functions, without the need to build callback services.

Process comparison: traditional process vs cloud development

Code example

Step 1: The applet calls cloud functions

After the C-side user initiates the payment process, the applet side calls the cloud function (here, assume that the cloud function is named makeOrder ):

// 小程序代码
wx.cloud.callFunction({
  name: "makeOrder",
  data: {
    /* 开发者自定义参数 */
  }
});

Step 2: Cloud function generates order and returns order information

After the cloud function makeOrder receives the call, it uses the API provided by the WeChat server SDK to generate an order directly without a certificate and signature.

After the order is generated, the CloudPay.unifiedOrder() unified order interface is used to return the order information to the applet.

CloudPay.unifiedOrder() interface documentation:

https://developers.weixin.qq.com/miniprogram/dev/wxcloud/reference-sdk-api/open/pay/CloudPay.unifiedOrder.html

// 云函数 makeOrder
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: "小秋TIT店-超市",
    outTradeNo: "1217752501201407033233368018",
    spbillCreateIp: "127.0.0.1",
    subMchId: "1900009231",
    totalFee: 1,
    envId: "test-f0b102",
    functionName: "payCallback" // 支付回调的函数名
  });
  return res;
};

Step 3: Initiate payment on the applet

After receiving the order information returned by the cloud function, the applet initiates a payment:

// 小程序代码
wx.cloud.callFunction({
  name: "makeOrder",
  data: {
    /* 开发者自定义参数 */
  },
  success: (res) => {
    // 取得云函数返回的订单信息
    const payment = res.result.payment;
    // 调起微信客户端支付
    wx.requestPayment({
      ...payment,
      success(res) {
        /* 成功回调 */
      },
      fail(res) {
        /* 失败回调 */
      }
    });
  }
});

Step 4: Use cloud functions to receive payment callbacks and complete the payment process

After the user completes the payment, the WeChat background will call the specified cloud function (here assumed to be called payCallback), and the incoming parameters will contain the order information.

Developers can implement their own delivery and order fulfillment logic in this cloud function.

// 云函数 payCallback
exports.main = async (event, context) => {
  const {
    return_code, // 状态码
    appid, // 小程序 AppID
    mch_id, // 微信支付的商户号
    device_info, // 微信支付分配的终端设备号
    openid, // 用户在商户appid下的唯一标识
    trade_type, // 交易类型：JSAPI、NATIVE、APP
    bank_type // 银行类型
    // ......
    // 更多参数请参考：https://pay.weixin.qq.com/wiki/doc/api/jsapi.php?chapter=9_7&index=8
  } = event;

  /*
    开发者自己的逻辑
  */

  // 向微信后台返回成功，否则微信后台将会重复调用此函数
  return { errcode: 0 };
};

Related documents:

Cloud function documentation:

https://docs.cloudbase.net/cloud-function/introduce.html

Cloud call document:

https://developers.weixin.qq.com/miniprogram/dev/wxcloud/guide/openapi/openapi.html

wx-server-sdk document:

https://developers.weixin.qq.com/miniprogram/dev/wxcloud/reference-sdk-api/Cloud.html

CloudPay.unifiedOrder() interface documentation:

https://developers.weixin.qq.com/miniprogram/dev/wxcloud/reference-sdk-api/open/pay/CloudPay.unifiedOrder.html