微信小程序调用支付接口的完整流程记录

网友投稿 369 2023-11-12

−目录当然在开发之前，我们需要有下面这些东西：步骤如下：总结

官方的文档路径------》文档路径：developers.weixin.qq.com/miniprogram…

当然在开发之前，我们需要有下面这些东西：

appId(小程序分配)小程序密钥(小程序配置界面获取)商户号api密钥(商家后台自己设置)

微信小程序调用支付接口的完整流程记录

首先我们要知道把大象放进冰箱拢共需要三步（不是），那么我们调起支付也是一样的

步骤如下：

wx.login获取用户临时登录凭证code，发送到后端服务器换取openId

在下单时，小程序需要将商品Id，商品数量，以及openId传送到服务器

服务器在接收到商品Id、商品数量、openId后，生成服务期订单数据，同时经过一定的签名算法，向微信支付发送请求，获取预付单信息(prepay_id)，同时将获取的数据再次进行相应规则的签名，向小程序端响应必要的信息(必须字段信息将在下文进行详细说明)

小程序端在获取对应的参数后，调用wx.requestPayment()发起微信支付，唤醒支付工作台，进行支付

1.通过wx.login拿到code，然后请求接口从后台拿去openId

?
1
2
3
4
5
6
7
8
9
login() {
var that=this
wx.login({
success(res) {
console.log(res)
wx.request({ url: ,
data: { code: res.code } })
},
})

2.在调起微信支付前需要保证接收到所有我们要传递的值， 在这里是openId,和支付金额。openId以及相应需要的商品信息发送到后端，换取服务端的prepay_id

接下来我们就可以写一版调起微信支付接口的数据

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
let random = (Math.random()).toString() //这个随机数一定要变成字符串
let timestamp = (new Date().getTime()).toString() //时间戳一定要是字符串
let mch_key = FVmZcEmubX817JRKHmWo1vaVHzte2Oha
let obj = {
appId: wxb9811d3b2e3de44c,
nonceStr: random,
package: "prepay_id=" + this.data.prepay_id,
signType: MD5,
timeStamp: timestamp
}
//参数名ASCII码从小到大排序（字典序）
let arr = Object.keys(obj).sort().map(item => {
return `${item}=${obj[item]}`;
});
//最后拼接上key（商户密钥）得到字符串
let str = arr.join(&) + &key= + mch_key;
console.log(str);
//对str进行MD5运算，再将得到的字符串所有字符转换为大写
let paySign = md5.hexMD5(str).toUpperCase()
wx.requestPayment({
"timeStamp": timestamp,
"nonceStr": random,
"package": "prepay_id=" + this.data.prepay_id,
"signType": "MD5",
"paySign": paySign,
"success": function (res) {
console.log(成功了);
},
"fail": function (res) {
console.log(res);
if (res.errMsg === requestPayment:fail cancel) {
wx.showToast({
title: 用户取消支付,
icon: none,
duration: 2000
})
} else {
wx.showToast({
title: res.errMsg,
icon: none,
duration: 2000
})
}
},
})

注意：以上信息中timeStamp、nonceStr、prepay_id、signType、paySign各参数均建议必须都由服务端返回（这样会尽最大可能性保证签名数据一致性），小程序端不做任何处理。大家改一下接口和传递的参数就可以啦，这已经是模板 可以直接用！

总结

到此这篇关于微信小程序调用支付接口

您可能感兴趣的文章:微信小程序 wx.request(接口调用方式)详解及实例微信小程序调用摄像头隐藏式拍照功能微信小程序页面调用自定义组件内的事件详解微信小程序如何调用json数据接口并解析微信小程序调用摄像头实现拍照功能微信小程序调用微信登陆获取openid及java做为服务端示例使用微信小程序API，调用微信的各种内置能力。微信小程序页面与组件之间信息传递与函数调用微信小程序开发打开另一个小程序的实现方法微信外唤起微信小程序的方法详解

版权声明：本文内容由网络用户投稿，版权归原作者所有，本站不拥有其著作权，亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容，请联系我们jiasou666@gmail.com 处理，核实后本网站将在24小时内删除侵权内容。

标签：程序 微信小程序 流程 小程序 参数
上一篇:微信小程序开发之实现摇色子游戏
下一篇:小程序开发之云函数的使用教程详解
相关文章

 发表评论

暂时没有评论，来抢沙发吧~