微信小程序在线支付集成

2025-04-24

以下是为您整理的 微信小程序在线支付集成 全流程指南,涵盖技术实现、安全规范、避坑要点及代码示例:


一、集成前准备

1. 资质与配置

步骤操作说明
注册微信支付商户号登录微信支付商户平台申请,需企业资质(个体户可申请)
绑定小程序与商户号小程序后台→「微信支付」→「商户号管理」中关联
获取支付密钥商户平台→「账户中心」→「API安全」→设置API密钥(32位,需妥善保管)
配置服务器域名小程序后台→「开发管理」→「服务器域名」添加https://api.mch.weixin.qq.com

二、支付全流程时序图

plaintext
复制
下载
1. 用户点击支付 → 2. 小程序向业务服务器请求预支付 → 3. 业务服务器调用微信统一下单API → 4. 微信返回prepay_id → 5. 业务服务器生成支付签名返回小程序 → 6. 小程序调起微信支付界面 → 7. 用户输入密码完成支付 → 8. 微信异步通知支付结果 → 9. 业务服务器处理通知并更新订单状态

三、后端核心代码实现(Node.js示例)

1. 统一下单接口

javascript
复制
下载
const axios =require('axios');const crypto =require('crypto');// 生成签名函数functioncreateSign(params, key){const stringA = Object.keys(params).sort().map(k=>`${k}=${params[k]}`).join('&');const stringSignTemp = stringA +`&key=${key}`;return crypto.createHash('md5').update(stringSignTemp).digest('hex').toUpperCase();}// 调用统一下单asyncfunctioncreateOrder(orderData){const unifiedOrderUrl ='https://api.mch.weixin.qq.com/pay/unifiedorder';const params ={appid:'小程序APPID',mch_id:'商户号',nonce_str: Math.random().toString(36).substr(2,15),body:'商品描述',out_trade_no:'商户订单号',total_fee:100,// 单位:分spbill_create_ip:'用户IP',notify_url:'支付回调地址',trade_type:'JSAPI',openid:'用户openid'// 从小程序wx.login获取code换取}; params.sign =createSign(params,'API密钥');const response =await axios.post(unifiedOrderUrl,`<xml>${Object.entries(params).map(([k,v])=>`<${k}>${v}</${k}>`).join('')}</xml>`,{headers:{'Content-Type':'text/xml'}});// 解析XML返回prepay_idreturnparseXmlResponse(response.data);}

2. 支付结果通知处理

javascript
复制
下载
// 微信回调验证 app.post('/notify',(req, res)=>{let xmlData =''; req.on('data',chunk=> xmlData += chunk); req.on('end',()=>{const result =parseXml(xmlData);const sign = result.sign;delete result.sign;const localSign =createSign(result,'API密钥');if(sign === localSign && result.return_code ==='SUCCESS'){// 更新订单状态为已支付 res.send('<xml><return_code>SUCCESS</return_code><return_msg>OK</return_msg></xml>');}else{ res.status(500).send('签名校验失败');}});});

四、小程序端调用支付

javascript
复制
下载
// 获取支付参数 wx.request({url:'https://your-server.com/create-order',method:'POST',data:{productId:123},success(res){const{ timeStamp, nonceStr,package: prepay_id, signType, paySign }= res.data; wx.requestPayment({ timeStamp, nonceStr,package: prepay_id,signType:'MD5',// 或 'HMAC-SHA256' paySign,success:()=> console.log('支付成功'),fail:(err)=> console.error('支付失败', err)});}});

五、安全与避坑指南

常见问题解决方案
签名错误(SIGNERROR)检查参数顺序、编码格式、API密钥是否正确,使用微信官方签名工具验证
商户订单号重复保证out_trade_no全局唯一,建议格式:日期(8位) + 随机字符串(10位)
异步通知丢失主动调用订单查询接口补偿
跨平台支付兼容若需同时支持APP/H5,需申请多个商户号或使用服务商模式
用户取消支付监听fail回调,提示“支付已取消”并允许重新发起

六、高级功能扩展

  1. 分账功能

    • 使用profit_sharing接口,需商户号开通分账权限,单笔订单最多分账20方

  2. 支付即会员

    • 支付成功后通过user_id自动绑定会员体系

  3. 电子发票

    • 集成微信电子发票接口,用户支付后一键开票


七、测试与上线

  1. 沙箱环境测试

  2. 日志监控

    • 记录关键节点日志(预支付请求、回调处理),推荐接入Sentry/ELK

  3. 灰度发布

    • 先对10%用户开放支付功能,验证稳定性


附:官方文档索引

如需进一步调试协助,可提供具体报错信息或业务场景(如虚拟商品/实物商品),针对性提供解决方案。


其它案例