# wechat-pay

**Repository Path**: Marsfactory/wechat-pay

## Basic Information

- **Project Name**: wechat-pay
- **Description**: 微信支付 测试小案例（微信扫码支付，支付回调，退款功能）
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 5
- **Forks**: 3
- **Created**: 2026-07-14
- **Last Updated**: 2026-07-26

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 微信扫码支付 Demo

基于 **Spring Boot 3 + Vue 3 + Naive UI + MySQL + 微信支付 V3（Native 扫码支付）** 的前后端分离小案例。

## 项目结构

```
wechat-pay/
├── backend/          # Spring Boot 3 后端
├── web/              # Vue 3 + Naive UI 前端
└── wechat.txt        # 微信支付参数（请勿提交到公开仓库）
```

## 功能说明

1. 前端填写商品描述和金额，点击「生成支付二维码」
2. 后端调用微信支付 V3 Native 接口，返回 `code_url`
3. 前端将 `code_url` 渲染为二维码，用户微信扫码支付
4. 微信支付成功后回调 `notify-url`，后端更新订单状态
5. 前端轮询订单状态，支付成功后自动提示

## 环境要求

- JDK 17+
- Maven 3.8+
- Node.js 18+
- MySQL 8.0+

## 快速开始

### 1. 初始化数据库

```sql
-- 执行 backend/sql/init.sql
CREATE DATABASE IF NOT EXISTS wechat_pay DEFAULT CHARACTER SET utf8mb4;
```

修改 `backend/src/main/resources/application.yml` 中的数据库账号密码：

```yaml
spring:
  datasource:
    username: root
    password: 你的密码
```

### 2. 配置微信支付

支付参数已写入 `application.yml`（来自 `wechat.txt`）。

**重要：** `notify-url` 必须是公网可访问的 HTTPS 地址，微信才能回调。本地开发可使用 [ngrok](https://ngrok.com/) 或 [cpolar](https://www.cpolar.com/) 内网穿透：

```yaml
wechat:
  pay:
    notify-url: https://你的公网域名/api/pay/notify/wechat
```

### 3. 启动后端

```bash
cd backend
mvn spring-boot:run
```

后端默认运行在 `http://localhost:8080`

### 4. 启动前端

```bash
cd web
npm install
npm run dev
```

前端默认运行在 `http://localhost:5173`，已配置代理转发 `/api` 到后端。

## API 接口

| 方法 | 路径 | 说明 |
|------|------|------|
| POST | `/api/pay/create` | 创建扫码支付订单 |
| GET | `/api/pay/status/{orderNo}` | 查询订单状态 |
| POST | `/api/pay/notify/wechat` | 微信支付回调（微信服务器调用） |

### 创建订单请求示例

```json
{
  "amount": 1,
  "description": "测试商品"
}
```

> `amount` 单位为**分**，1 = 0.01 元

### 创建订单响应示例

```json
{
  "code": 0,
  "message": "success",
  "data": {
    "orderNo": "WX20250714120000ABCDEF12",
    "codeUrl": "weixin://wxpay/bizpayurl?pr=xxxxx",
    "amount": 1,
    "description": "测试商品",
    "status": "PENDING"
  }
}
```

## 支付流程

```
用户下单 → 后端创建订单 → 调用微信 Native 下单 → 返回 code_url
    → 前端展示二维码 → 用户微信扫码支付
    → 微信回调 notify-url → 后端验签并更新订单为 PAID
    → 前端轮询到 PAID → 显示支付成功
```

## 注意事项

1. **密钥安全**：`private-key`、`api-v3-key` 等敏感信息不要提交到 Git 公开仓库
2. **回调地址**：`notify-url` 必须 HTTPS 且公网可达
3. **商户配置**：使用的是 2025 年后新商户的「微信支付公钥」模式（`public-key-id` + `public-key`）
4. **测试金额**：建议先用 0.01 元测试

## 技术栈

**后端**
- Spring Boot 3.2
- Spring Data JPA
- MySQL
- 微信支付官方 Java SDK `wechatpay-java`

**前端**
- Vue 3 + TypeScript
- Vite
- Naive UI
- Axios
- QRCode.js