微信小程序学习14--小程序微信支付流程分析及实现

最新推荐文章于 2023-09-01 08:58:30 发布

木蓝茶陌*_*

最新推荐文章于 2023-09-01 08:58:30 发布

阅读量648

点赞数

分类专栏：小程序

本文链接：https://blog.csdn.net/jyn15159/article/details/110038535

版权

小程序微信支付支付流程服务器处理购物车管理

关键词由CSDN通过智能技术生成

小程序专栏收录该内容

15 篇文章 1 订阅

订阅专栏

小程序微信支付

支付流程分析

用户要购买商品并且付钱给商家（用户点击支付按钮，调用商家服务器进行付款）。
商家服务器收到用户的支付信息（用户信息和交易数据）后进行备案（存储信息到数据库）。
商家服务器委托（调用接口）第三方金融机构（微信、支付宝、银联）进行支付。
金融机构反馈确认收款信息给商家服务器，商家服务器再给用户确认付款的反馈。
用户收到反馈后，可以直接把钱付给第三方。

在这里插入图片描述

支付流程实现

实现支付：

async handlePay (e) {
  // 1、调用接口请求实现付款
  // console.log(e.target.dataset.id)
  const { message } = await this.$request({
    path: 'my/orders/req_unifiedorder',
    method: 'post',
    param: {
      order_number: e.target.dataset.id
    },
    header: {
      Authorization: uni.getStorageSync('mytoken')
    }
  })
  // 2、用户确认进行付款
  uni.requestPayment({
    ...message.pay,
    success: () => {
      uni.showToast({
        title: '支付成功'
      })
    }
  })
}

支付成功后，删除购物车中已经支付过的商品

// 把支付过的商品从购物车清空
let orderInfo = this.list.filter(item => {
  return item.order_number === e.target.dataset.id
})
// 此次支付订单中的商品列表
let goods = orderInfo[0].goods
// 获取该商品列表中的所有ID
goods = goods.map(item => {
  return item.goods_id
})
// 查询购物车当前的商品
let cart = uni.getStorageSync('mycart') || []
// 过滤出剩余的商品（未支付的商品）
let other = cart.filter(item => {
  return !goods.includes(item.goods_id)
})
// 把未支付的商品重新放回缓存
uni.setStorageSync('mycart', other)
id)
})
// 把未支付的商品重新放回缓存
uni.setStorageSync('mycart', other)