【Node.js】实现微信小程序在线支付功能

news2025/1/29 14:03:06

实战项目名称:微信小程序实现在线支付功能
- 文章结尾附上微信小程序码,扫码登录后即可体验!!

文章目录

  • 一、实战步骤
    • 1. 前期准备
    • 2. 添加`wechatpay-node-v3`和`fs`插件
    • 3. 预设微信下单的数据
    • 4. 将上一步骤的下单信息返回给前端
    • 5. 小程序前端接收数据 并发起支付
  • 二、完整源码
  • 三、在线体验


一、实战步骤

1. 前期准备

注意:对接微信支付功能,必须得先有微信支付的商户号,不然你是测试不了微信支付功能的。

  • 原因:
  1. 微信官网不提供微信支付的测试账号
  2. 微信支付一切都以商户号为基础,没有商户号一切等于0

需要用到的资料和账号

  • AppID(小程序ID),AppSecret(小程序密钥)
  • 商户号(mchid)
  • 微信支付证书源文件,微信支付API证书序列号
  • 商户号APIv3秘钥,用于微信支付成功后回调

2. 添加wechatpay-node-v3fs插件

  • 添加插件示例
// 添加插件示例
yarn add wechatpay-node-v3 fs
//或者
npm install wechatpay-node-v3 fs
  • 使用代码示例
// 使用插件示例
import WxPay from 'wechatpay-node-v3'
import fs from 'fs'  //读取

 async startPay(){
  const pay = new WxPay({
            appid: config.app.appid,      //换成你的小程序appid
            mchid: config.wxpay.mchid,    //换成商户号mchid
            publicKey: fs.readFileSync('./apiclient_cert.pem'), // 微信支付证书公钥
            privateKey: fs.readFileSync('./apiclient_key.pem'), // 微信支付证书秘钥
  });
 }

3. 预设微信下单的数据

注意: 微信支付成功的回调notify_url地址千万别写错,关于更多的回调通知,请点击访问该地址了解更多。

记得一定要检查APIv3秘钥有设定,不然就算你写一万行代码支付通知API也不起作用!!!

代码如下(示例):

const params = {
            description: name, // 订单描述
            out_trade_no: order_id, // 订单号,一般每次发起支付都要不一样,可使用随机数生成
            notify_url: 'https://cccccccc/notify_url', //支付成功后,微信会向该地址发起请求
            amount: {
                total: total, // 支付金额,单位为分
            },
            attach:`[{"amount":"${amount}"},{"remark":"${remark}" },{"product_id":"${product_id}"}]`,   //一些自定义的数据
            payer: {
                openid: openid, // 微信小程序用户的openid,一般需要前端发送过来
            },
            scene_info: {
                payer_client_ip: 'ip', // 支付者ip,这个不用写也没有问题
            },
        };

4. 将上一步骤的下单信息返回给前端

利用插件的transactions_jsapi方法进行处理

代码如下(示例):

 const result = await pay.transactions_jsapi(params);

5. 小程序前端接收数据 并发起支付

  • 订阅功能的实现在我的另一篇文章中,可以点击去看看如何实现,订阅消息通知。

代码如下(示例):

// this.message就是后端返回的数据,下面是示例的数据结构 

//{
//	appId: '******',
//    timeStamp: '******',
//    nonceStr: '******',
//    package: '******',
//    signType: 'RSA',
//    paySign: '******'
//}

wx.requestPayment({
					timeStamp: this.message.timeStamp,
					nonceStr: this.message.nonceStr,
					package: this.message.package,
					signType: this.message.signType,
					paySign: this.message.paySign,
					success(res) {
						uni.showToast({
							title: '支付成功'
						})
						that.close()
						// 支付成功后,可以添加一个订阅功能
						uni.requestSubscribeMessage({
							// 模板id:可以在微信公众平台 -> 功能 -> 订阅信息进行选择
							tmplIds: ['1FcVK9Vp86j7l8_mlLTepX4A6hwhRvW2uDDRr1tP5Io'],
							success: res => {
								console.log(res)
							},
							fail: e => {
								console.log(e)
							}
						})
					},
					fail(res) {
						uni.showToast({
							title: '支付失败',
							icon:'error'
						})
					}
				})

到了这一步,基本的微信支付功能就已经实现,下一期再讲解解密微信支付回调结果


二、完整源码

import fs from 'fs'
import WxPay from 'wechatpay-node-v3'

