uni-app微信小程序支付流程 uni-app接入微信支付详细代码

胖涛同学_2152

胖涛同学_2152

2026-05-21

536人浏览

原创

五个必填参数(timeStamp、nonceStr、package、signType、paySign)必须由后端调用微信统一下单接口获取prepay_id后,在服务端按微信签名规则生成并返回,前端不可自行拼接或签名。

uni-app微信小程序支付流程 uni-app接入微信支付详细代码

uni.requestPayment 的五个必填参数从哪来

这五个参数——timeStamp、nonceStr、package、signType、paySign——**必须由后端生成并返回,前端不能自己拼或签名**。微信支付要求签名在服务端完成,否则 paySign 无效,调用 uni.requestPayment 会直接报错 errCode: -2(用户取消)或静默失败。

常见错误现象:

  • 前端自己用 MD5 拼接字符串生成 paySign → 微信校验不通过,支付弹窗不出现
  • 后端返回的 package 缺少 prepay_id= 前缀 → uni.requestPayment 报 “invalid package”
  • timeStamp 传了毫秒时间戳(如 Date.now())→ 应为**秒级时间戳**,微信会拒绝

正确做法是:后端调用微信统一下单接口(/pay/unifiedorder),拿到 prepay_id 后,按微信 V3 或 V2 签名规则生成完整参数对象,再返回给前端。

服务端生成 paySign 的关键逻辑(以 Node.js 为例)

签名不是简单哈希,而是对特定字段按字典序拼接 + 密钥后计算。V2 接口要求如下:

  • 参与签名字段: appId、nonceStr、package、signType、timeStamp、mchId(注意:V2 签名需含 mchId,但前端 uni.requestPayment 不需要传它)
  • 拼接格式:key1=value1&key2=value2&...&keyN=valueN&key=YOUR_API_KEY
  • 签名方式:signType 默认为 MD5,输出大写 32 位 hex 字符串

示例(Node.js):

微信公众号发文助手
微信公众号发文助手

微信公众号产业研究发文助手,支持原文读取、分层摘要、产业链标的梳理、image2 海报与封面生成、正文排版、微信草稿保存、回读校验和发布前确认。

下载
const crypto = require('crypto')
function genPaySign(params, apiKey) {
  const keys = Object.keys(params).sort()
  const str = keys.map(k => `${k}=${params[k]}`).join('&') + `&key=${apiKey}`
  return crypto.createHash('md5').update(str, 'utf8').digest('hex').toUpperCase()
}
// 调用时传入 { appId, nonceStr, package, signType, timeStamp, mchId }
// 注意:mchId 是签名必需字段,但不在前端 requestPayment 参数里

uni.requestPayment 调用时容易漏掉的细节

即使后端参数全对,前端调用仍可能失败,原因常藏在以下几点:

  • provider 必须写死为 "wxpay",不是 "weixin" 或 "wechat"
  • package 值必须是完整字符串 "prepay_id=wx1234567890",开头不能有多余空格或换行
  • timeStamp 必须是数字类型(不是字符串),且为**整数秒**,例如 Math.floor(Date.now() / 1000)
  • 调试阶段若用自定义基座,需确认 manifest.json 中已勾选“微信支付”,且 AppID 填写正确(小程序用小程序 AppID,非公众号或开放平台)

典型调用片段:

uni.requestPayment({
  provider: 'wxpay',
  timeStamp: orderInfo.timeStamp, // number 类型
  nonceStr: orderInfo.nonceStr,
  package: orderInfo.package, // 必须含 prepay_id=
  signType: orderInfo.signType || 'MD5',
  paySign: orderInfo.paySign,
  success(res) {
    console.log('支付成功', res) // res.errMsg === 'requestPayment:ok'
  },
  fail(err) {
    if (err.errMsg === 'requestPayment:fail cancel') {
      console.log('用户取消')
    } else {
      console.error('支付异常', err)
    }
  }
})

回调地址 notify_url 为什么总收不到通知

