我们先看效果图
我们完全借助小程序云开发来实现这个支付功能。 无需搭建自己的服务器,无需购买域名,无需注册域名,也无需支持。 只需简单的云功能,即可轻松实现微信小程序支付功能。
核心代码如下
1.创建云开发小程序。 关于如何创建云开发小程序,这里就不详细讲解了。不知道如何创建云开发小程序的同学可以阅读我之前的文章或者观看我录制的视频:【免费】云开发简介微信小程序(摆脱后台,自己实现后台数据)-4-1- 4 实现你的第一个云开发小程序-求是在线视频教程-CSDN学院
创建云开发小程序有几点需要注意
1.不要忘记在app.js中初始化云开发环境。
2.创建云函数后,一定要上传
2.创建支付云功能
1.创建云功能支付
三、引入三方依赖
这里引入三方依赖的目的是为了创建我们在支付时需要的一些参数。 我们使用npm安装依赖,npm必须安装node。 这里就不解释如何安装node了。 你可以百度一下,网上也有很多。
1.首先右键支付然后选择在终端中打开
2.我们使用npm来安装这个依赖。
在命令行中执行npm i
安装完成后,我们的支付云功能会多一个.json文件
至此我们的依赖就安装好了。
4.编写云函数支付
完整代码如下
请务必将 , 替换为您自己的。
至此,我们就完成了获取小程序支付所需参数的云函数代码的编写。
不要忘记上传这个云函数。
出现下图即表示上传成功。
第五,编写一个简单的页面来提交订单和调用支付云功能。
这个页面非常简单,
1.随机写入一个订单号(该订单号必须大于6位)
2.随意填写订单价格(单位为分)
3. 点击 按钮,调用支付云功能。 获取支付所需的参数。
下图是官方支付API需要的一些必要参数。
6. 调用wx. 实现支付
下图是官方的示例代码
这里我不会详细解释,但我会为您发布完整的代码。
至此,云开发实现小程序支付的功能就完全实现了。
实现效果1、激活支付键盘
2. 付款完成
3.日志,可以看到不同支付状态的回调
上图是支付成功的回调。 回调成功后我们可以更改订单支付状态。
下图是支付失败的回调。
下图为支付完成状态。
至此我们就轻松实现了微信小程序的支付功能了。 是不是很简单呢?