async startPay(_, { openid,name,total,amount,remark,product_id }) {
        const pay = new WxPay({
            appid: config.app.appid,
            mchid: config.wxpay.mchid,
            publicKey: fs.readFileSync('./apiclient_cert.pem'), // 公钥
            privateKey: fs.readFileSync('./apiclient_key.pem'), // 秘钥
        });
        // console.log(pay)

        // console.log(order_id)
        // let openid = 'xxxxx'; 可以自定义一个测试
        const params = {
            description: name, // 订单描述
            out_trade_no: order_id, // 订单号,一般每次发起支付都要不一样,可使用随机数生成
            notify_url: 'https://xxxxxxxx/notify_url',
            amount: {
                total: total, // 支付金额,单位为分
            },
            attach:`[{"amount":"${amount}"},{"remark":"${remark}" },{"product_id":"${product_id}"}]`,
            payer: {
                openid: openid, // 微信小程序用户的openid,一般需要前端发送过来
            },
            scene_info: {
                payer_client_ip: 'ip', // 支付者ip,这个不用写也没有问题
            },
        };
        // console.log(params)
        const result = await pay.transactions_jsapi(params);
        // console.log(result)
        //将数据返回给前端
      return result
    },


三、在线体验

  • 扫下方微信小程序码即可体验,支付后相关源码也是会正常发送到你留言的邮箱的。
    在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/90645.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

在抖音全程看世界杯,超高清直播背后的硬实力

导语:IT技术赛场开赛!作者 | 宋慧 出品 | CSDN(ID:CSDNnews)当前,2022 卡塔尔世界杯比赛正在如火如荼进行中,处在更加激烈关键的半决赛阶段。作为足球运动的全球顶级赛事,世界杯…

SysML图例-核聚变

DDD领域驱动设计批评文集>> 《软件方法》强化自测题集>> 《软件方法》各章合集>> [新闻]核聚变里程碑式突破>> SysML图中词汇: Tokamak: 一种利用磁约束来实现受控核聚变的环形容器,通过约束电磁波驱动&#xff…

如何形成前端知识体系

来啦各位大佬~但很不好意思,我就是标题党,这篇博文并没有很明确的给出「如何形成前端知识体系」答案,我自学前端,在面试字节的时候,字节的大佬说我的知识点没有成体系,很零散的飘在各个地方&…

面试官:你如何实现大文件上传

提到大文件上传,在脑海里最先想到的应该就是将图片保存在自己的服务器(如七牛云服务器),保存在数据库,不仅可以当做地址使用,还可以当做资源使用;或者将图片转换成base64,转换成buff…

怎么复制网页上不能复制的文字(付费文档免费复制),一招搞定

好多小伙伴上网查资料的时候,想要复制网页内容,但是提示付费复制或者不允许复制,遇到这种情况怎么办呢?下面就是小编分享的一招搞定无法复制网页内容文字的方法。 怎么复制网页上不能复制的文字 借助360安全浏览器/360极速浏览器…

Minecraft 1.19.2 Forge模组开发 06.建筑生成

1.12.2自定义建筑生成 1.16.5自定义建筑生成 1.18.2自定义建筑生成 我们本次尝试在主世界生成一个自定义的建筑。 效果展示效果展示效果展示 由于版本更新缘故,1.19的建筑生成将不涉及任何Java包的代码编写,只需要在数据包中对建筑生成进行自定义。 …

基于粒子群优化算法的BP神经网络预测模型(Matlab代码实现)

目录 1 概述 2 粒子群优化算法 3 BP神经网络 4 PSO优化 BP网络算法 5 运行结果 6 参考文献 7 Matlab代码实现 1 概述 在工程应用中经常会遇到一些复杂的非线性系统,这些系统的状态方程复杂,难以准确的用数学方法建模,而BP神经网络实质上实现了一个从输入到输出的映射功…

【k8s】Kubernetes 基础组件详解

一、k8s简介 Kubernetes 是容器集群管理系统工具,是一个开源平台,可实现容器集群的自动化部署、自动扩缩容、维护等功能。Kubernetesk8s是Kubernetes的缩写,Google 于 2014 年开源了 Kubernetes 项目,Kubernetes的名字来自希腊语&…

无延时直播/超低延时直播实际测试延时效果(项目实测组图)

