小程序微信支付对接实战：从配置到上线全流程

最新推荐文章于 2025-07-28 15:27:45 发布

独立开发者阿乐

最新推荐文章于 2025-07-28 15:27:45 发布

阅读量788

点赞数 24

CC 4.0 BY-SA版权

分类专栏：综合性原创文章标签：小程序微信 notepad++ 支付微信支付 API API接入

本文链接：https://blog.csdn.net/haokeji2013/article/details/149682369

#算法先锋·半月创作挑战赛#

文章目录

微信小程序对接微信支付全流程指南

微信小程序对接微信支付全流程指南

在这里插入图片描述

🌐 我的个人网站：乐乐主题创作室

微信支付作为微信生态内最核心的支付能力，为小程序提供了安全、便捷的支付解决方案。本文将详细介绍如何在小程序中完整对接微信支付功能，包括从前期准备、接口调用到安全优化的全流程。

一、前期准备工作

1.1 资质申请与配置

在开始开发前，需要确保已完成以下准备工作：

企业资质认证：
- 已完成微信公众平台的企业认证
- 已开通微信支付商户号（需提交营业执照、法人身份证等材料）

小程序后台配置：

// 登录小程序后台 => 开发 => 开发设置 => 服务器域名
request合法域名需添加：
- https://api.mch.weixin.qq.com (微信支付API)
- https://api.weixin.qq.com (微信开放平台API)

商户号绑定：
- 在小程序后台"微信支付"菜单中关联商户号
- 设置API密钥(32位随机字符串，需妥善保管)

1.2 开发环境准备

推荐的技术栈配置：

后端：Node.js/Java/PHP等（本文以Node.js为例）
前端：小程序原生开发或Taro/Uniapp等框架
工具：微信开发者工具最新版

二、支付流程架构设计

微信小程序支付的标准流程如下：

sequenceDiagram
    participant 用户 as 用户
    participant 小程序 as 小程序前端
    participant 服务端 as 商户服务端
    participant 微信 as 微信支付系统
    
    用户->>小程序: 提交订单
    小程序->>服务端: 请求统一下单
    服务端->>微信: 调用统一下单API
    微信-->>服务端: 返回prepay_id
    服务端-->>小程序: 返回支付参数
    小程序->>微信: 调用wx.requestPayment
    微信-->>小程序: 返回支付结果
    小程序->>服务端: 通知支付结果
    服务端->>微信: 查询订单确认
    服务端-->>小程序: 更新订单状态

三、核心代码实现

3.1 服务端统一下单接口

const crypto = require('crypto');
const axios = require('axios');
const xml2js = require('xml2js');

/**
 * 微信支付统一下单
 * @param {Object} params 订单参数
 * @returns {Promise} 返回支付参数
 */
async function createUnifiedOrder(params) {
   
   
  const {
   
   
    appid,          // 小程序appid
    mch_id,         // 商户号
    nonce_str,      // 随机字符串
    body,           // 商品描述
    out_trade_no,   // 商户订单号
    total_fee,      // 金额(分)
    spbill_create_ip, // 终端IP
    notify_url,      // 支付结果通知地址
    trade_type = 'JSAPI', // 交易类型
    openid          // 用户openid
  } = params;
  
  // 构造签名参数
  const signParams = {
   
   
    appid,
    mch_id,
    nonce_str,
    body,
    out_trade_no,
    total_fee,
    spbill_create_ip,
    notify_url,
    trade_type,
    openid
  };
  
  // 生成签名
  const sign = generateSign(signParams, API_KEY);
  
  // 构造XML数据
  const xmlData = `
    <xml>
      <appid>${
     
     appid}</appid>
      <mch_id>${
     
     mch_id}</mch_id>
      <nonce_str>${
     
     nonce_str}</nonce_str>
      <sign>${
     
     sign}</sign>
      <body>${
     
     body}</body>
      <out_trade_no>${
     
     out_trade_no}</out_trade_no>
      <total_fee>${
     
     total_fee}</total_fee>
      <spbill_create_ip>${
     
     spbill_create_ip}</spbill_create_ip>
      <notify_url>${
     
     notify_url}</notify_url>
      <trade_type>${
     
     trade_type}</trade_type>
      <openid>${
     
     openid}</openid>
    </xml>
  `;
  
  try {
   
   
    // 调用微信支付统一下单接口
    const response = await axios.post(
      'https://api.mch.weixin.qq.com/pay/unifiedorder',
      xmlData,
      {
   
    headers: {
   
    'Content-Type': 'text/xml' } }
    );
    
    // 解析XML响应
    const result