支付宝沙箱实现支付功能

对接支付宝沙箱实现网页支付

一、基本步骤

支付有四种状态：待支付、未支付、支付成功、支付失败

1、点击结算购物车

生成一个待支付的订单，后端会返回一个订单号，可以查询订单状态
跳转到提交订单页面

2、点击提交订单

发送一次请求，将订单号传递给后端，后端记录订单状态的改变
发送支付请求，后端返回一个url，打开这个支付链接进行支付

3、支付成功/失败

支付完整会跳转页一个页面，前端再请求一次，获取支付结果状态

二、对接支付宝沙箱

发送支付请求，需要携带请求头

'Content-Type': 'application/x-www-form-urlencoded'

1、进入支付宝沙箱网站

沙箱环境 - 支付宝文档中心

2、填写个人信息，入驻开放平台

3、下载支付宝开放平台开发助手

4、打开开发助手工具，设置

5、生成密钥后回到页面进行配置，设置应用公钥

沙箱环境

6、node环境的SDK

Github地址/支付宝开放平台 Alipay SDK for Node.js

语雀地址/SDK 配置

三、项目使用

1、后端配置

安装SDK

npm i alipay-sdk -S

创建一个配置文件，内容自行填写

/**
*   alipay.js
*/ 

// 引入sdk
const AlipaySdk = require('alipay-sdk').default

// sdk相关配置
const alipaySdk = new AlipaySdk({
  // AppID
  appId: '',
  // 签名算法
  signType: 'RSA2',
  // 支付宝网关
  gateway: '',
  // 支付宝公钥
  alipayPublicKey: '',
  // 应用私钥
  privateKey: ''
})

module.exports = alipaySdk

2、后端支付接口

// 支付宝配置文件
const alipaySdk = require('../db/alipay.js')
// 这个也必须引入，注意要添加default
const AlipayFormData = reqire('alipay-sdk/lib/form').default

// 发起支付
router.post('/api/payment', function (req, res, next) {
  // 接收相关参数
  let { orderId, name, price } = req.body
  // 开始对接支付宝API
  const formData = new AlipayFormData()
  // 调用 setMethod 并传入 get，会返回可以跳转到支付页面的 url
  formData.setMethod('get')
  // 支付时的信息
  formData.addField('bizContent', {
    // 订单号
    outTradeNo: orderId,
    productCode: 'FAST_INSTANT_TRADE_PAY',
    // 总价
    totalAmount: price,
    // 商品名称
    subject: name,
    // 描述，可选
    // body: '商品详情'
  })
  // 支付成功或者失败跳转的链接
  formData.addField('returnUrl', 'http://localhost:8080/payment')
  const result = alipaySdk.exec(
    'alipay.trade.page.pay',
    {},
    { formData: formData },
  )
  // 对接支付宝成功返回数据
  result.then(r => {
    res.send({
      data: {
        code: 200,
        success: true,
        msg: '支付中',
        // 这就是返回的支付链接，前端使用window.location.href=paymentUrl打开链接
        paymentUrl: r
      }
    })
  })
})

3、前端跳转

前端打开后端返回的地址，地址会包含一些参数，可以得到支付信息

http://localhost:8080/payment?charset=utf-8

&out_trade_no=2022091722331727              这是一个重要参数

&method=alipay.trade.page.pay.return

&total_amount=238.00&sign=c26kfIyyvltJUXNHxUyAlklIKf%2BxSdAvzHC4pi1I3OuU8hFSaliiIzPKVXtDS6lWk6KVyEONtHh1TZ%2Bpg531NvZcHwfzSHGRdydbsAbbNiI258lby5E5M7lHWZFALdsfrFtxrF3IPKgqF%2BjG2l1%2BjjLkW%2BGrw0mwpO4HbkZASNTMqlqYKqsE9%2Baha5U4K4l5SvFZpVW5HYQpRW2uyv%2F3LoUrf9WFRWVsFW%2BgHLQ5wqtJUD2ARXOO5wjmHvU9k4ycvn8Vu9M7%2FNcAblw06THfBiE34GQ9Zysj3%2FMYPOA7Ma9OfDkNQiU1Gx%2Bg%3D%3D

&trade_no=2022091200147228050672455     这是一个重要参数

&auth_app_id=202100011667351&version=1.0

&app_id=202100012167351&sign_type=RSA2

&seller_id=2088621993217390

×tamp=2022-09-17%2021%42%3A24

4、后端验证结果

验证支付结果是成功还是失败

router.post('/api/successPayment', function (req, res, next) {
  let token = req.headers.token
  let tokenObj = jwt.decode(token)
  let { out_trade_no, trade_no } = req.body
  //支付宝配置
  const formData = new AlipayFormData()
  // 后端校验，是否支付成功
  formData.setMethod('get')
  //支付时信息
  formData.addField('bizContent', {
    out_trade_no,
    trade_no
  })
  //返回promise
  const result = alipaySdk.exec(
    'alipay.trade.query',
    {},
    { formData: formData },
  )
  //后端请求支付宝进行验证
  result.then(resData => {
    axios({
      method: 'GET',
      url: resData
    }).then(result => {
      console.log(result)
      /**
       * 这里的返回结果就包含支付的结果信息
       所以需要根据结果不同对数据库的状态进行不同的操作 
      */
    })
  })
})

返回结果中包含状态码 | 支付金额 | 时间等信息