基于SpringBoot+MyBatis Plus+Vue的Java项目百战商城（附：源码课件）

小鱼儿 2023-10-02 19:04 23阅读 0赞

####  ####

### 项目背景 ###

随着互联网的不断普及和人们消费方式的转变,网络购物逐渐成为人们热衷的一种交易方式。文章采用最新流行的SpringBoot,VUE等技术以及IDEA,Visual Studio Code开发工具,实现前后端数据交互。该线上商城主要实现用户个人中心、购物车、商品管理、订单管理、支付、后台进行商铺内容管理、角色管理、权限管理等功能模块。本设计还为每个店铺可以上传自己的商品、设计轮播图、导航栏等。最后,对该线上商城进行测试,测试结果显示该平台运行稳定。

####  ####

### 电商项目介绍 ###

####  ####

电商行业的几种模式.

####  ####

1. B2B

企业到企业，商家到商家。代表：阿里巴巴、慧聪网。

####  ####

2. B2C

商家到客户。代表：京东、淘宝商城（B2B2C）。

####  ####

3. C2C

客户到客户。淘宝集市。咸鱼。

####  ####

4. O2O

线上到线下。

####  ####

### 项目所涉及到的技术 ###

Spring Boot/Spring MVC/MyBatis Plus/Logback/Dubbo/FastDFS-java-client/Spring Data Elasticsearch

Spring AMQP/Vue等等

####  ####

### 开发工具和环境 ###

