【46-商品详情页服务搭建架构图-前后端商品响应详情VO对象-商品详情后端逻辑处理-商品详情页前端渲染逻辑-CompletableFuture的异步编排处理】

一.知识回顾

【0.三高商城系统的专题专栏都帮你整理好了,请点击这里!】
【1-系统架构演进过程】
【2-微服务系统架构需求】
【3-高性能、高并发、高可用的三高商城系统项目介绍】
【4-Linux云服务器上安装Docker】
【5-Docker安装部署MySQL和Redis服务】
【6-Git安装与配置过程、Gitee码云上创建项目、IDEA关联克隆的项目】
【7-创建商城系统的子模块并将修改后的信息使用Git提交到Gitee上】
【8-数据库表结构的创建&后台管理系统的搭建】
【9-前端项目的搭建部署、Node安装、VSCode安装】
【10-Node的安装以及全局环境变量的相关配置&解决启动报错的问题(1.Error: Cannot find module ‘fs/promises)(2.npm安装node-sass报错)】
【11-导入人人generator项目并自动生成相关的文件&商品子模块的调试&公共模块common子模块的抽离与实现&Lombok插件的安装】
【12-商品子模块整合MyBatisPlus技术&其它模块通过generator的自动生成与补充完善】
【13-项目中微服务组件的学习-SpringCloudAlibaba微服务生态体系的学习&SpringCloudAlibaba的依赖管理&项目中SpringBoot和SpringCloud版本的统一】
【14-微服务的注册中心与配置中心Nacos&Windows操作系统上安装Nacos和Linux操作系统上用Docker中安装Nacos&每个子项目模块使用Nacos进行服务注册与发现】
【15-项目中服务的远程调用之OpenFeign&订单模块与商品模块集成使用OpenFeign的案例】
【16-配置中心之Nacos的基本使用&Nacos服务之命令空间、Nacos服务之配置组、Nacos服务之配置拆分】
【17-微服务网关之Spring Cloud Gateway&Spring Cloud Gateway网关服务搭建】
【18-业务开发-基础业务-商品模块-分类管理-前后端管理系统的启动-为分类管理表增加数据-Json插件的下载-返回具有层级目录、父子关系结构的数据】
【19-业务开发-基础业务-商品模块-分类管理-管理系统新建菜单-后端项目renren注册到Nacos注册中心和配置中心去-项目gateway网关模块的搭建-浏览器的同源策略与解决跨域问题实操案例】
【20-业务开发-基础业务-商品模块-分类管理-前端展示后端具有层级关系的目录数据-商品系统三级分类的逻辑删除前后端代码实现】
【21-业务开发-基础业务-商品模块-分类管理-商品系统三级分类的新增类别前后端代码实现-商品系统三级分类的更新类别前后端代码实现-之前错误的Bug修正】
【22-业务开发-基础业务-商品模块-分类管理-商品系统三级分类拖拽页面的功能-前后端代码的逻辑实现-访问测试-拖拽开关的开启和关系-批量更新拖拽数据-批量删除选定数据】
【23-业务开发-基础业务-品牌管理-品牌管理项目搭建-品牌管理实现的增删改查操作测试-后端数据显示状态使用前端组件开关按钮展示-以及数据处理以及测试】
【24-业务开发-基础业务-品牌管理-图片管理-阿里云OSS服务开通和使用-阿里云OSS服务API使用-SpringCloudAlibaba OSS服务的使用】
【25-业务开发-基础业务-品牌管理-图片管理-图片上传方式的三种实现方式-第三方公共服务模块集成到项目中-服务端生成签名实战】
【26-业务开发-基础业务-品牌管理-图片管理-上传图片功能实现-基于阿里云OSS服务-解决跨域问题-设置跨域规则-修改ACL权限为公共读】
【27-业务开发-基础业务-品牌管理-图片管理-添加修改品牌信息并显示图片-前端数据校验-后端数据JSR303校验实现-统一异常处理-自定义响应编码规则-分组校验-自定义校验注解-项目Bug解决】
【28-业务开发-基础业务-属性管理-SKU和SPU基本概念-SKU和SPU关联关系-属性实体之间的关联关系-批量菜单创建】
【29-业务开发-基础业务-属性管理-属性组业务逻辑开发-页面布局-三级分类组件功能-属性组表单-父子组件传值-属性组数据展示-属性组数据添加-属性组数据修改-前后端项目整合交互测试】
【30-业务开发-基础业务-品牌管理-分类维护-解决分类维护业务开发中的一个Bug-品牌管理-分页插件-分页功能的逻辑实现-品牌管理-检索条件模糊查询品牌管理-增加更新操作中排序字段检验还是存在问题】
【31-业务开发-基础业务-品牌管理-级联类别信息业务功能实现-品牌管理和商品分类管理俩者业务关联出现数据冗余,导致数据不同步的问题-开启事务-项目测试】
【32-业务开发-基础业务-规格参数-保存数据-查询数据-更新操作之数据回显展示-更新操作-前后端项目交互整合与测试-总结收获】
【33-业务开发-基础业务-规格参数-销售属性-多表之间的关联增删改查操作-前后端项目交互整合与测试-Cannot read property ‘publish‘ of undefined】
【34-业务开发-基础业务-属性组和基本属性-属性组和基本属性建立关联-属性组和基本属性解除关联-未关联属性查询-确认新增】
【35-业务开发-基础业务-商品服务-新增商品-会员模块服务-mall-member-会员模块数据维护-规格参数维护-前端项目Bug解决-PubSub依赖缺失】
【36-业务开发-基础业务-商品服务SPU-前后端处理商品数据Json-发布商品前后端业务逻辑-feign服务远程调用-DTO数据传输对象-商品服务的检索-商品管理的检索项目中修改更正完善逻辑操作】
【37-业务开发-基础业务-库存管理- 仓库模块Nacos注册中心的配置-Gateway网关配置-仓库维护的增删改查-商品库存管理-采购流程-采购需求维护-采购需求合并-领取采购单完成采购操作】
【插入------>ElasticSearch专栏相关的知识内容都整理好了,在这里哟!】
【38-商品上架功能结合ElasticSearch全文检索的流程-商品ES关系映射模型&Docker安装ik分词器-实现上架功能复杂的逻辑实现-Postman+Kibana访问测试】
【39-商品整合thymeleaf模板引擎-商城用户端的实现逻辑-部署devtools工具依赖-商品后台-三级分类逻辑分析实现-Docker 安装部署Nginx-Nginx对网关实现反向代理负载均衡】
【40-系统性能压力测试基本概念-相关性能指标HPS&TPS&QPS&RT-安装Jmeter教程-JMeter测试流程-线程组-取样器-监视器-测试商城首页-JMeter Address 占用的问题】
【41-系统性能压力测试优化-JVM知识回顾-jconsole和jvisualvm-jvisualvm安装Visual GC插件-Nginx压力测试- 网关gateway压测-Nginx实现动静分离】
【42-缓存的基本概念-是否使用缓存的场景-本地缓存-分布式缓存-项目中整合Redis-修改三级分类逻辑代码+加入缓存-三级分类加入缓存后压力测试-缓存穿透-缓存雪崩-缓存击穿】
【43-本地锁-分布式锁概念原理-分布式锁解决方案-Redis实现分布式锁-Redisson分布式锁-项目整合Redisson-缓存数据一致性问题-解决缓存一致性的方案-SpringCache缓存】
【44-商城检索服务的搭建-页面跳转调整-elasticsearch检索服务前后端响应的VO对象-检索服务前后端逻辑实现-构建SearchRequest、SearchResponse对象】
【45-线程的实现方式-线程池的创建方式-线程池的执行顺序-CompletableFutrue异步处理】

