当前位置: 首页 > news >正文

uniapp 微信小程序 微信支付

本章的内容我尽量描述的细致一些,哪里看不懂给我评论就可以,我看到进行回复

微信支付大致分为4步,具体看后端设计

1. 获取code

2. 根据code获取openid

3. 根据openid,以及部分订单相关数据,生成prepayId (预支付交易会话ID)

4. 通过prepayId调用支付api,并让后端在支付api中返回支付相关配置参数,然后前端将支付配置参数设置到微信支付api上,进行支付拉起

(第3步和第4步 后端可以合成1步,生成prepayId的同时,并执行支付然后将支付配置返回给前端)

本章主要核心介绍就是: 通过第1步,第2步的结合取出openid,以及第4步中的使用uni.requestPayment(OBJECT) 方法,拉起微信支付api的使用以及参数配置,其他可具体结合自己的项目。

1. 获取code

首先要清楚,code是啥?怎么取?取到它用来干啥?

说明:调用接口获取临时登录凭证(code)。通过凭证进而换取用户登录态信息,包括用户在当前小程序的唯一标识(openid)、微信开放平台账号下的唯一标识(unionid,若当前小程序已绑定到微信开放平台账号)及本次登录的会话密钥(session_key)等。

通过这个说明可以知道:code是临时登录凭证(有效期五分钟),我们可以通过这个code在第二步拿到openid,unionid,session_key 这三个参数

怎么取到code:这里需要使用uniapp官方提供的api uni.login(OBJECT)


uni.login({provider: 'weixin', // 使用微信登录success: (res) => {const { code } = res;console.log('code =>', code) // code => 0e1MTrFa1eDx9I0bRpJa1Mqfwf4MTrFJ}
});

2. 根据code获取openid

openid是啥?怎么取?取到它用来干啥?

说明:openid是微信用户在公众帐号(包括小程序)、H5、APP下的唯一标识。每个应用都有一个appid,不同的appid,对应的openid不同。

用来干啥:因为涉及到支付,那么业务中肯定的需要知道是谁支付了,这个谁就通过openid界定

怎么取:调用微信api【GET https://api.weixin.qq.com/sns/jscode2session?appid=APPID&secret=SECRET&js_code=JSCODE&grant_type=authorization_code】

