小程序微信支付(UNIAPP+第三方SDK:binarywang)
小程序支付流程图说明(UNIAPP+第三方SDK:binarywang)
说明:小程序为UNI-APP开发,使用的第三方微信支付SDK为binarywang提供的,此SDK对微信公众号、小程序、微信各种类型的支付、企业微信的相关对接接口都有很好的全面集成,是应用得比较多的一款优秀的SDK。
如图为各个服务相互调用的过程,后续有步骤说明
流程图步骤说明
1、用户在小程序中触发了支付申请(如:点击了付款按钮,唤起微信支付页面,非扫码支付)
2、UNIAPP发起支付申请
用户在小程序(UNIAPP开发)上主动发起了一个向商家支付的申请后,调用UNIAPP的uni.log(obj)方法(无论是否是点击后调用还是点击前调用,均可以根据实际情况来决定,此处只是为了方便流程的讲解),其中参数类型与返回值说明如下图:
参考:https://uniapp.dcloud.io/api/plugins/login
在返回值中,我们得到了临时登录凭证code(只能使用一次),我们便可以根据code来获取用户的openId,由此我们可以获取得到了用户的小程序的openId。
参考:https://developers.weixin.qq.com/miniprogram/dev/api-backend/open-api/login/auth.code2Session.html
3、调用自己的服务创建预支付单
如流程图中的步骤三创建预支付单的接口:gql.createWxPayOrdercode(code, orderId: 1000, trandeType: "JSAPI"),其中code为获取用户小程序的openId的临时凭证,即上一步所获得的code,orderId为自己业务的参数,trandeType为固定值JSAPI(JSAPI支付或小程序支付)。当然此值也可以在后台固定,此处只是为了提示此支付类型。
参考:https://pay.weixin.qq.com/wiki/doc/api/wxa/wxa_api.php?chapter=4_2
4、调用自己的服务创建预支付单
在我们自己定义的接口的做相应的业务校验处理,准备好参数后,调用SDK中创建预支付单的接口wxPayService.createOrder
5、SDK调用微信小程序生单接口
在SDK中会调用微信小程序的生意接口,也就是原生的微信支付接口,在生单接口中有一个参数notify_url,此参数是微信服务器将用户的支付结果回传给我们时调用的url,即此url是我们自己服务对外暴露的url。
参考:https://pay.weixin.qq.com/wiki/doc/api/wxa/wxa_api.php?chapter=9_1
6、微信小程序将返回的结果返回给SDK
7、SDK将微信小程序返回的结果进行封装加密成唤起微信支付页面所需要的参数
在原生的微信小程序生单接口中,返回参数需要再次的根据相应的规则进行加密后,才能调用API唤起微信支付页面
但是在SDK中,SDK将此加密转换的过程已经帮我们做了,它返回的是已经处理好了的参数,所以我们在前面直接使用这些返回的结果就OK了。
参考:https://pay.weixin.qq.com/wiki/doc/api/wxa/wxa_api.php?chapter=7_7&index=5
8、9、创建预支付单的接口返回给小程序,唤起微信支付
在我们的小程序中接收到创建预支付单的接口返回值后,便可调用UNIAPP中的uni.requestPayment(OBJECT)方法来响起微信支付,我这边是这样调用的:result为后台返回的结果
参考:https://uniapp.dcloud.io/api/plugins/payment
10、用户支付完成,调用自己服务接口
用户支付完成后,可以根据实际情况更新自己的业务信息
11、用户支付完成,微信服务器的结果回传
当用户支付完成后,微信服务器会调用生单接口中参数notify_url的值进行结果的回传。此notify_url为我们系统对外暴露的url。我们在此url对应的接口中做相对应的支付结果业务处理。
参考:https://pay.weixin.qq.com/wiki/doc/api/wxa/wxa_api.php?chapter=9_7&index=8
为了更好的理解,SDK提供了一个微信支付的DEMO,大家可去clone下来更方便的理解。
小程序微信支付(UNIAPP+第三方SDK:binarywang)的更多相关文章
- 微信小程序 微信支付
微信小程序前端自处理: //时间戳 timeStamp() { return parseInt(new Date().getTime() / 1000) + '' }, //随机数 randomStr ...
- 微信小程序------微信支付模块
最近项目涉及到小程序开发:需要进行微信支付模块,接下来通过叙述,记录一下微信小程序中微信支付模块的开发,以便日后翻阅和使用. 学习指南----------微信支付开发文档:https://pay.we ...
- TP5调用小程序微信支付,回调,在待支付中再次调用微信支付
1,必须要有 $mch_id $key $appid这三个值,是需要去申请的,我是直接用公司的2,购买商品订单号用户openid统一下单名称商品价格(必须以分为单位,调起微信支付)服务器的ip地址(没 ...
- 微信小程序——微信支付
这个讲起来也就比较麻烦一点,因为需要的不仅仅是咱们代码上的技术,嘿嘿! 先整理一下思路.如果想做微信支付: 1.现有一个公司账户(非个人账户),并且实名认证过的. 2.微信号 必须开通微信支付功能. ...
- 微信小程序微信支付的一些坑
使用的是Node.js作为后端 统一下单: appid:这里的appid是调起微信支付的appid mch_id:商户号,需要注意的是商户号要与appid对应 nonce_str:Math.rando ...
- 微信小程序微信支付流程
1.小程序调用wx.login获取登录凭证code wx.login(无请求参数)返回code(有效期5分钟) wx.login({ success:function(res){ //get res. ...
- .NET开发微信小程序-微信支付
前台MD5加密代码 /* * A JavaScript implementation of the RSA Data Security, Inc. MD5 Message * Digest Algor ...
- Taro/JS/H5/小程序:纯前端解决小程序微信支付统一下单和调起支付
这个文章不会说具体0到1的代码流程,我会着重讲几个问题的解决 准备以下依赖 "md5": "^2.2.1", "xml-js": " ...
- Java实现小程序微信支付
小程序支付流程交互图: 进入小程序,下单,请求下单支付,调用小程序登录API来获取Openid,生成商户订单 // pages/pay/pay.js var app = getApp(); Page( ...
随机推荐
- Maven执行Install命令时跳过测试
1. 在pom.xml中添加插件 <!-- 跳过单元测试,不然打包的时候会因为加载不了application.yaml报错 --> <plugin> <groupId&g ...
- 【maven】maven创建项目问题
这个问题困扰了很多,几个月在做大数据课设的时候,本想创建maven项目,但是创建项目失败了.这次又碰到maven创建项目失败,终于解决了.下面按碰到问题的时间来描述,所以需要从头认真看 前提须知 Ma ...
- MySQL导入与导出SQL
一.导入SQL 方法一: (1)选择数据库 use databaseName; (2)设置数据库编码 set names utf8; (3)导入数据(注意sql文件的路径) source **.sql ...
- spring中注解@Resource 与@Autowire 区别
① .@Resource 是根据名字进行自动装配:@Autowire是通过类型进行装配. ②. @Resource 注解是 jdk 的:@Autowire 是spring的.
- 面试侃集合 | ArrayBlockingQueue篇
面试官:平常在工作中你都用过什么什么集合? Hydra:用过 ArrayList.HashMap,呃-没有了 面试官:好的,回家等通知吧- 不知道大家在面试中是否也有过这样的经历,工作中仅仅用过的那么 ...
- 如何安装Eigen库和Sophus库
* { font-family: "Tibetan Machine Uni", "sans-serif", STFangSong; outline: none ...
- [刷题] 203 Remove Linked List Elements
要求 在链表中删除值为val的所有节点 示例 如 1->2->3->4->5->6->NULL,要求删除值为6的节点 返回1->2->3->4-& ...
- shell基础之bus实战(if 练习)
题目: 一条公交路线共30站,乘客上车需支付1元,之后每超过5站支付0.5元:最好可以实现"余额不足的提醒"和"逃票,漏刷卡的显示". 注意:需下载bc计算器 ...
- HUAWEI防火墙通过L2TP隧道让外出员工访问公司内网的各种资源
组网图形 组网需求 企业网络如图所示,企业希望公司外的移动办公用户能够通过L2TP VPN隧道访问公司内网的各种资源. 操作步骤 配置LNS. 1.配置接口IP地址,并将接口加入安全区域. <L ...
- Mobileye_EyeQ4功能和性能
Mobileye_EyeQ4功能和性能 一.硬件平台 图丨 Mobileye EyeQ4 架构(Mobileye EyeQ4使用了多MIPS处理器) 为确保 L3 级别以上的自动驾驶汽车市场,Mobi ...