小程序支付流程

微信支付

作微信支付有一段時間了，在作微信支付時遇到不少坑，好比code失效，code已使用、微信受權code獲取不到的問題等，今天有時間梳理一下流程，其實下面流程官網都有詳解，在這我只是簡單梳理一下畢竟是小白，解釋一下本身遇到的一些問題，但願你們不要噴我~_~。

一、首先開通微信支付，即申請或複用微信支付商戶號 申請完小程序後，登陸小程序後臺（mp.weixin.qq.com）。點擊左側導航欄的微信支付，在頁面中進行開通。（開通申請要求小程序已發佈上線）

二、點擊開通按鈕後，有2種方式能夠獲取微信支付能力，新申請微信支付商戶號或綁定一個已有的微信支付商戶號，請根據你的業務須要和具體狀況選擇，只能二選一。開通指引：kf.qq.com/faq/140225M…

業務流程

商戶系統和微信支付系統主要交互：

一、小程序內調用登陸接口，獲取到用戶的openid,api參見小程序登陸API

二、商戶server調用支付統一下單，api參見統一下單API

三、商戶server調用再次簽名，api參見再次簽名

四、商戶server接收支付通知，api參見支付結果通知API

五、商戶server查詢支付結果，api參見查詢訂單API

支付流程

後臺流程圖

前端流程

• 點擊當即支付先建立訂單生成訂單編號
• （第二次之後再次使用）先判斷本地的OpenId是否有效，有效的話直接請求加簽接口，無效則從新登陸
• 經過 wx.login() 接口得到臨時登陸憑證 code 後傳到開發者服務器調用此接口完成登陸流程。
• 拿到code請求後臺接口獲取OpenId並存到本地
  
• 拿到OpenId請求後臺加簽接口並喚起微信支付

注意: 調用 auth.code2Session 接口，換取 用戶惟一標識 OpenID 和 會話密鑰 session_key。

該接口應在服務器端調用。 連接：auth.code2Session

接下來貼代碼

// 一、獲取code
getlogin() {
  let _this = this;
  wx.login({
    success: function (res) {
      if (res.code) {
        //發起網絡請求
        console.log(res.code)
        // 簽名校驗以及數據加解密涉及用戶的會話密鑰 session_key。 開發者應該事先經過 wx.login 登陸流程獲取會話密鑰 session_key 並保存在服務器。爲了數據不被篡改，開發者不該該把 session_key 傳到小程序客戶端等服務器外的環境。
        _this.gtOpenid(res.code);
      } else {
        console.log('獲取用戶登陸態失敗！' + res.errMsg)
      }
    }
  });
}
複製代碼

// 二、獲取openid
async gtOpenid(_c){
  let _data = {
    code: _c,
  }
  let obj = await gtopenid(_data);
  if(obj.openid){
    // 三、代金券加簽接口
    this.getBuyCashCoupon(obj.openid)
    this.$apply()
  } else {
    if (obj.errcode == 40125) {
      wx.hideToast({
        title: 'appsecret失效',
        icon: 'fail',
        duration: 2000
      })
    }
  }
}
複製代碼

// 三、代金券加簽 並喚起微信支付
async getBuyCashCoupon(openid) {
      let _this = this;
      let params = {
        memberId: wx.getStorageSync('memberId'),
        mallId: wx.getStorageSync('mall').mallId,
        sellerId: this.detail.sellerId,
        orderType: '3', // 1普通訂單 2停車繳費3代金券訂單
        paymentMethod: '2', // 1支付寶 2微信
        oppenId: openid,
        serviceVersion: this.$parent.globalData.serviceVersion,
        // couponCode: this.detail.couponCode,
        poolId: this.detail.couponPoolId,
      }
      let res = await buyCashCoupon(params)
      // 返回訂單編號以及喚起微信支付須要的參數
      if (res.resultCode == 200){
        let paySignObj = res.resultInfo.paySign
        this.orderFormNumber = res.resultInfo.orderFormNumber
        wx.requestPayment({
          appId: paySignObj.appid,          // 小程序ID
          timeStamp: paySignObj.timestamp,  // 時間戳
          nonceStr: paySignObj.noncestr,    // 隨機串不長於32位。
          package: paySignObj.prepayid,     // 統一下單接口返回的 prepay_id 參數值，提交格式如：prepay_id=wx2017033010242291fcfe0db70013231072
          signType: 'MD5',                  // 簽名類型，默認爲MD5，支持HMAC-SHA256和MD5。注意此處需與統一下單的簽名類型一致
          paySign: paySignObj.sign,         // 簽名
          success(res) { 
            // 調用支付成功
            wx.navigateTo({
              url: './paysuccess?type=1&resultMoney='+_this.detail.couponPrice+'&voucher=1'
            })
          },
          fail(res) { 
            // 用戶取消支付 | 調用支付失敗，其中 detail message 爲後臺返回的詳細失敗緣由
            _this.isDisabled = false
            _this.getupdateOrderStatus(_this.orderFormNumber)
          }
        })
        this.$apply()
    } else {
        wx.showModal({
          title: '提示',
          content: res.resultMsg
        })
    }
}
複製代碼

結尾

目前我是這樣作的 有問題 但願你們留言指出， 我會及時回覆。謝謝！