小程序微信支付的流程圖：

1. 登錄微信公眾平臺(tái), 開通微信支付功能

這是準(zhǔn)備工作的第一步, 確保小程序?qū)?yīng)的支付功能已經(jīng)開啟

2. 登錄微信商戶平臺(tái)

該步驟需要獲取兩個(gè)參數(shù), 一個(gè)是商戶號(hào), 一個(gè)是支付秘鑰, 如下圖所示

---

注意秘鑰自己要保護(hù)好,相當(dāng)于支付密碼,每次簽名都需要該參數(shù), 該參數(shù)只能設(shè)置的時(shí)候看得見,其余的時(shí)候是沒法看得見.所以要記好了!

3. 準(zhǔn)備完畢,上代碼

微信小程序的商戶系統(tǒng)一般是以接口的形式開發(fā)的，小程序通過調(diào)用與后端約定好的接口進(jìn)行參數(shù)的傳遞以及數(shù)據(jù)的接收。在小程序支付這塊，還需要跟微信服務(wù)器進(jìn)行交互。過程大致是這樣的：

一、小程序調(diào)用wx.login() 獲取code，傳遞給商戶服務(wù)器用來獲取用戶的openID

我們知道在微信平臺(tái)中，同一個(gè)公眾號(hào)的openID都是不同的，它是用戶身份識(shí)別的id，也就是說，我們通過openID來區(qū)分不同的用戶，這個(gè)有微信開發(fā)基礎(chǔ)的應(yīng)該都很熟悉。為了知道誰在支付，我們需要先獲取當(dāng)前用戶的openid，那么openID應(yīng)該怎么獲取呢？看下圖：

小程序調(diào)用wx.login() 獲取 臨時(shí)登錄憑證code ，并回傳到開發(fā)者服務(wù)器。
開發(fā)者服務(wù)器以code換取 用戶唯一標(biāo)識(shí)openid 和 會(huì)話密鑰session_key。

看不懂嗎？不急，聽我慢慢解釋，這個(gè)業(yè)務(wù)流程大致就是首先你得先在小程序的代碼中調(diào)用wx.login()來向微信獲取到code，拿到了之后把code通過request傳給商戶服務(wù)器，再由商戶服務(wù)器通過騷操作來跟微信服務(wù)器要session_key和openID。

代碼如下（小程序端）：

getToken: function () {
    //調(diào)用登錄接口
    wx.login({
      success: function (res) {
        var code = res.code;
        wx.request({
          url: 商戶服務(wù)器接口地址, 
          data: {
            code: code
          },
          method: 'POST', 
          success: function (res) { 
            wx.setStorageSync('token', res.data.token); //存在小程序緩存中
          },
          fail: function (res) {
            console.log(res.data);
          }
        })
      }
    })
  }

調(diào)用這幾行代碼就可以向跟微信服務(wù)器要code，并且將code傳到商戶服務(wù)器中，記住這里最好使用post發(fā)送請(qǐng)求，安全性的東西我應(yīng)該不用講了，因?yàn)楸苊馄渌藶E用接口，于是我們使用token來進(jìn)行驗(yàn)證。并將商戶服務(wù)器返回的token存在小程序緩存中。

那么服務(wù)器端應(yīng)該怎么做呢？

我門通過小程序提交的code，和小程序的APPID以及APPSECRET和拼接下列的url，并用curl進(jìn)行g(shù)et請(qǐng)求。
https://api.weixin.qq.com/sns/jscode2session?appid=APPID&secret=SECRET&js_code=JSCODE&grant_type=authorization_code
返回的數(shù)據(jù)是一個(gè)json對(duì)象，我門通過使用json_decode(JSON,true)解析為數(shù)組，數(shù)據(jù)包括用戶的openID以及session_key，獲取到了后我們應(yīng)該將openID存入數(shù)據(jù)庫中，它代表著用戶的身份，那么令牌應(yīng)該怎么生成呢。

二.token的生成以及緩存
我們根據(jù)一個(gè)用戶表將id和openid聯(lián)系起來，對(duì)應(yīng)openID的id則是用戶的uid，我們可以這么封裝

//要緩存的數(shù)據(jù)數(shù)組
$cacheValue = $result;   //包含openID和session_key
$cacheValue['uid'] =$uid;   //用戶id
 
$cacheValue['scope'] =ScopeEnum::User;   //用戶權(quán)限級(jí)別

緩存的方式我們可以選擇redis，memcache， 文件緩存等等，采用鍵值對(duì)（key-value）的方式進(jìn)行存儲(chǔ),記得設(shè)置好過期時(shí)間。這里的key我們用token來賦值，token可以通過這樣的方式進(jìn)行生成：

//獲取32位隨機(jī)字符串
$str = getRandChar(32);   //自定義方法生成32位隨機(jī)串
//三組字符串進(jìn)行md5加密
$timeStamp =$_SERVER['REQUEST_TIME_FLOAT'];
//salt
$salt = config('secure.token_salt'); //隨機(jī)字符串
//返回token
 
return md5($str.$timeStamp.$salt);

這種算法基本保障了token的唯一性。因?yàn)橹凳俏覀儷@取到的openID和session_key所在的數(shù)組，所以需要將數(shù)組轉(zhuǎn)成json才能存進(jìn)去。以后的代碼當(dāng)我們需要openID或者uid等時(shí)可以直接通過取緩存的方式來取。

三，調(diào)用統(tǒng)一下單接口，獲取prepay_id,再次簽名(后端完成，不詳解)

四，小程序獲取五個(gè)參數(shù)后，鑒權(quán)調(diào)起支付

  pay: function () {
    var token = wx.getStorageSync('token');
    var that = this;
  
    wx.request({
      url: baseUrl + '/order',
      header: {
        token: token
      },
      data: {   //產(chǎn)品的數(shù)據(jù)
        products:
        [
          {
            product_id: 1, count: 1
          },
          
          {
            product_id: 2, count: 1
          }
        ]
      },
      method: 'POST',
      success: function (res) {
        console.log(res.data);
        if (res.data.pass) {
          wx.setStorageSync('order_id', res.data.order_id);
          that.getPreOrder(token, res.data.order_id); //調(diào)用getPreOrder
        }
        else {
          console.log('訂單未創(chuàng)建成功');
        }
      }
    })
  },
 
  getPreOrder: function (token, orderID) {
    if (token) {
      wx.request({
        url: baseUrl + '/pay/pre_order',
        method: 'POST',
        header: {
          token: token
        },
        data: {
          id: orderID
        },
        success: function (res) {
          var preData = res.data;
          console.log(preData);
          
          wx.requestPayment({    //請(qǐng)求支付
            timeStamp: preData.timeStamp.toString(),
            nonceStr: preData.nonceStr,
            package: preData.package,
            signType: preData.signType,
            paySign: preData.paySign,
            success: function (res) {
              console.log(res.data);     
            },
            fail: function (error) {
              console.log(error);
            }
          })
        }
      })
    }
  },

五，支付回調(diào)