01、SpringBoot + MyBaits-Plus 集成微信支付 (基础支付API V3) --＞项目搭建

已于 2023-11-10 16:48:47 修改
阅读量300 收藏 1
点赞数
分类专栏： # SpringBoot 集成 微信支付 文章标签： spring boot 后端 微信支付 Vue
于 2023-11-03 11:06:24 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_44411039/article/details/134197093
版权

目录

SpringBoot + MyBaits-Plus 集成微信支付 (基础支付 API V3 接口) --＞项目搭建

后续的文章都是以最新的 V3 接口来实现的。

1、创建boot项目

创建SpringBoot项目，写一个测试方法，运行，成功则项目创建完成。
在这里插入图片描述

2、引入Swagger

作用：

自动生成接口文档和测试页面。

2-1、引入依赖

在这里插入图片描述

        <!--swagger  作用：自动生成接口文档和相关测试页面。-->
        <dependency>
            <groupId>io.springfox</groupId>
            <artifactId>springfox-swagger2</artifactId>
            <version>2.7.0</version>
        </dependency>
        <!--swagger ui  作用：展示具体的html页面、接口文档、测试页面-->
        <dependency>
            <groupId>io.springfox</groupId>
            <artifactId>springfox-swagger-ui</artifactId>
            <version>2.7.0</version>
        </dependency>

2-2、写配置文件进行测试

在这里插入图片描述

2-3、访问Swagger页面

在这里插入图片描述
在这里插入图片描述

2-4、注解优化显示

在这里插入图片描述
在这里插入图片描述

3、定义统一结果

作用：

作用：定义统一响应结果，为前端返回标准格式的数据。

3-1、引入lombok依赖

简化实体类的开发
在这里插入图片描述

3-2、写个统一结果的类–>R

在这里插入图片描述

在这里插入图片描述

链式操作–可以一直加data数据

在这里插入图片描述
在这里插入图片描述

R类的代码：
@Data
// 作用：让这个R对象可以进行链式操作，就是R.ok().setData(map) 这种
// 而且原本setData的返回值是void，加了这个注解，返回值就是R对象了
@Accessors(chain = true)
public class R
{
    private Integer code; //响应码
    private String message; // 响应消息
    private Map<String, Object> data = new HashMap<>();

    //成功响应的方法
    public static R ok(){
        R r = new R();
        r.setCode(0);
        r.setMessage("成功");
        return r;
    }

    //响应失败的方法
    public static R error(){
        R r = new R();
        r.setCode(-1);
        r.setMessage("失败");
        return r;
    }

    // 返回的数据
    public R data(String key , Object value){
        this.data.put(key,value);
        return this;
    }
}
3-3、swagger的样子

顺便配置json日期格式
在这里插入图片描述

4、数据库连接

4-1、命令行创建数据库

win+r ，输入cmd 打开小黑窗

mysql -uroot -p

记得后面加分号

mysql> create database payment_demo;

在这里插入图片描述

在 navicat 可以看到已经创建出来的数据库

在这里插入图片描述

4-2、Idea 连接数据库

在这里插入图片描述

时区问题
在这里插入图片描述
直接点这个 set time zone，然后点 apply 应用
在这里插入图片描述

4-3、执行sql脚本

在这里插入图片描述
从navicat可以看出有这些表了
在这里插入图片描述

5、集成MyBatis-Plus

5-1、引入依赖

在这里插入图片描述

        <!--mysql驱动-->
        <dependency>
            <groupId>mysql</groupId>
            <artifactId>mysql-connector-java</artifactId>
        </dependency>
        <!--持久层   mybatis-plus 是 mybatis 的增强-->
        <dependency>
            <groupId>com.baomidou</groupId>
            <artifactId>mybatis-plus-boot-starter</artifactId>
            <version>3.3.1</version>
        </dependency>

5-2、配置文件配置数据库连接

在spring的节点下配置数据库连接

在这里插入图片描述

