微信小程序支付功能详细分析（一、预支付）

微信小程序支付功能详细分析

小记：最近在做微信小程序的支付，中间也遇到了很多问题，总结一下，给大家避个坑，也给自己记录一下后面可以作为参考

概要

本文中只写执行逻辑，跟一些算法，不包含具体代码内容，目前开发采用的是微信小程序、nginx+uwsgi+python+flask

微信小程序支付
官方文档：https://developers.weixin.qq.com/miniprogram/dev/framework/

整体逻辑

首先先看下整体逻辑

整体逻辑
https://pay.weixin.qq.com/wiki/doc/api/wxa/wxa_api.php?chapter=7_4&index=3

这个是官方给出的 小程序支付的流程图，我们来分布讲解一下

首先先讲解下逻辑，用户点击下单，并不是直接小程序发送给微信后台服务器，而是小程序把数据传输给我们自己的服务器，通过我们自己的服务器跟微信后台服务器交互后获取支付数据传输给微信小程序客户端，再由微信小程序通过统一的支付函数，直接发送给微信后台服务器，支付成功，成功后微信后台服务器会给我们的服务器和微信小程序发支付成功信息。

为了方便理解，我们把我微信小程序简称（客户端），我们自己的服务器简称（A服务器），微信后台的服务器简称（B服务器）

可以看到我们在整个支付流程中， 向B服务器发送过两次的支付请求，一次是A服务器发出，一次是微信小程序发出。 第一次称为预支付，第二次才是下单

预支付

我们先讲一下预支付
预支付就是A服务器使用统一下单命令向B服务器发送数据并返回一个json数据，这个json数据到时候是要发送给客户端，完成第二次下单操作的参数

预支付步骤：

关于 统一下单 需要几个参数我们需要先获取一下：
1、openid （用户标识）
2、nonce_str （随机字符串）
3、out_trade_no （商户订单号）
4、sign （签名）

1、openid（用户标识）

首先客户端提起支付请求，我们需要先把微信客户端的用户登陆凭证获取到，然后发送给A服务器

//微信小程序 js代码
//微信登陆，获取代码，发送A服务器 并获取结果（即openid）
wx.login({
   
        success: function (res) {
   	//登陆成功，获取用户登陆凭证 res.code
          if (res.code) {
   
            wx.request({
   		//发送数据给A服务器
              url: 'https://你自己的服务器',
              data: {
   
                code: res.code,         //用户登陆凭证，这个后面用户换取openid的东西 主要作用参考图 2
                ordercode: ordercode,   //支付金额
              },
              method: 'post',
              success: function (res) {
   
                	//返回的数据我们待会在做详细讲解///
              }
            })
          } else {
   
            console.log('获取用户登录态失败！' + res