微信支付成功后,会向你后端配置的 notify_url 发起 POST 请求,但开发者常遇到“收不到”或“收到空体”。根本原因不是代码没写,而是微信的硬性校验:

  • 域名必须已备案,且在微信商户平台「产品中心 → 开发配置 → 支付授权目录」中添加(注意:是目录,不是单个 URL)
  • 接口必须支持 HTTPS,且 SSL 证书有效(自签名证书不行)
  • 微信回调 body 是 XML 格式,且**不带 Content-Type 头**,部分框架(如 Express)默认不解析无类型的 POST,需显式启用 app.use(express.raw({ type: '*/*' }))
  • 收到后必须返回 SUCCESSOK,且 HTTP 状态码为 200,多一个空格或换行都会被当失败重试

最易忽略的一点:微信回调是**异步且不可靠的**,不能只依赖它更新订单状态;必须配合后端主动查单(/pay/orderquery)或监听云函数触发事件做兜底。

相关文章

微信app下载
微信app下载

微信是一款手机通信软件,支持通过手机网络发送语音短信、视频、图片和文字。微信可以单聊及群聊,还能根据地理位置找到附近的人,带给大家全新的移动沟通体验,有需要的小伙伴快来保存下载体验吧!

下载

本站声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn

相关专题

更多
python是前端还是后端
python是前端还是后端

Python属于前端也属于后端,其灵活性和丰富的生态系统使得开发人员能够在不同的领域中灵活运用。本专题为大家提供python相关的文章、下载、课程内容,供大家免费下载体验。

2023.08.11

2703

5

前端如何实现即时通讯
前端如何实现即时通讯

实现即时通讯的方法有WebSocket、Long Polling、Server-Sent Events、WebRTC等等。详细介绍:1、WebSocket,它可以在客户端和服务器之间建立持久连接,实现实时的双向通信,前端可以使用 WebSocket API来创建WebSocket连接,并通过发送和接收消息来实现即时通讯;2、Long Polling,是一种模拟实时通信的技术等等。

2023.10.09

5863

6

前端和后端的区别
前端和后端的区别

前端关注的是用户界面的设计和交互,而后端则注重数据处理和逻辑控制。想了解更多前端后端的相关内容,可以阅读本专题下面的文章。

2024.03.19

6830

13

php和前端的关联介绍
php和前端的关联介绍

php既可以作为前端语言,也可以作为后端语言。想了解更多php和前端的相关内容,可以阅读本专题下面的文章。

2024.03.22

6558

10

前端外包工作内容有哪些
前端外包工作内容有哪些

前端外包工作内容包括:1. 网站和应用程序开发;2. 用户界面和交互设计;3. 用户体验优化;4. 设计和视觉开发;5. 跨浏览器兼容性;6. 性能优化;7. 维护和更新;8. 项目管理和沟通。想了解更多前端的相关内容,可以阅读本专题下面的文章。

2024.05.22

943

5

Vite 项目如何打包和部署
Vite 项目如何打包和部署

Vite项目打包部署专题汇集生产构建、产物预览、输出目录、资源路径、Nginx与GitHub Pages部署及常见白屏和路由404问题的已审核文章,帮助读者完成上线流程。

2026.10.28

0

16

Vite 如何搭配 Vue.js
Vite 如何搭配 Vue.js

Vite搭配Vue.js专题汇集创建Vue 3项目、配置开发环境、路径别名、Vue插件、代理、多环境构建与调试的已审核文章,帮助读者完成从初始化到日常开发的配置。

2026.10.28

0

15

Vite 项目目录怎么看
Vite 项目目录怎么看

Vite项目目录专题汇集入口文件、src源码、public静态资源、路径别名、项目根目录和构建输出目录相关的已审核文章,帮助读者理解各文件夹的用途与引用方式。

2026.10.28

0

10

Gradle插件开发入门教程
Gradle插件开发入门教程

本专题介绍Gradle插件开发的基本流程,涵盖插件类编写、自定义任务注册、扩展参数设计和插件应用方法,帮助你理解插件如何组织构建逻辑,减少多个项目之间的重复配置。

2026.10.22

120

11

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
uni-app从入门到实战教程
uni-app从入门到实战教程

共0课时 | 0人学习

uni-app x harmony开发指南
uni-app x harmony开发指南

共0课时 | 0人学习

uni-app鸿蒙运行和发行
uni-app鸿蒙运行和发行

共0课时 | 0人学习