server:
  port: 8090  # 项目的服务端口

spring:
  application:
    name: payment-demo # 项目的名字
  jackson:
    # 日期格式
    date-format: yyyy-MM-dd HH:mm:ss
    # 时区
    time-zone: GMT+8
  datasource: # mysql数据库连接
    driver-class-name: com.mysql.cj.jdbc.Driver
    url: jdbc:mysql://localhost:3306/payment_demo?serverTimezone=GMT%2B8&characterEncoding=utf-8
    username: root
    password: 123456

5-3、定义实体类

拷贝导入这些基本代码 ：实体类、service、impl、mapper
这些是学习视频提供的基本代码，太多了就不展示出来了。有用到再截图
在这里插入图片描述

5-4、定义 MyBatis-Plus 的配置文件

创建一个 MyBatis-Plus 的配置文件

在这里插入图片描述

5-4-1、测试：获取所有商品数据
controller

在这里插入图片描述
方法中获取所有商品的list方法，有MyBatis-Plus提供

在这里插入图片描述

成功获取所有商品数据
在这里插入图片描述

5-4-2、target没有编译xml问题

maven 工具默认情况下，针对java目录下的非java文件不会执行编译的操作，所以就丢失了这个xml文件 ，因为目前还没有用到这些xml文件，所以项目可以正常运行，但是后面如果要写更复杂的持久层数据，需要用到这些xml文件，就会报错
在这里插入图片描述

5-4-3 解决方法

解决方法：两个步骤

步骤1：

因为maven工程在默认情况下 src/main/java 目录下的所有资源文件是不发布到 target 目录下的，我们在 pom 文件的 节点下配置一个资源发布过滤器

在<build> </build>范围内

