微信小程序支付流程

1. 用户发起支付请求

在小程序界面上，用户选择商品或服务，点击支付按钮。

2. 前端（小程序）登录并准备支付参数

1. 调用 wx.login 获取 code。
2. 将 code 发送到后端，获取 openid 和 session_key（如果还未获取）。
3. 准备商品订单信息，如商品描述、价格、数量等。后面会传送给后端。

// 用户点击支付按钮  
onPayButtonClick() {
    // 准备订单信息，调用后端接口发起支付请求
    let orderInfo = {};
    this.wxLogin(orderInfo);
},

// 调用 wx.login 获取 code（如果还未获取）
wxLogin(orderInfo) {
	let that = this;
    wx.login({
        success: (res) => {
            if (res.code) {
                // 发送 code 到后端获取 openid 和 session_key
                wx.request({
                    url: 'https://xxxxxx/api/get-openid',
                    data: {
                        code: res.code
                    },
                    success: (res) => {
                        // 获取到 openid 和 session_key（如果需要的话）
                        // that.handlePayment(orderInfo)  // 第四步
                    }
                });
            } else {
                console.log('登录失败！' + res.errMsg);
            }
        }
    });
}

3. 后端（服务器）处理支付请求，并返回支付参数给前端

1. 验证用户身份（可以使用 openid 和 session_key）。
2. 生成订单，保存订单信息到数据库。
3. 调用微信支付统一下单API，获取prepay_id 和其他支付参数。
4. 将 prepay_id、nonceStr（随机字符串）、package（统一下单接口返回的 prepay_id 参数值，提交格式如：prepay_id=***）、signType（签名方式）、timeStamp（时间戳）等必要的支付参数返回给前端。

4. 前端（小程序）调用微信支付

前端调用 wx.requestPayment API 发起支付请求，传入后端返回的支付参数

// 创建订单并发起支付请求
handlePayment(orderInfo) {
    wx.request({
        url: 'https://xxxxx/api/create-order',
        method: 'POST',
        data: {
            orderInfo // 订单信息，如商品ID、数量、价格等
        },
        success: (orderRes) => {
            // 获取到支付参数
            const payment = orderRes.data;
            // 调用微信支付
            wx.requestPayment({
                provider: 'wxpay',
                timeStamp: payment.timeStamp,
                nonceStr: payment.nonceStr,
                package: payment.package,
                signType: payment.signType,
                paySign: payment.paySign,
                success: function (res) {
                    // 支付成功后的回调函数
                },
                fail: function (res) {
                    // 支付失败后的回调函数
                }
            });
        }
    });
},

5. 用户完成支付

用户在小程序内完成支付操作

6. 微信支付平台通知后端

• 微信支付平台会向后端服务器发送支付结果通知。
• 后端服务器需要验证通知的合法性，并更新订单状态。

7. 后端通知前端支付结果（可选）

后端可以根据需要，将支付结果通知前端，前端更新界面状态。