二.商品详情页-服务搭建

2.1 商品详情页结构图

在这里插入图片描述

2.2 配置host文件

  我们的商品详情服务是一个独立的服务,我们需要在客户端的host中来配置映射

在这里插入图片描述

2.3 在Nginx中配置

  我们需要在Nginx中配置商品详情服务的反向代理和静态资源的管理,首先看反向代理的配置

在这里插入图片描述

  然后就是静态资源的管理,我们在es和商城首页的资源的同级目录下创建一个item目录,其中保存的就是商品详情页中的资源
在这里插入图片描述

上传商品详情页面的信息到linux操作系统中
在这里插入图片描述

查看是否上传成功
在这里插入图片描述

2.4 网关服务路由

  当Nginx方向代理到了网关服务后,网关服务得跟进host路由到商品服务,我们得修改对应的配置信息

在这里插入图片描述

2.5 商品服务处理

  到请求到了商品服务中我们需要接收请求,并且跳转到商品详情页中。

/**
 * 商品详情的控制器
 */
@Controller
public class ItemController {

    @GetMapping("/{skuId}.html")
    public String item(@PathVariable Long skuId){
        System.out.println(skuId);
        return "item";
    }
}

item.html页面中的内容在给大家的资源中有,拷贝进去即可,注意要修改相关的资源的路径

image.png

2.6 检索服务跳转

  商品详情服务搭建好了之后,我们需要通过商品的检索服务调整过来,那么我们需要修改跳转的地址信息

在这里插入图片描述

最终的商品详情页的展示效果

在这里插入图片描述

三.前后端商品响应详情数据

3.1 响应VO封装

  根据skuid查询对应的商品详情信息,我们需要把对应的信息封装到对应的VO中,我们需要自己来封装该对象。

