三级分类
pms_category表的属性解析
cat_id:分类id,cat代表分类,bigint(20)
name:分类名称
parent_cid:在哪个父目录下
cat_level:分类层级
show_status:是否显示,用于逻辑删除
sort:同层级同父目录下显示顺序
ico图标,product_unit商品计量单位,
前端我们使用element-ui的tree组件
在前端我们增加了组件在src/view/modules/product/category.vue里面
<template>
<el-tree
:data="data"
:props="defaultProps"
@node-click="handleNodeClick"
></el-tree>
</template>
<script>
export default {
components: {},
props: {},
data() {
return {
data: [],
defaultProps: {
children: "children",
label: "label",
},
};
},
methods: {
getMenus() {
this.$http({
url: this.$http.adornUrl("/product/category/list/tree"),
method: "get"
}).then(data=>{
console.log("成功 ",data)
})
}
},
created() {
this.getMenus();
},
mounted() {},
beforeCreate() {}, //生命周期 - 创建之前
beforeMount() {}, //生命周期 - 挂载之前
beforeUpdate() {}, //生命周期 - 更新之前
updated() {}, //生命周期 - 更新之后
beforeDestroy() {}, //生命周期 - 销毁之前
destroyed() {}, //生命周期 - 销毁完成
activated() {}, //如果页面有 keep-alive 缓存功能,这个函数会触发
};
</script>
<style scoped>
</style>
修改一下static/config/index.js里面的配置,将api接口请求地址修改一下
/**
* 开发环境
*/
;(function () {
window.SITE_CONFIG = {};
// api接口请求地址
window.SITE_CONFIG['baseUrl'] = 'http://localhost:88/api';
// cdn地址 = 域名 + 版本号
window.SITE_CONFIG['domain'] = './'; // 域名
window.SITE_CONFIG['version'] = ''; // 版本号(年月日时分)
window.SITE_CONFIG['cdnUrl'] = window.SITE_CONFIG.domain + window.SITE_CONFIG.version;
})();
我们想要请求商品服务来获取数据
但是这个是请求前端会发给renren-fast后台服务
而不是发给我们的商品服务,所以我们
将renren-fast加入到注册发现之中
然后想通过网关将这个请求路由到商品服务
但是加入之后发现验证码不行了
验证码的请求路径变成
http://localhost:88/api/captcha.jpg?uuid=8c0c77c8-7cd6-4cbb-828c-628159603760
本来应该是这样的
http://localhost:8001/renren-fast/captcha.jpg?uuid=8c0c77c8-7cd6-4cbb-828c-628159603760
所以在网关进行下面的配置
spring:
cloud:
gateway:
routes:
- id: test_route
uri: https://www.baidu.com
predicates:
- Query=url,baidu
- id: admin_route
uri: lb://renren-fast
predicates:
- Path=/api/**
filters:
- RewritePath=/api/(?<segment>.*),/renren-fast/$\{segment}
#就是将网关得到的请求转发到renren-fast项目里面
#还有就是转发的时候将请求路径里面的api重写成renren-fast
但是现在登陆的时候又出现了跨域这个问题
:8001/#/login:1 Access to XMLHttpRequest at
'http://localhost:88/api/sys/login' from origin
'http://localhost:8001' has been blocked by CORS policy:
Response to preflight request doesn't pass access control check:
No 'Access-Control-Allow-Origin' header is present on
the requested resource.
跨域
跨域:指的是浏览器不能执行其他网站的脚本。
它是由浏览器的同源策略造成的,是浏览器对javascript施加的安全限制。
同源策略:是指协议,域名,端口都要相同,其中有一个不同都会产生跨域;
下图详细说明了 URL 的改变导致是否允许通信
跨域流程
浏览器发请求都要实现发送一个请求询问是否可以进行通信 ,
我直接给你返回可以通信就可以了
相关资料参考:https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Access_control_CORS
解决跨越( 一 ) 使用nginx部署为同一域
解决跨域 ( 二 )配置当次请求允许跨域
1、添加响应头
- Access-Control-Allow-Origin: 支持哪些来源的请求跨域
- Access-Control-Allow-Methods: 支持哪些方法跨域
- Access-Control-Allow-Credentials: 跨域请求默认不包含cookie,
设置为true可以包含cookie
- Access-Control-Expose-Headers: 跨域请求暴露的字段
CORS请求时, XML .HttpRequest对象的getResponseHeader()方法
只能拿到6个基本字段:
CacheControl、Content-L anguage、Content Type、Expires、
Last-Modified、 Pragma。
如果想拿到其他字段,就必须在Access-Control-Expose-Headers里面指定。
- Access-Control-Max- Age: 表明该响应的有效时间为多少秒。
在有效时间内,浏览器无须为同一-请求再次发起预检请求。
请注意,浏览器自身维护了一个最大有效时间,
如果该首部字段的值超过了最大有效时间,将不会生效。
跨越设置
请求先发送到网关,网关在转发给其他服务,事先都要注册到注册中心
然后在网关哪里进行配置过滤器,让请求可以跨域
package com.jane.shop.gateway.config;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.cors.CorsConfiguration;
import org.springframework.web.cors.reactive.CorsWebFilter;
import org.springframework.web.cors.reactive.UrlBasedCorsConfigurationSource;
/**
* @author jane
* @create 2021-03-26 20:42
*/
@Configuration
public class ShopCorsConfiguration {
@Bean
public CorsWebFilter corsWebFilter() {
UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
CorsConfiguration corsConfiguration = new CorsConfiguration();
// 配置跨越
corsConfiguration.addAllowedHeader("*"); // 允许那些头
corsConfiguration.addAllowedMethod("*"); // 允许那些请求方式
corsConfiguration.addAllowedOrigin("*"); // 允许请求来源
corsConfiguration.setAllowCredentials(true); // 是否允许携带cookie跨越
// 注册跨越配置
source.registerCorsConfiguration("/**",corsConfiguration);
return new CorsWebFilter(source);
}
}
然后将请求数据的请求也进行转发
spring:
cloud:
gateway:
routes:
#路由精确的放在前面,让精确的路由首先匹配到进行处理
- id: test_route
uri: https://www.baidu.com
predicates:
- Query=url,baidu
- id: product_route
uri: lb://product
predicates:
- Path=/api/product/**
filters:
- RewritePath=/api/(?<segment>.*),/$\{segment}
- id: admin_route
uri: lb://renren-fast
predicates:
- Path=/api/**
filters:
- RewritePath=/api/(?<segment>.*),/renren-fast/$\{segment}
#前端项目的请求都带有/api前缀
阿里云的云存储使用
三步:
1.引入oss-starter
2.配置key,endpoint相关信息
3.直接注入使用OSSClient
后端校验
后端我们使用的是JSR303规范进行校验,步骤是
1)、给Bean添加校验注解:javax.validation.constraints,
并定义自己的message提示
2)、开启校验功能@Valid
效果:校验错误以后会有默认的响应;
3)、给校验的bean后紧跟一个BindingResult,就可以获取到校验的结果
例如
@NotBlank(message = "品牌名必须提交")
private String name;
/**
* 品牌logo地址
*/
@NotEmpty
@URL(message = "logo必须是合法的url地址")
private String logo;
@RequestMapping("/save")
//@RequiresPermissions("product:brand:save")
public R save(@Valid @RequestBody BrandEntity brand, BindingResult result){
if (result.hasErrors())
{
Map<String,String> map=new HashMap<>();
//1.获取校验的错误结果
result.getFieldErrors().forEach((item)->{
//获取错误提示
String message = item.getDefaultMessage();
//获取错误的属性的名字
String field = item.getField();
map.put(field,message);
});
return R.error(400,"提交数据不合法").put("data",map);
}
else
{
brandService.save(brand);
}
return R.ok();
}
分组校验
分组校验(多场景的复杂校验)
1)、 @NotBlank(message = "品牌名必须提交",groups = {AddGroup.class,UpdateGroup.class})
给校验注解标注什么情况需要进行校验
2)、@Validated({AddGroup.class})
3)、默认没有指定分组的校验注解@NotBlank,
在分组校验情况@Validated({AddGroup.class})下不生效,只会在@Validated生效;
自定义校验
5)、自定义校验
1)、编写一个自定义的校验注解
2)、编写一个自定义的校验器 ConstraintValidator
3)、关联自定义的校验器和自定义的校验注解
@Documented
@Constraint(validatedBy = { ListValueConstraintValidator.class })
//可以指定多个不同的校验器,适配不同类型的校验
@Target({ METHOD, FIELD, ANNOTATION_TYPE, CONSTRUCTOR, PARAMETER, TYPE_USE })
@Retention(RUNTIME)
public @interface ListValue {
接口文档
SPU&SKU&规格参数&销售属性
SPU:Standard Product Unit (标准化产品单元)
是商品信息聚合的最小单位,是一组可复用,
易检索的标准化信息的组合,该集合描述了一个产品的特性
IPhoneX 是 SPU,MI8 是 SPU
IPhoneX 64G 黑曜石 是 SKU
MIX8 + 64G 是 SKU
SKU: Stock KeepingUnit (库存量单位)
每个分共下的商共享规格参数、与销售属性,
只是有些商品不一定更用这个分类下全部的属性:
属性是以三级分类组织起来的
规格参数中有些是可以提供检索的
规格参数也是基本属性,他们具有自己的分组
属性的分组也是以三级分类组织起来的
属性名确定的,但是值是每一个商品不同来决定的
【属性分组-规格参数-销售属性-三级分类】关联关系
SPU-SKU-属性表
Object的划分
PO (persistant object) 持久化对象
PO 就是对应数据库中某个表中的一条记录,多个记录可以用 PO 的集合。
PO 中应该不包含任何对数据库的操作。
DO ( Domain Object) 领域对象
就是从现实世界抽象出来的有形或无形的业务实体
TO (Transfer Object) 数据传输对象
不同的应用程序之间传输的对象
DTO (Data Transfer Object) 数据传输对象
这个概念来源于 J2EE 的设计模式,原来的目的是为了 EJB的
分布式应用提供粗粒度的数据实体,以减少分布式调用的次数,
从而提高分数调用的性能和降低网络负载,但在这里,
泛指用于展示层与服务层之间的数据传输对象
VO(value object) 值对象
通常用于业务层之间的数据传递,和 PO 一样也是仅仅包含数据而已。
但应是抽象出的业务对象 , 可以和表对应 , 也可以不 , 这根据业务的需要 。
用 new 关键字创建,由GC 回收的。
View object:视图对象;
接受页面传递来的数据,封装对象
将业务处理完成的对象,封装成页面要用的数据
BO(business object) 业务对象
从业务模型的角度看 , 见 UML 元件领域模型中的领域对象。
封装业务逻辑的 java 对象 , 通过调用 DAO 方法 ,
结合 PO,VO 进行业务操作。
business object: 业务对象 主要作用是把业务逻辑封装为一个对象。
这个对象可以包括一个或多个其它的对象。
比如一个简历,有教育经历、工作经历、社会关系等等。
我们可以把教育经历对应一个 PO ,工作经历对应一个 PO ,
社会关系对应一个 PO 。 建立一个对应简历的 BO 对象处理简历,
每个 BO 包含这些 PO 。 这样处理业务逻辑时,我们就可以针对 BO 去处理。
POJO ( plain ordinary java object) 简单无规则 java 对象
传统意义的 java 对象。就是说在一些 Object/Relation Mapping 工具中,
能够做到维护数据库表记录的 persisent object 完全是
一个符合 Java Bean 规范的纯 Java 对象,没有增加别的属性和方法。
我的理解就是最基本的 java Bean ,只有属性字段及 setter 和 getter方法!。
POJO 是 DO/DTO/BO/VO 的统称
DAO(data access object) 数据访问对象
是一个 sun 的一个标准 j2ee 设计模式,这个模式有个接口就是 DAO ,
他负持久层的操作,为业务层提供接口,此对象用于访问数据库,
通常和 PO 结合使用,DAO 中包含了各种数据库的操作方法,
通过它的方法,结合 PO 对数据库进行相关操作,夹在业务逻辑与数据库资源中间,
配合VO 提供数据库的 CRUD 功能