小程序实现个人支付功能

2021-12-12  本文已影响0人  云高风轻

1. 前言

1.小程序的支付功能一直有人咨询
2.以前一直以为个人开发者是不可以使用支付功能的
3.但是微信自己有个骚操作 ,所以个人也可以使用小程序功能
4.下面介绍


2. 小商店助手

1.个人开发者需要在微信app上 搜索小程序商家助手,实际搜索的时候,关键字填写商家都弹出来了
2.按步骤操作,提交资料等待审核就行,就一个身份证正反面
3.需要说明这个结算的费率是0.6%
4.审核基本是秒过的,不需要等待
5.

1.jpg

3. 付款流程图

1.png 2.png 3.png
4.png 5.png 6.png

1.如图1,用户通过分享或扫描二维码进入商户小程序,用户选择购买,完成选购流程。
2.如图3,调起微信支付控件,用户开始输入支付密码。
3.如图4,密码验证通过,支付成功。商户后台得到支付成功的通知。
4.如图5,返回商户小程序,显示购买成功。
5.如图6,微信支付公众号下发支付凭证。


4. 逻辑分析

1.打开某小程序,点击直接下单
2.wx.login获取用户临时登录凭证code,发送到后端服务器换取openId
3.在下单时,小程序需要将购买的商品Id,商品数量,以及用户的openId传送到服务器
4.服务器在接收到商品Id、商品数量、openId后,生成服务期订单数据,同时经过一定的签名算法,向微信支付发送请求,获取预付单信息(prepay_id),同时将获取的数据再次进行相应规则的签名,向小程序端响应必要的信息
5.小程序端在获取对应的参数后,调用wx.requestPayment()发起微信支付,唤醒支付工作台,进行支付
6.接下来的一些列操作都是由用户来操作的包括了微信支付密码,指纹等验证,确认支付之后执行鉴权调起支付
7.鉴权调起支付:在微信后台进行鉴权,微信后台直接返回给前端支付的结果前端收到返回数据后对支付结果进行展示
8.推送支付结果:微信后台在给前端返回支付的结果后,也会向后台也返回一个支付结果,后台通过这个支付结果来更新订单的状态

其中后端响应数据必要的信息则是


5. 发起微信支付 接口

wx.requestPayment({
  // 时间戳
  timeStamp: '',
  // 随机字符串
  nonceStr: '',
  // 统一下单接口返回的 prepay_id 参数值
  package: '',
  // 签名类型
  signType: '',
  // 签名
  paySign: '',
  // 调用成功回调
  success () {},
  // 失败回调
  fail () {},
  // 接口调用结束回调
  complete () {}
})

6.项目中相关代码

1. 1.png

2.当然相关的具体请求封装起来了,不会让看到的哈哈,但是能大概知道流程


7. 前端

前端只需要调用后端的接口根据文档传参数就行
但是这个还是需要自己亲自开发一遍,讲再多都某用


参考资料

小程序支付
小程序支付
小程序支付开发指引


初心

我所有的文章都只是基于入门,初步的了解;是自己的知识体系梳理;如有错误,欢迎交流;
如果能帮助到有缘人,非常的荣幸,一切为了部落的崛起;
共勉
上一篇下一篇

猜你喜欢

热点阅读