在这里插入图片描述

        <!-- 项目打包时会将java目录中的*.xml文件也进行打包 -->
        <resources>
            <resource>
                <directory>src/main/java</directory>
                <includes>
                    <include>**/*.xml</include>
                </includes>
                <filtering>false</filtering>
            </resource>
        </resources>
测试步骤1：

先clean ，删掉 target 目录
在这里插入图片描述
然后重新编译，xml 目录就完整出现了
在这里插入图片描述

步骤2：

让运行环境能够找到这个target目录下的xml目录，
顺便添加个日志记录，只要执行到这些xml文件，就会打印出日志

在这里插入图片描述

测试步骤2：

测试这个sql 日志有没有生效：

访问下获取所有商品的接口
在这里插入图片描述
在这里插入图片描述

6、搭建前端环境

6-1、安装 Node.js 运行环境

除了更改安装地址，其他的直接下一步
在这里插入图片描述

6-2、检查版本号：

有版本号，说明安装这个 node 环境成功了
在这里插入图片描述

6-3、运行前端项目

这个项目是项目视频发布者提供的

命令行运行，如图，默认是8080端口

记得用管理员运行小黑窗

在这里插入图片描述
如图：基础页面

课程列表没有数据，因为跨域问题没解决，拿不到
在这里插入图片描述

6-4、前后端跨域

后端这里加个注解，前端的跨域代码还没看是怎么写的。
在这里插入图片描述

在这里插入图片描述

后端控制器类添加这个 @CrossOrigin，表示这个类的所有方法都支持跨域访问。
前端可以直接通过请求 http://localhost:8090/api/product/list 来获取数据，不需要再额外添加跨域相关的代码。
在这里插入图片描述

6-5、安装 Visual Studio Code 编译器

一直下一步安装就可以
在这里插入图片描述
在这里插入图片描述

6-5-1、修改背景颜色

在这里插入图片描述

6-5-2、修改左侧边框颜色

在这里插入图片描述
把代码改成这样，第一次改，拼拼凑凑，不知道对不对，反正左侧边框变白色了。
在这里插入图片描述

{
    
    "workbench.preferredDarkColorTheme": "Visual Studio Light",
      

    "workbench.colorCustomizations": {
        "[Default Light+]": {
            "activityBar.activeBackground": "#ffffff",
            "activityBar.background": "#eeeeee",
            "activityBar.foreground": "#000000"
        }
    },
    "workbench.colorTheme": "Default Light+",
    "editor.codeActionsOnSave": null
}
6-5-3、安装插件

安装这三个插件
在这里插入图片描述

使用这个编译器看前端的代码了

在这里插入图片描述

7、Vue.js 入门

Vue 就是一个渐进式 JavaScript 框架

Vue.js是一个前端框架，帮助我们快速构建前端项目。

使用vue有两种方式，一个是传统的在 html 文件中引入 js 脚本文件的方式，另一个是脚手架的方式。

我们的项目，使用的是脚手架的方式。

7-1、安装脚手架

安装完成才可以创建项目。

在这里插入图片描述

7-1-1、配置淘宝镜像
#经过下面的配置，所有的 npm install 都会经过淘宝的镜像地址下载
npm config set registry https://registry.npm.taobao.org

在这里插入图片描述

7-1-2、全局安装脚手架

-g 的意思就是：全局安装脚手架 ，就是会安装在我们的操作系统中

npm install -g @vue/cli

在这里插入图片描述
安装完成就可以创建vue项目了。

7-2、创建项目

先进入项目目录（Ctrl + ~），然后创建一个项目

输入命令 ： vue create vue-demo ， 创建一个 vue-demo 的项目

vue 就是我们刚刚安装的脚手架的一个命令

创建vue项目

在这里插入图片描述
创建成功

ctrl+L 相当于 linux 的clear，直接腾出空间

在这里插入图片描述

7-3、启动项目

进入项目文件夹，启动项目

因为项目默认端口号是 8080 ， 所以这里可以指定其他的端口号

在这里插入图片描述

7-4、访问项目

打开项目的默认页面 App.vue

这个 Vue 项目默认是没有 Html 文件的， 开发阶段都是 .vue 格式的，但是项目部署到生产服务器上面的话，这些文件就都会被转换为 html文件和 js 文件

在这里插入图片描述

默认的代码如图：

在这里插入图片描述

删掉一些默认的页面组件，填充自己的内容，

删除成最原始的这个样子。
在这里插入图片描述

7-5、创建项目遇到的问题

vue项目创建不成功的解决方法

7-6、安装 Vue 调试工具

7-6-1谷歌

原本 F12是这样的，没有vue调试窗口
在这里插入图片描述

安装
在这里插入图片描述
再按 F12 就能出现这个调试功能了。
在这里插入图片描述

7-6-2微软

微软浏览器可以直接搜索，安装完，退出浏览器，重新打开就出现了
在这里插入图片描述

7-7、一点前端知识

7-7-1、数据绑定

插值表达式 – 用 双大括号来表示
在这里插入图片描述

7-7-2、双向数据绑定

数据会绑定到组件，组件的改变也会影响数据定义
在这里插入图片描述

7-7-3、事件处理

定义事件，调用事件
在这里插入图片描述

网页弹出二维码支付功能 并能 真实支付成功

下一篇：网页弹出二维码支付功能并能真实支付成功

_L_J_H_
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
专栏目录
java怎么模拟查询账户余额_spring boot + mybatis 模拟银行系统余额查询、转账、存取钱功能实现...
weixin_34887818的博客
02-24 1990
一、准备工作新建一个数据库，数据库名字是tokenLogin，数据库内新建两张表，第一张是用户账户信息表，第二张是转账、入账、出账记录表，分别如下所示：1. sys_user用户账户信息表：CREATE TABLEtokenLogin.sys_user(`id`bigint NOT NULL comment 'ID',`username`varchar(50) comment '用户名',`pas...
springboot+mybatis实现查询(四)
在这个地方会介绍一些前端和后端的开发内容，暂时以JavaEE和Vue为主。
06-08 634
springboot+mybatis实现查询
SpringBoot集成微信支付V3版本流程(商户平台篇)
最新发布
weixin_67727883的博客
05-10 774
SpringBoot集成微信支付V3流程
SpringBoot整合微信支付
2401_84046677的博客
04-04 1035
手绘了下图所示的kafka知识大纲流程图（xmind文件不能上传，导出图片展现），但都可提供源文件给每位爱学习的朋友《一线大厂Java面试题解析+核心总结学习笔记+最新讲解视频+实战项目源码》点击传送门即可获取！自我介绍一下，小编13年上海交大毕业，曾经在小公司待过，也去过华为、OPPO等大厂，18年进入阿里一直到现在。深知大多数Java工程师，想要提升技能，往往是自己摸索成长或者是报班学习，但对于培训机构动则几千的学费，着实压力不小。自己不成体系的自学效果低效又漫长，而且极易碰到天花板技术停滞不前！
SpringBoot | SpringBoot中实现“微信支付“
m0_70720417的博客
10-28 3846
SpringBoot中实现"微信支付": 1.“微信支付”产品 2."微信支付"接入流程 3.“微信小程序支付”时序图： 3.1 “商家端JSAPI下单” 接口 3.2 “微信小程序端调起支付” 接口 4.微信支付准备工作： 4.1 获得微信支付平台证书、商户私钥文件 4.2 获取临时域名 (内网穿透) ： ①下载且安装软件 : cpolar ②获得 “Authtoken” 且配置 cpolar ，生成“内网穿透”工具配置文件 ③启动服务，临时获取到一个IP地址 (临时域名) 5.“微信小程序支付”代码：
SpringBoot 集成微信（微信支付）
weixin_45626288的博客
08-08 4230
SpringBoot 集成微信微信支付（APP支付）1.登录微信开发平台创建移动应用1.创建移动应用2.查看APP是否开通了支付功能并能获取到APPID2.登录微信商户平台1.设置或获取到API密钥3.导入依赖4.创建自己的微信配置类5.这下可以开始自己的业务模块了1. 创建服务接口2.创建接口实现类3.创建自己的控制类这里是我的接口请求类可以根据自己的业务随意定制 微信支付（APP支付） 1.登录微信开发平台创建移动应用 微信开发平台 1.创建移动应用 2.查看APP是否开通了支付功能并能获取到APPI
springboot+security+jwt+mybaits-plus+mysql实现权限管理
03-13
在本项目中，我们主要探讨的是如何利用Spring Boot、Spring Security、JWT（JSON Web Tokens）、MyBatis-Plus以及MySQL数据库来构建一个完整的权限管理系统。下面将详细解析这些技术及其在项目中的应用。 1. Spring...
基于yml 配置方式 ，实现springBoot+sharding-jdbc+mybatis-plus 实现分库分表，读写分离，以及全局表，子表的配置
10-26
1、基于yml 配置方式 ，实现springBoot+sharding-jdbc+mybatis-plus 实现分库分表，读写分离，以及全局表，子表的配置。 2、实现mybatis-plus 整合到springboot 详细使用请看 测试用例
史上最全springboot+vue3+element-plus代码实现web登录页面（附件有代码）
04-15
SpringBoot_demo是一个包含Spring Boot、Vue.js和Element Plus框架实现的Web登录页面示例项目。这个项目展示了如何将这三个技术栈结合，构建一个完整的前端到后端的应用。下面将详细介绍这些关键技术及其在登录页面...
Spring Boot 集成 Sharding-JDBC + Mybatis-Plus 实现分库分表功能
09-07
集成Mybatis-Plus到Spring Boot项目中，需做以下工作： 1. 添加Mybatis-Plus依赖：在POM.xml中引入Mybatis-Plus的starter模块。 2. 配置Mybatis-Plus：在配置文件中配置Mybatis-Plus的基本参数，如实体扫描路径、...
SpringBoot+Mybatis-plus+codegenerator JavaWeb平台快速开发框架
05-05
SpringBoot+Mybatis-plus+CodeGenerator 是一个高效且便捷的JavaWeb开发框架组合，它极大地简化了传统开发过程中的框架搭建工作，使开发者能够更专注于业务逻辑的实现，提高开发效率。下面将详细介绍这个框架组合的...
TNWX：TNWX：TypeScript + Node.js + WeiXin微信系开发脚手架，支持微信公众号，微信支付，微信小游戏，微信小程序，企业微信企业号。最最最重要的是能快速的集成至任何Node .js框架（Express，Nest，Egg，Koa等）
02-06
简介 TNWX：TypeScript + Node.js + WeiXin微信系开发脚手架，支持微信公众号，微信支付，微信小游戏，微信小程序，企业号/企业微信，企业微信开发平台。最最最重要的是能快速的集成至任何Node.js框架（Express，Nest，Egg，Koa等） 简易指南 尝鲜版 $ git clone https://gitee.com/javen205/TNWX.git $ cd TNWX $ yarn bootstrap $ yarn tsc 运行示例 $ cd sample/express && yarn $ yarn build $ yarn dev 稳定版 $ mkdi
Spring Boot项目如何实现微信和支付宝支付
m0_71777195的博客
07-05 2365
用户选择支付方式（微信或支付宝）。后端根据用户选择的支付方式，生成支付订单信息，并将订单信息发送给对应的支付平台。支付平台生成支付二维码，并返回给后端。后端将支付二维码返回给前端。用户扫描二维码进行支付。支付完成后，支付平台会通知后端支付结果。后端根据支付结果更新订单状态。接下来，我们将分别实现支付宝和微信的支付功能。
【微信支付】微信v3支付案例，SpringBoot集成IJPay实现微信v3支付
Syals的博客
06-15 2493
微信v3支付案例，SpringBoot集成IJPay实现微信v3支付
SpringBoot实现小程序微信支付（超级详细）
qq_19007169的博客
03-21 9870
SpringBoot微信支付开发
springboot商场项目案例
09-07
您好！对于Spring Boot商场项目案例，有很多不同的实现方式和功能需求。下面我为您提供一个简单的示例，希望对您有所帮助。 项目概述： 这是一个基于Spring Boot的简单商场项目，实现了用户注册、登录、商品浏览和购买等功能。 技术栈： - 后端框架：Spring Boot - 数据库：MySQL - 前端框架：Thymeleaf（可选） 功能模块： 1. 用户模块 - 用户注册：包括用户名、密码等信息的输入和保存。 - 用户登录：验证用户输入的用户名和密码是否正确。 2. 商品模块 - 商品浏览：展示商城中的商品列表，包括商品名称、价格等详细信息。 - 商品购买：用户可以选择要购买的商品和数量，并生成订单。 3. 订单模块 - 订单管理：展示用户的订单列表，包括订单编号、商品信息、订单状态等。 - 订单支付：用户可以选择支付方式完成订单支付，并更新订单状态。 实现步骤： 1. 创建Spring Boot项目，并配置相关依赖（如Spring Web、Spring Data JPA、Thymeleaf等）。 2. 设计数据库表结构，创建用户表和商品表，并建立相应的实体类和数据库映射关系。 3. 编写用户模块的控制器和服务层代码，处理用户注册、登录的逻辑。 4. 编写商品模块的控制器和服务层代码，实现商品的浏览和购买功能。 5. 编写订单模块的控制器和服务层代码，处理订单管理和支付的逻辑。 6. 创建前端页面，使用Thymeleaf进行数据展示和交互（可选）。 7. 进行测试和调试，修复可能存在的问题。 8. 部署项目到服务器上，并进行性能优化和安全加固。 请注意，上述示例只是一个简单的商城项目案例，实际开发中还需要根据具体需求进行功能扩展和优化。希望能对您有所启发！如有更多疑问，请随时提问。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

_L_J_H_

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值