在Taro項目中Ping++ 接入微信小程序支付

相關ping++支付文檔：

https://help.pingxx.com/article/1011655/

源碼的地址：

 https://github.com/PingPlusPlus/pingpp-js

一、在項目中引入ping++的sdk

可以使用npm 的安裝方式

npm install pingpp-js

在頁面的頂部引入

let pingpp = require('pingpp-js');

二、使用

1、需要獲取到code

2、提交訂單數據，成功生成預支付訂單後，返回chrage參數集合

chrage 的參數集合字段說明文檔：https://www.pingxx.com/api/Charges%20%E6%94%AF%E4%BB%98%E6%A6%82%E8%BF%B0.html

3、把charge傳給 pingpp.createPayment（）

示例代碼：

    // 提交訂單需要的一些參數
    const sendValues = { ...toPostorderData};
    // sendValues.shopCarIds = JSON.stringify(shopCarIds); // 購物車id  
    sendValues.personAddressId = selectAddress.personAddressId; //用戶地址id
    sendValues.couponId = couponData.couponId || '';  //優惠券id  couponData.couponId
    sendValues.personLeaveMsg = personLeaveMsg || ''; // 訂單備註
    sendValues.payType = payType; // 支付類型（wx_lite：微信支付，zfb：支付寶   現在僅用微信
    sendValues.personPhysicistId = JSON.stringify(pickselectgather) || [];//量體數據  
    sendValues.isUseBalanceStr = 0; //是否使用餘額（0否，1是）
    sendValues.cardBalanceId = 0; //購買卡券表id, 需要跟UI 是否有選卡券
    

    // 獲取code
    Taro.login({
      success: function(res) {
        if (res.code) {
          console.warn('code', res.code)
        } else {
          console.log('獲取用戶登錄態失敗', res.errMsg);
        }
      }
    }).then(res => {
      console.warn('then code', res.code)
      // 獲取返回的code 塞進將要生成預支付訂單的接口
      sendValues.wxCode = res.code;
      console.warn('sendValues', sendValues)
      this.props.dispatch({
        type: 'shopCart/fetchOrderImmediately', 
        payload: {
          ...sendValues
        }        
      }).then((res) => {
        console.warn('下單返回的chrage 數據res', res);
        const { charge } = res.resultData;
        // 把chrage參數直接塞進函數
        pingpp.createPayment(charge, function(result, err) {
          if (result=="success") {
            console.warn("success",result);
            // Taro.showModal({
            //   title: '調用ping++支付成功', 這裏做支付成功後的操作
            // })
          } else {
            console.warn(result+" "+err.msg+" "+err.extra);
            // Taro.showModal({
            //   title: '調用ping++支付失敗'， 這裏做支付失敗後的操作
            // })
          }
        })
      }

三、成功接入ping++支付的效果圖（掃描即可驗證支付）