const toggleExecutePay = (param) => {return new Promise((resolve) => {uni.showLoading({title: '加载中',mask: true});uni.login({provider: 'weixin', // 使用微信登录success: (loginRes) => {// 取得 codeconst { code } = loginRes;// 该api的功能:校验临时登录凭证。通过临时登录凭证完成登录流程,并且返回 openid, unionid, session_key。// 需要注意:某些场景下 在前端代码里直接调用这个api的话,会报错request:fail url not in domain list (url不在域列表中),// 在微信公众平台里面也没办法将这个域名配置到合法域名内// 所以就不能在前端代码里直接调用这个api,让后端新增一个接口,在新增的接口里面调用这个api,然后将openid进行返回// uni.request({//   // 微信官网api 携带参数(小程序appId、小程序appSecret、通过wx.login获取的code、授权类型:此处只需填写 authorization_code)//   url: `https://api.weixin.qq.com/sns/jscode2session?appid=xxx&secret=xxx&js_code=${code}&grant_type=authorization_code`,//   method: 'GET',//   success: function (jscodeRes) {//     const { openid, unionid, session_key } = jscodeRes.data;//   }// });// 调用后端接口 获取openid (只传code就行了,其他三个参数让后端在后台自己写)getUserOpenId({ code: code }).then(async (res) => {const { success, data, message } = res;if (success) {// 执行第3步 创建订单 获取prepayid(统一下单订单号)const prepayId = await toggleCreateOrder(data.openid, param).then((res) => res);// 执行第4步 获取支付配置 并拉起支付await toggleGetPayConfig(prepayId);resolve(true);} else {// 加载弹窗隐藏uni.hideLoading();// 弹起错误信息uni.showToast({icon: 'none',title: `${message}`,mask: true,position: 'top'});resolve(false);}});}});});
};

3. 根据openid,以及部分订单相关数据,生成prepayId (预支付交易会话ID)

这一步对于后端来说,只是单纯的通过openid,以及订单相关参数,像微信要了一个prepayId,然后创建了一个订单,并且给前端返回prepayId

// 创建订单 获取 prepayid(统一下单订单号)
const toggleCreateOrder = (openid, param) => {return new Promise((resolve) => {const payParam = {openId: openid,amount: param.amount// ... 如果生成订单后端还需要其他参数(如商品名称,商品id等等),在这里追加就行};createOrder(payParam).then(async (res) => {const { success, data } = res;if (success) {resolve(data.prepayId);} else {// 加载弹窗隐藏uni.hideLoading();resolve(false);}});});
};

4. 通过prepayId 调用支付api,并让后端在支付api中返回支付相关配置参数,然后前端将支付配置参数设置到微信支付api上,进行支付拉起

这一步对于后端来说,通过prepayId将刚刚生成的订单设置成待支付,并且将支付参数返回给前端,前端拉起微信支付,支付成功后,后端应该会监听回调,监听到微信支付成功了,就把订单设置成支付成功

前端调用拉起微信支付api:uni.requestPayment(OBJECT)

// 获取支付配置
const toggleGetPayConfig = (prepayId) => {return new Promise((resolve) => {getPayConfig({prepayId: prepayId}).then((res) => {// 这些参数都让后端返回,前端就不维护像appid这些固定值了const { appid, nonceStr, signature, timestamp, signType, partnerid } =res;// 加载弹窗隐藏uni.hideLoading();uni.requestPayment({provider: 'wxpay', // 固定传wxpayappid: appid, // 微信开放平台 - 应用 - AppIdtimeStamp: `${timestamp}`, // 时间戳(单位:秒)package: 'prepay_id=' + prepayId, // 'prepay_id=' + prepayIdpaySign: signature, // 签名signType: signType, // 签名算法,这里用的 MD5/RSA 签名nonceStr: nonceStr, // 随机字符串partnerid: partnerid, // 微信支付商户号success(res) {resolve(true);},fail(err) {console.log('支付异常 =>', err);}});});});
};

相关文章:

uniapp 微信小程序 微信支付

本章的内容我尽量描述的细致一些,哪里看不懂给我评论就可以,我看到进行回复 微信支付大致分为4步,具体看后端设计 1. 获取code 2. 根据code获取openid 3. 根据openid,以及部分订单相关数据,生成prepayId (预支付交易会…...

CSS 效果:实现动态展示双箭头

最近写了一段 CSS 样式,虽然不难,但实现过程比较繁琐。这个效果结合了两个箭头,一个突出,一个内缩,非常适合用于步骤导航或选项卡切换等场景。样式不仅仅是静态的,还可以通过点击 click 或者 hover 事件&am…...

Linux 创建开发用的账户

在Linux系统中,创建一个用于开发的用户账户通常涉及到添加用户、设置密码以及配置适当的权限和环境。这里将详细介绍如何在Linux系统中创建一个新的开发用户账户,包括为其配置sudo权限,使其能够执行需要管理员权限的命令。 步骤 1: 创建用户…...

检查一个CentOS服务器的配置的常用命令

在CentOS系统中,查看服务器配置的常用命令非常丰富,这些命令可以帮助用户快速了解服务器的硬件信息、系统状态以及网络配置等。以下是一些常用的命令及其简要说明: 1. 查看CPU信息 (1) cat /proc/cpuinfo:显示CPU的详细信息&…...

Redis 简单的消息队列

使用redis 进行简单的队列很容易,不需要使用较为复杂的MQ队列,直接使用redis 进行,不过唯一不足的需要自己构造生产者消费者,这里使用while True的方法进行消费者操作 目录 介绍数据类型StringHash 重要命令消息队列 介绍 key-v…...

C++:继承和多态,自定义封装栈,队列

1.栈: stack.cpp #include "stack.h"Stack::Stack():top(nullptr),len(0){} //析构函数 Stack::~Stack() {while(!empty()){pop();} }bool Stack::empty() //判断栈是否为空 {return topnullptr; }int Stack::size()//获取栈的大小 {return len; } //压…...

Python多个set中的交集

Python多个set中的交集 在 Python 中,集合(set)是一种非常有用的数据结构,它可以存储唯一的元素,并提供了高效的数学集合操作,包括求交集、并集和差集等。本文将重点介绍如何通过多重集合求交集&#xff0…...

百度百科 X-Bk-Token 算法还原

声明 本文章中所有内容仅供学习交流,严禁用于商业用途和非法用途,否则由此产生的一切后果均与作者无关,若有侵权,请私信我立即删除! 文章目录 声明案例地址参数分析X-Bk-Token算法追踪X-Bk-Token后缀算法还原c 值跟踪与算法还原往期逆向文章推荐最近太忙了,博客摆烂了好…...

RUST语言的初印象-从一个模拟登陆谈起-slint+reqwest+aes

本文就一个做了三四天的小程序讲第一次学用RUST的感受,内附代码。 了角语言 从一些渠道听说了R,这个字母挺魔性,那个文章说C和R的团体已经上升到了宗教崇拜的高度,然后,我觉得必 有过人之处,大约10年没碰…...

HBase批量写入优化

HBase批量写入性能优化 对于HBase的批量写入性能优化,可以考虑以下几点: 1.批量写入操作:使用HBasef的批量写入操作可以显著提高性能。将多个写入操作放在一个批次中一起提交。这样可以减少网络通信开销和减少多次写入操作的开销。方法不限。…...

江协科技STM32学习- P19 TIM编码器接口

🚀write in front🚀 🔎大家好,我是黄桃罐头,希望你看完之后,能对你有所帮助,不足请指正!共同学习交流 🎁欢迎各位→点赞👍 收藏⭐️ 留言📝​…...

文件上传、重定向、Gin路由

文件上传 单个文件上传 index.html 文件上传前端页面代码&#xff1a; <!DOCTYPE html> <html lang"zh-CN"> <head><title>index</title> </head> <body> <form action"/upload" method"post"…...

躺平成长:微信小程序运营日记第二天

在进行属于生活的开源之后&#xff0c;自己更加感受到自己存在的渺茫&#xff0c;同时更加开始深刻领会&#xff0c;开源的重要性&#xff0c;在开源&#xff0c;开放&#xff0c;创造&#xff0c;再创新的思维模式下&#xff0c;不发布八部金刚功相关的训练视频&#xff0c;自…...

三分钟速览:Node.js 版本差异与关键特性解析

Node.js 是一个广泛使用的 JavaScript 运行时环境&#xff0c;允许开发者在服务器端运行 JavaScript 代码。随着技术的发展&#xff0c;Node.js 不断推出新版本&#xff0c;引入新特性和改进。了解不同版本之间的差异对于开发者来说至关重要。以下是一个快速指南&#xff0c;帮…...

git创建新分支

git创建新分支 1.先在gitLab上New branch. 2.本地右键git小乌 - /切换/检出-创建新分支&#xff0c;分支名称和上一步创建的一样。 最后记得改个文件提交下&#xff0c;看看gitLab上是否提交成功。...

Chip-seq数据分析处理流程

一、处理过程 要处理 SRR14879780 的 ChIP-seq 数据并进行基序分析&#xff08;包括比对到参考基因组 hg38.fasta 和峰值调用&#xff09;&#xff0c;你可以按照以下步骤操作&#xff0c;并使用相应的代码。每个步骤会涉及一些常用的生物信息学工具&#xff0c;如 FastQC、Tr…...

spring boot3.2.x与spring boot2.7.x对比

Spring Boot 3.2.x 相比 Spring Boot 2.7.x 带来了许多重要的变化、新特性以及性能改进。这些新功能不仅提升了开发者的效率&#xff0c;还优化了应用的性能和安全性。以下是两者的主要差异、优势以及使用说明&#xff1a; 1. JDK 17 支持 Spring Boot 2.7.x 支持 JDK 8 至 J…...

Vue2(十三):路由

一、路由的简介 vue-rooter&#xff1a;是vue的一个插件库&#xff0c;专门用来实现SPA应用 1.对SPA应用的理解 1、单页 Web 应用&#xff08;single page web application&#xff0c;SPA&#xff09;。 2、整个应用只有一个完整的页面 index.html。 3、点击页面中的导航链…...

Java并发:互斥锁,读写锁,公平锁,Condition,StampedLock

阅读本文之前可以看一看 Java 多线程基础&#xff1a; Java&#xff1a;多线程&#xff08;进程线程&#xff0c;线程状态&#xff0c;创建线程&#xff0c;线程操作&#xff09; Java&#xff1a;多线程&#xff08;同步死锁&#xff0c;锁&原子变量&#xff0c;线程通信&…...

在 Linux 中,要让某一个线程或进程排他性地独占一个 CPU

文章目录 1. CPU 亲和性(CPU Affinity)2. 中断隔离(IRQ Isolation)3. 系统 tickless 模式(NoHZ Mode)4. 实时调度策略5. CPU 隔离(CPU Isolation)和 Full CPU Isolation实现最低的延迟抖动在 Linux 中,要让某一个线程 排他性地独占一个 CPU,并且进一步隔离中断(包括…...

DockerHub与私有镜像仓库在容器化中的应用与管理

哈喽&#xff0c;大家好&#xff0c;我是左手python&#xff01; Docker Hub的应用与管理 Docker Hub的基本概念与使用方法 Docker Hub是Docker官方提供的一个公共镜像仓库&#xff0c;用户可以在其中找到各种操作系统、软件和应用的镜像。开发者可以通过Docker Hub轻松获取所…...

3.3.1_1 检错编码(奇偶校验码)

从这节课开始&#xff0c;我们会探讨数据链路层的差错控制功能&#xff0c;差错控制功能的主要目标是要发现并且解决一个帧内部的位错误&#xff0c;我们需要使用特殊的编码技术去发现帧内部的位错误&#xff0c;当我们发现位错误之后&#xff0c;通常来说有两种解决方案。第一…...

java 实现excel文件转pdf | 无水印 | 无限制

文章目录 目录 文章目录 前言 1.项目远程仓库配置 2.pom文件引入相关依赖 3.代码破解 二、Excel转PDF 1.代码实现 2.Aspose.License.xml 授权文件 总结 前言 java处理excel转pdf一直没找到什么好用的免费jar包工具,自己手写的难度,恐怕高级程序员花费一年的事件,也…...

大数据学习(132)-HIve数据分析

​​​​&#x1f34b;&#x1f34b;大数据学习&#x1f34b;&#x1f34b; &#x1f525;系列专栏&#xff1a; &#x1f451;哲学语录: 用力所能及&#xff0c;改变世界。 &#x1f496;如果觉得博主的文章还不错的话&#xff0c;请点赞&#x1f44d;收藏⭐️留言&#x1f4…...

使用 SymPy 进行向量和矩阵的高级操作

在科学计算和工程领域&#xff0c;向量和矩阵操作是解决问题的核心技能之一。Python 的 SymPy 库提供了强大的符号计算功能&#xff0c;能够高效地处理向量和矩阵的各种操作。本文将深入探讨如何使用 SymPy 进行向量和矩阵的创建、合并以及维度拓展等操作&#xff0c;并通过具体…...

【从零学习JVM|第三篇】类的生命周期(高频面试题)

前言&#xff1a; 在Java编程中&#xff0c;类的生命周期是指类从被加载到内存中开始&#xff0c;到被卸载出内存为止的整个过程。了解类的生命周期对于理解Java程序的运行机制以及性能优化非常重要。本文会深入探寻类的生命周期&#xff0c;让读者对此有深刻印象。 目录 ​…...

Linux nano命令的基本使用

参考资料 GNU nanoを使いこなすnano基础 目录 一. 简介二. 文件打开2.1 普通方式打开文件2.2 只读方式打开文件 三. 文件查看3.1 打开文件时&#xff0c;显示行号3.2 翻页查看 四. 文件编辑4.1 Ctrl K 复制 和 Ctrl U 粘贴4.2 Alt/Esc U 撤回 五. 文件保存与退出5.1 Ctrl …...

python爬虫——气象数据爬取

一、导入库与全局配置 python 运行 import json import datetime import time import requests from sqlalchemy import create_engine import csv import pandas as pd作用&#xff1a; 引入数据解析、网络请求、时间处理、数据库操作等所需库。requests&#xff1a;发送 …...

【C++】纯虚函数类外可以写实现吗?

1. 答案 先说答案&#xff0c;可以。 2.代码测试 .h头文件 #include <iostream> #include <string>// 抽象基类 class AbstractBase { public:AbstractBase() default;virtual ~AbstractBase() default; // 默认析构函数public:virtual int PureVirtualFunct…...

使用SSE解决获取状态不一致问题

使用SSE解决获取状态不一致问题 1. 问题描述2. SSE介绍2.1 SSE 的工作原理2.2 SSE 的事件格式规范2.3 SSE与其他技术对比2.4 SSE 的优缺点 3. 实战代码 1. 问题描述 目前做的一个功能是上传多个文件&#xff0c;这个上传文件是整体功能的一部分&#xff0c;文件在上传的过程中…...