Taro/JS/H5/小程序：解决小程序微信支付统一下单和调起支付

这个文章不会说具体0到1的代码流程，我会着重讲几个问题的解决

支付主要遇到的问题如下：

1.获取openid

2.统一下单，拿到预单号（我起的，全名叫预支付交易会话标识）

3.调起支付

4.支付后的处理

1.获取openid很简单，调用Taro.login()拿到code，传给后端获取openid，这个必须后端拿

2.统一下单的几个问题：

大概需要这么些必填参数：

{
            appid: '', // appid
            mch_id: '',  // 商户id
            nonce_str:'', // 随机字符串
            body: '', // 商品简单描述
            out_trade_no:  '', // 商户系统内部订单号，唯一
            total_fee: '', // 订单总金额，单位为分
            spbill_create_ip:  '', // 你的ip，要后端传给你
            notify_url: '', // 通知地址，微信调的，告诉你支付的情况
            trade_type: 'JSAPI', 
            openid: '' 
}

①随机字符串

②签名

③XML的组装与解析

①

export function randomString(len = 32) {
    const chars = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890';
    const maxPos = chars.length;
    let pwd = '';
    for (let i = 0; i < len; i++) {
        pwd += chars.charAt(Math.floor(Math.random() * maxPos));
    }
    return pwd;
}

②

准备一个参数如下

const params = {
    appid: '', 
    mch_id: '', 
    nonce_str:randomString(32),
    body: '',
    out_trade_no:  '',
    total_fee: '',
    spbill_create_ip:  '',
    notify_url: '',
    trade_type: 'JSAPI',
    openid: ''
}

签名：

const sign = signFunc(params)
        params.sign = sign

签名函数

export function signFunc(data) {
    // 1.对key字典排序
    const sortArr = Object.keys(data).sort()

    // 2.转URL键值对
    // const qsString = stringify(sortObj)
    let qsString = ''
    sortArr.map((t, index) => {
        if (index === 0) {
            qsString = `${t}=${data[t]}`
        } else {
            qsString = `${qsString}&${t}=${data[t]}`
        }
    })

    // 3.拼接string+key
    const stringSignTemp = qsString + `&key=${key}`

    // 4.MD5签名
    const sign = md5(stringSignTemp).toUpperCase()

    return sign
}

注意，我注释的那句，是一个叫做qs的npm库提供，不要用它对参数生成 URL键值对，因为

③

Taro/JS/H5/小程序：解决小程序微信支付统一下单和调起支付

猜你喜欢