Maven/Linux（也可以使用云服务器 ECS（Elastic Compute Service））/IDEA/Zookeeper/FastDFS（也可以使用对象存储 OSS）/Nginx（虚拟主机，负载均衡）(负载均衡也可以使用CDN加速）/Elasticsearch/RabbitMQ

Redis/ShardingProxy/MySQL/Tomcat

####  ####

### 整个电商结构图 ###

前台：数据展示。给客户使用，进行浏览和购买商品。

后台：数据维护。给商家和运维使用。

千万不要和前端和后端（服务器端）词语混淆。

![f4b19370b3718580bca00ffe443b092f.png][]

### 功能设计与实现： ###

####  ####

#### 01\_百战商城：基于MyBatis-Plus的总体环境搭建及后台商品接口实现 ####

搭建后台前端页面环境

后台前端页面使用Vue进行开发的。

在今天的目录/软件/itbaizhan-shop-backend.rar解压到任意非中文目录。

进入到解压目录中，在地址栏中输入cmd.弹出命令行，路径就是当前目录路径。

![4a5cc5797c0a2137da10625c95213120.png][]

![d3efd80844f57d936984aff20f561825.png][]

在命令行输入：cnpm install 安装Node.js依赖。

在输入:cnpm run serve 启动项目。当启动成功后显示可访问url

####  ####

#### 02\_百战商城：完成后台CMS系统 ####

####  ####

#### 03\_百战商城：使用Spring Data Elasticsearch实现商品搜索并实现双写一致 ####

####  ####

#### 04\_百战商城：实现商品详情并同步缓存实现双写一致 ####

####  ####

#### 05\_百战商城：使用Spring Session实现分布式Session共享 ####

####  ####

#### 06\_百战商城：实现订单系统 ####

####  ####

#### 07\_百战商城：使用Spring Cache实现大广告缓存并基于RabbitMQ实现双写一致 ####

####  ####

1 Spring Cache优点

####  ####

1.1 正常情况下使用Redis缓存工具时代码流程。

![a6c3591950f665fc93d1348af4e37b1d.png][]

编辑

添加图片注释，不超过 140 字（可选）

####  ####

1.2 使用Spring Cache后

在代码方法中编写对数据库的访问。只需要完成上面流程图中“从mysql取出”部分的代码。剩余事情使用一个非常简单的注解即可，省略了访问redis取数据及把mysql数据缓存到redis的代码，让开发起来更简单。

####  ####

2 Spring Cache加载缓存工具顺序

只要检测到项目中配置了下面缓存工具。（导入了依赖，在Spring容器中发现对应工具的内容），无论导入多少个缓存工具用于只用最前面的一个。

默认寻找缓存工具的顺序：（为什么redis配置上就可以用的原因）

1. Generic 2.JCache (JSR-107) (EhCache 3, Hazelcast, Infinispan, and others) 3.EhCache 2.x 4.Hazelcast 5.Infinispan 6.Couchbase 7.Redis 8.Caffeine 9.Simple

####  ####

3 无参数使用

####  ####

3.1 pom.xml中添加依赖

添加Spring-boot-starter-web会包含spring-context。就可以使用Spring Cache了。

spring-boot-start-data-redis 添加后会有Redis配置环境，当前项目没有添加其他缓存工具，所以Spring Cache会使用Redis作为缓存工具。

<groupId>org.springframework.boot</groupId>

<artifactId>spring-boot-starter-parent</artifactId>

<version>2.2.7.RELEASE</version>

</parent>

<groupId>org.springframework.boot</groupId>

<artifactId>spring-boot-starter-web</artifactId>

</dependency>

<groupId>org.springframework.boot</groupId>

<artifactId>spring-boot-starter-data-redis</artifactId>

</dependency>

</dependencies>

####  ####

3.2 新建配置文件

新建application.yml。配置redis即可。

spring:

redis:

host: 192.168.8.130

\#cluster:

\#nodes: 集群时使用

\#port: 6379

####  ####

3.3 新建启动类

新建com.bjsxt.DemoApplication

@SpringBootApplication

@EnableCaching

public class DemoApplication \{

public static void main(String\[\] args) \{

SpringApplication.run(DemoApplication.class,args);

####  ####

3.4 新建Service及实现类

新建com.bjsxt.service.DemoService及实现类。

####  ####

3.4.1 每个方法单独配置key前缀

每个方法单独配置key前缀适用于整个类中方法的前缀不统一的情况。

@Cacheable表示要对方法返回值进行缓存。缓存时key的名称为cacheName::key

cacheNames : 配置key的前缀

key:配置key的后缀。里面字符串要使用单引号。

public interface DemoService \{

String demo();

@Service public class DemoServiceImpl implements DemoService \{ @Override // 固定字符串需要使用单引号 @Cacheable(key = "'demo'",cacheNames = "com.bjsxt") public String demo() \{ System.out.println("demo方法被执行"); return "demo-result"; \} \}

####  ####

3.4.2 统一配置类中方法前缀

一般情况下一个类中方法的对应key的前缀都是一样，可以把前缀cacheNames提出到类上，统一配置。

public interface DemoService \{ String demo(); \}

@Service

@CacheConfig(cacheNames = "com.bjsxt")

public class DemoServiceImpl implements DemoService \{

@Override

// 固定字符串需要使用单引号

@Cacheable(key = "'demo'")

public String demo() \{

System.out.println("demo方法被执行");

return "demo-result";

####  ####

3.5 新建控制器

新建com.bjsxt.controller.DemoConteroller

@Controller

public class DemoConteroller \{

@Autowired [@controller][controller]

private DemoService demoService;

@RequestMapping("/demo")

@ResponseBody

public String demo()\{

return demoService.demo();

####  ####

3.6 测试结果

在浏览器中访问/demo后会发现控制台打印“demo方法被执行”通过redis中出现com.bjsxt::demo的key

再次访问，控制台不会被打印，说明执行缓存。

####  ####

本项目功能丰富 界面美观 满足社会当前需求 适合用来练手 实战提高自己的项目经验 可以写在自己的求职简历当中

大家如果需要系统配套的源码 课件等资料可以私信我， 分享给大家~~

想要更多的Java项目实战的也可以私信我呢~~~

![9e111af03cf2296dc7af2aee16a66285.png][]

[f4b19370b3718580bca00ffe443b092f.png]: https://img-blog.csdnimg.cn/img_convert/f4b19370b3718580bca00ffe443b092f.png
[4a5cc5797c0a2137da10625c95213120.png]: https://img-blog.csdnimg.cn/img_convert/4a5cc5797c0a2137da10625c95213120.png
[d3efd80844f57d936984aff20f561825.png]: https://img-blog.csdnimg.cn/img_convert/d3efd80844f57d936984aff20f561825.png
[a6c3591950f665fc93d1348af4e37b1d.png]: https://img-blog.csdnimg.cn/img_convert/a6c3591950f665fc93d1348af4e37b1d.png
[controller]: https://zhuanlan.zhihu.com/people/controller-92
[9e111af03cf2296dc7af2aee16a66285.png]: https://img-blog.csdnimg.cn/img_convert/9e111af03cf2296dc7af2aee16a66285.png