阿酷TONY / 2022-11-30 / 长沙 / 超多组图 无延时直播/超低延时直播,主要只测试延时情况,没有涉及直播产品的功能、使用操作界面,有兴趣的朋友可以加联系我实际测试哦~~~ 1.无延时直播应用场景 无延时直播/超低延时常见应用场景&#…

近90天互动量破百万,「围炉煮茶」究竟做对了什么?

今年秋冬,“围炉煮茶”爆红网络。小红书相关笔记数量突破8万,累计话题浏览量1200万次,近90天互动量破百万! 茶,从老一辈的茶杯茶盘里,通过创新再造,成为年轻人的社交“新”头好。高流量曝光、高…

Go语言性能剖析利器--pprof实战

作者:耿宗杰 前言 关于pprof的文章在网上已是汗牛充栋,却是千篇一律的命令介绍,鲜有真正实操的,本文将参考Go社区资料,结合自己的经验,实战Go程序的性能分析与优化过程。 优化思路 首先说一下性能优化的…

什么是文档管理?

什么是文档管理? 文档管理是指在公司或组织内部组织、存储和检索文档以及自动化工作流程所需的流程和资源。文档可以是硬拷贝或数字格式,包括合同、表单、发票、工作申请、福利登记信息和其他记录。 强大的文档管理的重要性 平均而言,由于…

Web实时预览 界面组件Telerik——提高开发者工作效率的完美组合

Telerik DevCraft包含一个完整的产品栈来构建您下一个Web、移动和桌面应用程序。它使用HTML和每个.NET平台的UI库,加快开发速度。Telerik DevCraft提供最完整的工具箱,用于构建现代和面向未来的业务应用程序。 Telerik ASP.NET AJAX (Web Forms) 组件在…

SAP ABAP OAOR SBDSV1新建BDS类/DOI大数据量输出EXCEL时错误空白或不完整

SAP ABAP OAOR SBDSV1新建BDS类/ DOI大数据量输出 EXCEL时错误空白或不完整 引言: 今日回顾 DOI 使用过程中的两个问题,第一个是管理性问题(新建 BDS 类),第二个是技术性问题( DOI 大数据量输出 EXCEL 时错…

数据对接:从Notion Database到低代码平台app

前言 Notion简介 近几年,有一款叫Notion的产品异常火爆,它是集笔记、任务管理、Wiki、数据管理为一体的产品,他主打两个理念「模块化」和「All-in-one」,Notion最有魅力的还是引进了Database和双向链的理念 Notion也算是一个渐…

美丽田园通过聆讯:上半年期内利润下降近80% 演员刘涛代言

雷递网 雷建平 12月13日由演员刘涛代言的美丽田园医疗健康产业有限公司(简称:“美丽田园”,Beauty Farm)日前通过聆讯,准备在港交所上市。上半年期内利润下降近80%美丽田园首家门店1993年成立,至今美丽田园…

C++ Reference: Standard C++ Library reference: Containers: map: map: operators

C官网参考链接&#xff1a;https://cplusplus.com/reference/map/map/operators/ 函数 <map> std::relational operators (map) (1) template <class Key, class T, class Compare, class Alloc> bool operator ( const map<Key,T,Compare,Alloc>&…

记cf一些可能被hack的写法

1. unordered_map 现象 之前经常当O(1)用&#xff0c;作为一些卡常题的必备杀器&#xff0c; 而且&#xff0c;有的hdu/lc题不用umap的话&#xff0c;就只能手写哈希 但是&#xff0c;上次cf里写了个umap被卡了&#xff0c; 这才意识到之前看到的博客不是无稽之谈 其实我…

面试官:单体架构怎么向分布式微服务架构演变的?(8000字)

随着网站规模越来越大&#xff0c;单体应用往往很难再满足要求&#xff0c;就需要向分布式&#xff0c;微服务架构演变。 那么这个演变过程是怎么样的呢&#xff1f;都涉及到哪些组件&#xff0c;会遇到哪些问题&#xff0c;以及相应的解决方案都是什么&#xff0c;本篇文章就来…

吹爆,阿里MySQL优化笔记有多强?才在GitHub被BATJ联手封杀

公司来了个新同事&#xff0c;一看是个二本生&#xff0c;还是非科班出身&#xff0c;刚30岁。。。 结果没想到人家上来就把现有项目的性能优化了一遍&#xff0c;直接给公司节省了一半的成本&#xff0c;这种“王炸”打法&#xff0c;直接给所有人整懵了。 一问情况&#xff…