商品详情页的数据对象SpuItemVO

@Data
public class SpuItemVO {
    // 1.sku的基本信息 pms_sku_info
    SkuInfoEntity info;
    // 2.sku的图片信息pms_sku_images
    List<SkuImagesEntity> images;
    // 3.获取spu中的销售属性的组合
    List<SkuItemSaleAttrVo> saleAttrs;
    // 4.获取SPU的介绍
    SpuInfoDescEntity desc;
    // 5.获取SPU的规格参数
    List<SpuItemGroupAttrVo> baseAttrs;

}

销售属性的SkuItemSaleAttrVo在这里插入图片描述

属性组相关的SpuItemGroupAttrVo

在这里插入图片描述

Attr是之前就创建的VO对象
在这里插入图片描述

四.商品详情后端逻辑处理

4.1 sku的基本信息

直接通过封装好的getById方法查询数据
在这里插入图片描述

4.2 sku的图片信息

定义获取商品详情的图片信息
在这里插入图片描述
SkuImagesService逻辑层定义查询接口

在这里插入图片描述

具体实现层实现上面的接口,并重写getImagesBySkuId具体逻辑方法在这里插入图片描述

4.3 Spu的规格参数

  Spu的规格参数,根据 SPU编号和CatalogId类别编号要查询出所有的属性组及其属性信息

# `pms_attr_group`
# 根据 SPU编号和CatalogId类别编号 要查询出所有的属性组及其属性信息

SELECT t1.attr_group_id
	,t1.attr_group_name
	,t2.attr_id 
	,t3.attr_name
	,t4.attr_value
FROM `pms_attr_group` t1 
LEFT JOIN `pms_attr_attrgroup_relation` t2 ON t1.attr_group_id = t2.attr_group_id
LEFT JOIN `pms_attr` t3 ON t2.attr_id = t3.attr_id
LEFT JOIN `pms_product_attr_value` t4 ON t4.attr_id = t2.attr_id
WHERE t1.catelog_id = '225' AND t4.spu_id = 6

获取商品详细信息逻辑中获取spu的规格参数
在这里插入图片描述
AttrGroupService属性组逻辑接口层定义查询接口
在这里插入图片描述

AttrGroupServiceImpl逻辑实现层,实现上述接口,重写getAttrgroupWithSpuId逻辑方法
在这里插入图片描述

Dao层接口逻辑
在这里插入图片描述

xml文件实现逻辑
在这里插入图片描述

4.4 spu的商品详情信息介绍

spu详细的信息直接通过封装好的方法查询即可
在这里插入图片描述

4.5 销售属性

  销售属性的信息是根据SPU找到所有的SKU下的对应的属性信息,首先写出对应的SQL

## 根据SPU编号找到所有的SKU编号 然后进而找到所有的销售属性信息
SELECT
  # psi.sku_id,
  pssav.attr_id,
  pssav.attr_name,
  GROUP_CONCAT( DISTINCT pssav.attr_value)
FROM `pms_sku_info` psi
LEFT JOIN `pms_sku_sale_attr_value` pssav 
	ON psi.sku_id = pssav.sku_id
WHERE psi.spu_id = 6
GROUP BY pssav.attr_id,pssav.attr_name

业务逻辑层获取spu中的销售属性的实现逻辑
在这里插入图片描述

SkuSaleAttrValueService接口层定义接口方法
在这里插入图片描述

逻辑实现层实现上述的接口,并重写其中的方法
在这里插入图片描述

SkuSaleAttrValueDao数据交互层定义与Mapper.xml文件中对应的接口方法
在这里插入图片描述

与dao数据持久层对应的Mapper映射
在这里插入图片描述

五.商品详情页前端渲染逻辑

5.1 基本页面修改

在这里插入图片描述

5.2 SKU标题

在这里插入图片描述

image.png

5.3 图片展示

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

5.4 价格显示与格式化和有货显示

在这里插入图片描述

在这里插入图片描述

image.png

5.5 销售属性

  销售属性是当前SKU对应的SPU下所有的销售属性的组合。

在这里插入图片描述

5.6 SPU详情

在这里插入图片描述

5.7 规格参数

在这里插入图片描述

页面展示
在这里插入图片描述

六.异步处理

  然后我们就可以在商品详细信息查询的位置实现CompletableFuture的异步编排处理。
在这里插入图片描述

先定义线程池

在这里插入图片描述

具体的编排处理
在这里插入图片描述

好了,关于【46-商品详情页服务搭建架构图-前后端商品响应详情VO对象-商品详情后端逻辑处理-商品详情页前端渲染逻辑-CompletableFuture的异步编排处理】就先学习到这里,更多的内容持续学习中。

  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

打赏作者

硕风和炜

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

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

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

打赏作者

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

抵扣说明:

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

余额充值