Appearance
项目启动 ¶
基础环境搭建 ¶
数据库 ¶
启动或者找一台可以使用的MySQL实例，同时在后端项目中
_config/sql目录下找到dax-pay.sql数据库脚本文件。
在数据库中新建一个
dax-pay的schema空间，编码集选择utf8mb4。将
dax-pay.sql数据库脚本文件导入进去。
Redis ¶
启动一个Redis实例，记录可进行连接的各项信息，以备后续使用。
不需要进行额外操作
项目下载 ¶
后端下载
后端项目地址: https://gitee.com/dromara/dax-pay ，
执行命令：git clone https://gitee.com/dromara/dax-pay-ui
前端下载
PC前端项目地址: https://gitee.com/bootx/dax-pay-ui ，
执行命令：git clone https://gitee.com/bootx/dax-pay-ui.git
H5前端项目地址: https://gitee.com/bootx/dax-pay-h5 ，
执行命令：git clone https://gitee.com/bootx/dax-pay-h5.git
项目启动（后端） ¶
基础环境要求
| 名称 | 介绍 | 参考版本 |
|---|---|---|
| JDK | Java运行环境 | 1.8/11，推荐使用1.8 |
| Maven | 项目构建工具 | 推荐版本3.6.x及以上 |
| IDE | 集成开发工具 | IntelliJ IDEA |
| MySQL | 数据库 | 5.7.X和8.X，推荐使用5.7系列版本，8.X需要设置为大小写不敏感 |
| Redis | 缓存中间件 | 推荐使用5.0及以上版本 |
- 将项目导入到
IDEA中，等待依赖下载完毕 - 找到
daxpay-single下的daxpay-single-start模块，打开配置文件，将其中的数据库连接地址和Redis缓存连接地址更换为真实的地址。 - 打开本模块的
DaxpaySingleStart类文件并运行，启动项目，当控制台打印下列内容说明启动成功。 - 登录系统中，将支付相关的各种定时任务进行开启。
shell
----------------------------------------------------------
应用 'dax-pay-single' 运行成功!
Swagger文档: http://192.168.1.12:9000/doc.html
----------------------------------------------------------项目启动（PC前端） ¶
基础环境要求
| 环境 | 版本 | 备注 |
|---|---|---|
| Node | 18/20 | 推荐使用20 |
| pnpm | 8.0.0 - 8.5.1 | 推荐直接使用8.5.1版本，更高版本会导致 pnpm-lock.yaml 失效 |
使用Vs Code或Webstorm打开项目，然后执行以下命令启动项目：
shell
# 安装项目依赖
pnpm install
# 启动项目
pnpm run dev当控制台出现下列内容时说明启动成功：
shell
VITE v4.5.1 ready in 8797 ms
➜ Local: https://localhost:3100/ 13:56:35
➜ Network: https://192.168.1.12:3100/ 13:56:35
➜ press h to show help 13:56:35启动成功后，点击访问即可，默认的账号密码为：bootx/123456
项目启动（H5前端） ¶
基础环境要求
| 环境 | 版本 | 备注 |
|---|---|---|
| Node | 18+ | 推荐使用20.9.0 |
| pnpm | >=8.6.10 | 推荐直接使用8.6.1,版本，否则依赖可能安装不上 |
使用Vs Code或Webstorm打开项目，然后执行以下命令启动项目：
shell
# 安装项目依赖
pnpm install
# 启动项目
pnpm run dev当控制台出现下列内容时说明启动成功：
shell
VITE v5.0.10 ready in 1886 ms
➜ Local: http://localhost:9100/h5 12:29:51
➜ Network: http://192.168.11.229:9100/h5 12:29:51
➜ press h + enter to show help本地调试示例 ¶
提示
因为支付系统会涉及到一些三方支付网关的交互，以及例如微信授权域名、jsapi安全域名的限制，所以本地调试时，对一些回调和手机端上的操作，需要做一些特殊处理。 假定我们拥有一个域名www.daxpay.com，并且该域名已经备案，下面就是举一个开发时进行调试的例子。
准备内网穿透 ¶
因为开发时，需要接收各种回调请求，以及手机端开发时，需要能够从外网进行访问，通常我们需要使用内网穿透工具，比如
ngrok、frp等，具体可以自行搜索相关资料。
Nginx配置 ¶
在本机安装Nginx，用来转发内网穿透的进来的请求，主要对服务端和手机端进行分发，PC端不映射到外网也不影响开发，所以不做处理。
nginx.conf配置如下：
shell
worker_processes 1;
events {
worker_connections 1024;
}
http {
include mime.types;
default_type application/octet-stream;
sendfile on;
keepalive_timeout 65;
server {
listen 9999;
# 这个是你用来内网穿透的地址
server_name www.daxpay.cn;
# 手机移动端网站， 用于手机进行调试时使用
location ^~/h5 {
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header REMOTE-HOST $remote_addr;
proxy_buffering on;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "upgrade";
# H5端在本机的访问路径上
proxy_pass http://localhost:9100/h5;
}
# 将后端接口以 /server 开头的方式映射出去, 供回调、H5端调用接口时进行使用
location /server/ {
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header REMOTE-HOST $remote_addr;
proxy_buffering on;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "upgrade";
# 后端在本机的访问路径上
proxy_pass http://localhost:9000/;
}
error_page 500 502 503 504 /50x.html;
location = /50x.html {
root html;
}
}
}H5前端配置和启动 ¶
PC端直接启动就可以，不需要进行额外的配置，H5端需要配置
网站根目录为/h5和接口前缀为/server，从而让H5移动端在外网被访问时， 可以正常被访问以及能够正常调用后端接口。
properties
# 端口号
VITE_PORT = 9100
# 网站根目录
VITE_PUBLIC_PATH = /h5
# 是否删除console
VITE_DROP_CONSOLE = true
# 跨域代理，可以配置多个，请注意不要换行
VITE_PROXY=[["/server","http://localhost:9000"]]
# API 接口地址
# 如果没有跨域问题，直接在这里配置即可
VITE_GLOB_API_URL =
# 图片上传地址
VITE_GLOB_UPLOAD_URL =
# 图片前缀地址
VITE_GLOB_IMG_URL =
# 接口前缀
VITE_GLOB_API_URL_PREFIX = /serverPC端前端 ¶
PC端不映射到外网也不影响开发，不需要进行特殊的处理，所以以默认的方式启动即可。
服务端 ¶
外网请求到服务端的数据经过Nginx进行转发，所以不需要进行特殊的配置，所以以默认的方式启动即可。