微信小程序支付實現流程


基本流程

用戶操作流程

image

小程序流程

image

整體支付流程

image

代碼實現

創建訂單

創建訂單,主要是前端將訂單的信息提交到后端。但是在創建訂單之前還有一些准備工作要做:

  1. 獲取用戶數據GetUserInfo
  2. 獲取用戶授權,獲得token
  3. 創建訂單

使用buttongetUserInfo 獲得的用戶信息,再使用wx.login(Object object)得到code(用戶登錄憑證),session_key,獲得后就可以在后台下發token用以對用戶操作進行驗證。

登錄流程時序:
image

bindGetUserInfo的回調方法返回的參數示例:

encryptedData: "NC9d+PEDLe6SPdjskdlfjslkjdfsljflksdjfklsdjfsdqwqz"
errMsg: "getUserInfo:ok"
iv: "2fNiyg133zyP5X9hOHS6Og=="
rawData: "{"nickName":"1024","gender":1,"language":"zh_CN","city":"","province":"","country":"Croatia","avatarUrl":"https://thirdwx.qlogo.cn/mmopen/vi_32/Q0j4TwGTfTIradvotK0Q7XAK7bs06ZZidHLxdlscmaZZXwQrr5S7hhNS98CB2p4kL5nWuohlQel1vm2X2kFygozA/112"}"
signature: "d4d9c2cff76bd348f1d9125216b53c7493e11da4"
const { encryptedData, rawData, iv, signature } = e.detail;
const { code } = await login();
const loginParams = { encryptedData, rawData, iv, signature, code };

// 將小程序端拿到的用戶信息提交到后端
// 后端調用微信的auth.code2Session接口
// 就能獲得openid,session_key,unionid等內容
// 用以預付單的創建,及安全驗證
const {token} = await request({ url: "/users/wxlogin", data: loginParams, method: "post" });

獲取token后將其添加在請求頭的Authorization字段中。然后發送請求,后端程序將訂單內容保存,然后將進行預支付。

// orderParams 中是訂單商品信息
const header = { Authorization: token }
const { order_number } = await request({ url: "order/submit", method: "POST", data: orderParams, header})

wx.login()
auth.code2Session

預支付

此時小程序端將訂單編號發送給后端預支付接口,然后接口將會返回必要的支付參數。

// 發起預支付接口 添加content-type才能成功
const { pay } = await request({ url: "/my/orders/req_unifiedorder", method: "POST", data: { order_number }, header: { "content-type": "application/x-www-form-urlencoded" } });

此時后端服務器,會先判斷訂單是否是待支付的狀態,若是則需要將以下參數提交到
image
統一下單接口:https://api.mch.weixin.qq.com/pay/unifiedorder
參數說明:接口參數說明
請求微信下單接口成功后,則會返回prepay_id,可以進行封裝后,返回后續支付要的參數。

java隨機數生成:

// 獲取隨機字符
public static String getRandomNum(Integer num) {
        String base = "0123456789";
        Random random = new Random();
        StringBuffer sb = new StringBuffer();
        for (int i = 0; i < num; i++) {
            int number = random.nextInt(base.length());
            sb.append(base.charAt(number));
        }
        return sb.toString();
    }

String randomStr = getRandomNum(18).toUpperCase();

簽名生成的通用步驟如下:

第一步,設所有發送或者接收到的數據為集合M,將集合M內非空參數值的參數按照參數名ASCII碼從小到大排序(字典序),使用URL鍵值對的格式(即key1=value1&key2=value2…)拼接成字符串stringA。

特別注意以下重要規則:

◆ 參數名ASCII碼從小到大排序(字典序);
◆ 如果參數的值為空不參與簽名;
◆ 參數名區分大小寫;
◆ 驗證調用返回或微信主動通知簽名時,傳送的sign參數不參與簽名,將生成的簽名與該sign值作校驗。
◆ 微信接口可能增加字段,驗證簽名時必須支持增加的擴展字段
第二步,在stringA最后拼接上key得到stringSignTemp字符串,並對stringSignTemp進行MD5運算,再將得到的字符串所有字符轉換為大寫,得到sign值signValue。 注意:密鑰的長度為32個字節。

◆ key設置路徑:微信商戶平台(pay.weixin.qq.com)-->賬戶設置-->API安全-->密鑰設置

Java簽名工具類:

public static String arraySign(Map < Object, Object > params, String paySignKey)
{
    boolean encode = false;
    Set < Object > keysSet = params.keySet();
    Object[] keys = keysSet.toArray();
    Arrays.sort(keys);
    StringBuffer temp = new StringBuffer();
    boolean first = true;
    for(Object key: keys)
    {
        if(first)
        {
            first = false;
        }
        else
        {
            temp.append("&");
        }
        temp.append(key).append("=");
        Object value = params.get(key);
        String valueString = "";
        if(null != value)
        {
            valueString = value.toString();
        }
        if(encode)
        {
            try
            {
                temp.append(URLEncoder.encode(valueString, "UTF-8"));
            }
            catch(UnsupportedEncodingException e)
            {
                e.printStackTrace();
            }
        }
        else
        {
            temp.append(valueString);
        }
    }
    temp.append("&key=");
    temp.append(paySignKey);
    System.out.println(temp.toString());
    String packageSign = MD5.getMessageDigest(temp.toString());
    return packageSign;
}
String sign = arraySign(parame, "商戶key");

發起支付

使用wx.requestPayment(OBJECT)發起支付

// 發起微信支付
wx.requestPayment(pay)

需要參數如下,在請求預支付接口后由服務端返回:
image

查詢訂單

請求后端的查詢接口,進行查詢:

// 查詢訂單狀態
const res = await request({ url: "/my/orders/chkOrder", method: "POST", data: { order_number } });

微同商城支付邏輯分析

image

參考和補充

  1. 微信支付開發文檔
  2. 微同商城Gitee
  3. 微信小程序登錄換取token
  4. 微信小程序登錄 + 基於token的身份驗證


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM