谷粒商城
文章平均质量分 89
小手追梦
技术致富
展开
-
谷粒商城实战笔记-69-商品服务-API-品牌管理-JSR303自定义校验注解
假设我们需要校验一个名为showStatus的字段,该字段只能接受0或1两个值。为了实现这一需求,我们将创建一个自定义校验注解,并为其编写相应的校验器。首先,我们需要定义一个自定义的校验注解@ListValue,并为其提供必要的元数据。ListValue注解类的代码如下。Class原创 2024-07-26 17:44:25 · 441 阅读 · 0 评论 -
谷粒商城实战笔记-68-商品服务-API-品牌管理-JSR303分组校验
为了实现这样的逻辑,我们首先需要定义分组接口。这些接口不会定义任何变量和方法,仅仅作为一个标识,用于区分不同的校验场景。这里定义了两个分组接口,AndGroup用于新增品牌时的校验,用于更新品牌时的校验。因为会被其他模块共用,所以这两个接口定义在common模块中。原创 2024-07-26 16:22:54 · 399 阅读 · 0 评论 -
谷粒商城实战笔记-67-商品服务-API-品牌管理-统一异常处理
是 Spring Framework 中的一个注解,用于创建一个全局的异常处理类,它可以捕获并处理 Spring MVC 控制器中抛出的异常。这个注解提供了一种集中处理控制器中可能出现的各种异常的方法,从而避免在每个控制器方法中重复编写异常处理逻辑。原创 2024-07-26 15:30:45 · 471 阅读 · 0 评论 -
谷粒商城实战笔记-66-商品服务-API-品牌管理-JSR303数据校验
每个注解都有默认的错误提示,配置在文件中。但是,我们可以在自动注解的message属性自定义错误提示。@NotNull(message = "Logo必须提交")Logo URL@NotNull@URL: 标注在Logo字段上,表示该字段必须不为空且是一个有效的URL。@NotNull(message = "Logo必须提交")@URL(message = "Logo必须是一个合法的URL地址")@Pattern: 标注在首字母字段上,表示该字段必须满足特定的正则表达式。原创 2024-07-26 14:34:32 · 666 阅读 · 0 评论 -
谷粒商城实战踩坑笔记-JSR303
JSR 303(Java Specification Request 303)是Bean Validation API的一个版本,定义了用于Java Bean属性校验的标准注解。这些注解可以用来验证对象的状态,例如确保一个字段不是空的或符合特定的格式。原创 2024-07-26 14:16:53 · 412 阅读 · 0 评论 -
谷粒商城实战笔记-高效工作经验积累
当然,我会提供一个更具体的例子来说明这两个原则的重要性及其背后的惨痛经历。原创 2024-07-25 21:15:55 · 150 阅读 · 0 评论 -
谷粒商城实战笔记-65-商品服务-API-品牌管理-表单校验&自定义校验器
为了在品牌列表中自定义显示品牌的Logo图片,我们可以使用Element UI框架提供的el-form组件结合模板插槽来实现。"/>这段代码在el-table-column中通过模板插槽实现了对品牌Logo的自定义显示。当scope.row.logo存在且有效时,会显示品牌Logo图片。如果Logo未能加载,则显示一个默认图标。此外,我们还添加了一些样式来控制Logo的大小。修改后的品牌列表就显示图片了,效果如下。原创 2024-07-25 19:18:32 · 373 阅读 · 0 评论 -
谷粒商城实战笔记-64-商品服务-API-品牌管理-OSS前后联调测试上传
在Web应用开发中,文件上传是一项非常常见的功能。这一节详细介绍如何在Vue项目中集成阿里云OSS前端文件上传组件,包括单文件上传和多文件上传功能,并确保跨域请求正常工作。原创 2024-07-25 18:03:08 · 335 阅读 · 0 评论 -
谷粒商城实战笔记-63-商品服务-API-品牌管理-OSS获取服务端签名
因此,上传文件涉及到第三方服务阿里云OSS,以后还会有第三方短信服务等,为了统一管理第三方服务,创建一个专门的模块third-party。原创 2024-07-25 15:39:18 · 565 阅读 · 0 评论 -
谷粒商城实战笔记-62-商品服务-API-品牌管理-OSS整合测试
通过上述步骤,你可以在Java项目中轻松地整合阿里云OSS服务,实现文件的上传、下载等功能。阿里云OSS提供了丰富的API和工具,可以根据你的业务需求进一步定制和扩展。希望这篇博客能帮助你在Java项目中顺利整合阿里云OSS服务。如果有任何疑问或需要进一步的帮助,请随时提问!原创 2024-07-25 11:49:39 · 534 阅读 · 0 评论 -
谷粒商城实战笔记-61-商品服务-API-品牌管理-云存储开通与使用
文章目录一,图片云存储二,阿里云OSS1,OSS2,基于OSS的文件上传架构3,Java中使用OSS一,图片云存储这张图展示了文件存储的几种常见模式:普通上传分布式情况下的普通上传使用自建服务器云存储服务的情况普通上传:在这种情况下,浏览器直接将文件上传给商品服务,然后由商品服务保存文件。这种方式简单明了,但是存在单点故障风险,因为所有文件都在同一台服务器上存储。分布式情况下的普通上传:这是一种改进后的版本,多个商品服务共享同一个文件存储空间。然而,这种方案仍然需要自己维护文件原创 2024-07-25 10:37:04 · 522 阅读 · 0 评论 -
谷粒商城实战笔记-60-商品服务-API-品牌管理-效果优化与快速显示开关
首先,把ESLint语法检查关掉,因为这个语法检查过于严格,在控制台输出很多错误信息,干扰开发。在build目录下下中,把方法中的代码注释掉。原创 2024-07-25 09:13:08 · 330 阅读 · 0 评论 -
谷粒商城实战笔记-59-商品服务-API-品牌管理-使用逆向工程的前后端代码
品牌管理的代码使用逆向工程生成的代码,再次基础上进行修改。小细节,使用逆向工程生成代码时,要注意分页导致只生成部分代码,可以调整每页显示的数据条数,一次把所有的数据都显示出来。把逆向工程中与品牌相关的两个代码文件是brand.vue和。拷贝到前端工程中。原创 2024-07-25 07:40:41 · 169 阅读 · 0 评论 -
谷粒商城实战-58-商品服务-API-三级分类-删除-批量删除&小结
这一节的主要内容是开发批量删除分类的功能。原创 2024-07-25 06:46:29 · 538 阅读 · 0 评论 -
谷粒商城实战笔记-56~57-商品服务-API-三级分类-修改-拖拽功能完成
增加一个开关,控制拖拽功能的开启,只有开启了拖拽功能,才能拖拽。上一节已经把需要更新的数据都封装好了,三种结点的数据需要更新。增加一个按钮用来批量保存拖拽后的节点信息。后端接口代码,根据cid批量更新。并绑定一个click事件。基于上一节,做两个优化。原创 2024-07-24 19:20:38 · 181 阅读 · 0 评论 -
谷粒商城实战笔记-55-商品服务-API-三级分类-修改-拖拽数据收集
这一节的主要内容是收集拖拽后的要更新的节点的数据,逻辑比较复杂。所有这些数据都用收集到,然后发送给后台更新。拖拽结束后,触发拖拽结束事件,所以要在el-tree上绑定这个事件。事件函数nodeDrop定义如下。原创 2024-07-24 10:29:38 · 1210 阅读 · 0 评论 -
谷粒商城实战笔记-54-商品服务-API-三级分类-拖拽效果
这个函数接受三个参数,分别代表正在拖动的节点、可能的放置目标节点以及放置位置。el-tree控件加上允许拖拽的属性draggable,此外还需要根据层级判断是否能拖动,通过给allow-drop绑定事件allowDrag实现这个需求。类型的对象,表示当前正在被拖动的节点。它包含了关于拖动节点的所有信息,如节点的数据、状态等。如果拖动过程中没有特定的放置目标(例如,拖动到树的空白区域),这个参数可能是。,分别表示拖动的节点将放置在目标节点之前、之后或内部。类型的对象,表示潜在的放置目标节点。原创 2024-07-24 08:47:45 · 490 阅读 · 0 评论 -
谷粒商城实战笔记-52~53-商品服务-API-三级分类-新增-修改
点击Append,输入一个名为电子书222的分类,点击确定保存,保存成功后,界面刷新如下,说明前端操作成功。这一节实现点击Append按钮,打开弹窗填写内容,点击确定,调用后台接口保存分类信息。确定按钮绑定click事件函数addCategory,代码如下。弹窗使用el-dialog组件,基于参考文档copy代码。showStatus:默认为1,表示未被逻辑删除。catLevel:分类级别,等于父分类级别加1。查询后台数据库,有如下数据,说明后台保存成功。按钮的点击事件中讲这个变量的值置为。原创 2024-07-23 14:38:48 · 493 阅读 · 0 评论 -
谷粒商城实战笔记-50-51-商品分类的删除
这两节的内容是开发商品分类的删除功能。原创 2024-07-23 11:53:32 · 515 阅读 · 0 评论 -
谷粒商城实战笔记-48~49-商品服务-API-三级分类-查询-树形展示三级分类数据-前端优化
本节的主要内容是前后端联调,解决网关到商品服务的路由配置、前端的树形展示。原创 2024-07-23 09:09:47 · 295 阅读 · 0 评论 -
谷粒商城实战笔记-错误记录-启动失败
当你在编译Java代码时遇到“Output directory is not specified”错误,这通常意味着你的构建工具(如Maven、Gradle或Ant等)没有正确配置输出目录。这个错误常见于IDE(如IntelliJ IDEA, Eclipse)的项目设置中,或者在命令行使用。如果你已经检查了以上所有步骤但问题仍然存在,请提供更多的错误信息或你使用的具体环境,以便进一步诊断问题。这是由于Lombok的版本过低的原因,将Lombok版本提升至1.18.24后问题就可以解决。原创 2024-07-23 08:30:18 · 792 阅读 · 0 评论 -
谷粒商城实战笔记-踩坑-跨域问题
将配置中的.allowedOrigins替换成.allowedOriginPatterns即可。SpringBoot升级2.4.0+之后,跨域配置中的.allowedOrigins不再可用。导致正式发送请求时有两个相同的header头,配置重复。该错误信息指出,XMLHttpRequest 请求从。的跨域请求时,被CORS策略阻止。这个错误的原因是在网关和后台服务都配置了允许跨域。,但是CORS规范要求这个头部只能包含一个值。去掉后台服务的跨域配置就可以了。原创 2024-07-22 17:42:27 · 506 阅读 · 0 评论 -
谷粒商城实战笔记-47-商品服务-API-三级分类-网关统一配置跨域
上图图描述了非简单请求(如PUT、DELETE等)的跨域过程,具体来说,这是一个典型的CORS(Cross-Origin Resource Sharing)预检请求的过程。如果不同源,浏览器先发送一个轻量级的预检请求,询问服务器是否允许跨域访问,如果允许跨域访问,才会真正的发出请求。原因是同源策略是浏览器的安全策略,在不同源的情况下,服务器端如果允许跨域的话,浏览器仍然可以发出跨域请求。服务器收到预检请求后,检查请求头,如果满足条件(如允许的源、方法、请求头等),则返回一个成功的响应,包含。原创 2024-07-22 17:31:20 · 999 阅读 · 0 评论 -
谷粒商城实战笔记-包依赖踩坑
ClassNotFoundException类似错误,都是依赖问题,特别是模块比较多,有模块相互依赖、父子依赖,容易出现包版本不对、包冲突等问题。这次出现的问题主要是product模块依赖common模块,而不是common模块的子模块,所以common模块的对product模块不生效,导致版本问题。把移到父pom文件中即可。原创 2024-07-22 14:23:17 · 186 阅读 · 0 评论 -
谷粒商城实战笔记-46-商品服务-API-三级分类-配置网关路由与路径重写
要用原生的js和html开发一个树形展示界面是非常有挑战性的,但使用Vue和ElementUI,可以大大加速,在几分钟内完成开发。在左侧菜单栏创建商品系统菜单,这是renren-fast自带的功能,我们在页面上操作即可。点击确定后,刷新页面,可以看到左侧多了一个一级菜单。注意,上级菜单一定要选择上一步创建的“商品系统”。在ElementUI文档中找到树形控件,复制代码。使用我们之前配置vue模板快速插入代码。在商品系统下新增商品分类二级菜单。下新建文件夹product,然后在。,就可以看到三级菜单了。原创 2024-07-22 11:22:46 · 463 阅读 · 0 评论 -
谷粒商城实战笔记-45-商品服务-API-三级分类-查询-递归树形结构数据获取
从这一节开始,开始接触与到实际工作非常相似的内容,前面学习到的都是基础知识,现在开始学习和积累工作经验。这里要慎重提醒,请逐行敲代码,逐行敲代码,逐行敲代码。在敲代码之前,先理解三级分类。。做不到这点,工作效率一定非常低。本节的主要内容是开发产品模块的的接口。原创 2024-07-22 10:30:32 · 974 阅读 · 0 评论 -
谷粒商城实战笔记-44-前端基础-Vue-整合ElementUI快速开发/设置模板代码
本节在上一节用Vue脚手架创建的工程基础上,整合ElementUI。原创 2024-07-22 08:39:52 · 1026 阅读 · 0 评论 -
谷粒商城实战笔记-43-前端基础-Vue-使用Vue脚手架进行模块化开发
为了加深理解,我们可以自定义一个组件,并配置路由。原创 2024-07-21 19:21:16 · 1528 阅读 · 2 评论 -
谷粒商城实战笔记-42-前端基础-Vue-生命周期和钩子函数
/ 创建阶段},// 这里可以访问 this 对象并进行数据的初始化},},// 这里可以访问真实的 DOM 元素,如 this.$el},// 运行阶段},},// 销毁阶段},},// 错误处理${// 创建阶段 beforeCreate() {// 这里可以访问 this 对象并进行数据的初始化 } , beforeMount() {原创 2024-07-21 09:23:46 · 928 阅读 · 0 评论 -
谷粒商城实战笔记-41-前端基础-Vue-组件化基础
你点了我 {{ count }} 次,我记住了.原创 2024-07-21 08:32:40 · 1052 阅读 · 0 评论 -
谷粒商城实战笔记-40-前端基础-Vue-计算属性、监听器、过滤器
西游记;价格:{{xyjPrice}},数量:原创 2024-07-21 07:40:07 · 1089 阅读 · 0 评论 -
谷粒商城实战笔记-39-前端基础-Vue-指令-v-on、v-for、v-if
v-on 是 Vue.js 中的一个指令,用于在 DOM 元素上监听用户事件,并在事件触发时执行相应的 JavaScript 函数。它提供了一种将 Vue 实例中的方法与 DOM 事件关联起来的方式,使得你可以轻松地对用户交互做出响应。v-on 指令的基本语法是在元素上添加 v-on:event-name=“method”,其中 event-name 是你要监听的 DOM 事件类型(如 click、mouseover、keydown 等),method 则是 Vue 实例中定义的方法名。原创 2024-07-20 18:05:54 · 1013 阅读 · 1 评论 -
谷粒商城实战笔记-38-前端基础-Vue-指令-单向绑定&双向绑定
安全性v-text更安全,因为它总是将数据作为纯文本插入,不解析 HTML。v-html则可能引发安全问题,因为它会解析并渲染 HTML 标签。用途v-text适用于插入文本数据,而v-html适用于插入需要被解析为实际 HTML 的数据。处理 HTML 标签v-text忽略 HTML 标签,将其视为普通文本;v-html则会解析并显示 HTML 标签。二者都是单向绑定,元素绑定model,model不绑定元素,元素值改变时model值不会更新。原创 2024-07-20 16:46:53 · 1022 阅读 · 0 评论 -
谷粒商城实战笔记-36~44-Vue
这一节的主要内容是演示Vue的简单使用。Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层,不仅易于上手,还便于与第三方库或既有项目整合。另一方面,当与现代化的工具链以及各种支持类库结合使用时,Vue 也完全能够为复杂的单页应用提供驱动。总之,Vue能简化前端开发,提升开发效率。官网:https://cn.vuejs.org/原创 2024-07-20 15:22:16 · 859 阅读 · 0 评论 -
谷粒商城实战笔记-37-前端基础-Vue-基本语法&插件安装
v-on 是 Vue.js 中的一个指令,用于在 DOM 元素上监听用户事件,并在事件触发时执行相应的 JavaScript 函数。它提供了一种将 Vue 实例中的方法与 DOM 事件关联起来的方式,使得你可以轻松地对用户交互做出响应。v-on 指令的基本语法是在元素上添加 v-on:event-name=“method”,其中 event-name 是你要监听的 DOM 事件类型(如 click、mouseover、keydown 等),method 则是 Vue 实例中定义的方法名。原创 2024-07-20 15:18:22 · 688 阅读 · 0 评论 -
谷粒商城实战-Vue学习过程中踩坑记录
第一次使用Vue,按照步骤引入vue.js,创建div,创建Vue对象,但是未达预期效果。F12看了下网页源代码,发现创建Vue对象的代码的位置有问题,script标签出现了嵌套。查看源代码,发现引入标签时使用了自闭合的script标签。插值表达式没被替换为data对象中的属性值。原创 2024-07-20 12:23:50 · 245 阅读 · 0 评论 -
谷粒商城实战笔记-36-前端基础-Vue-介绍&HelloWorld
Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层,不仅易于上手,还便于与第三方库或既有项目整合。另一方面,当与现代化的工具链以及各种支持类库结合使用时,Vue 也完全能够为复杂的单页应用提供驱动。总之,Vue能简化前端开发,提升开发效率。官网:https://cn.vuejs.org/参考:https://cn.vuejs.org/v2/guide/原创 2024-07-20 12:13:28 · 1040 阅读 · 0 评论 -
谷粒商城实战笔记-35-前端基础-ES6-模块化
模块化就是把代码进行拆分,方便重复利用。类似 java 中的导包:要使用一个包,必须先导包。JS 中没有包的概念,JS中类似的概念是模块。export和import。export命令用于规定模块的对外接口。import命令用于导入其他模块提供的功能。原创 2024-07-20 07:46:34 · 595 阅读 · 0 评论 -
谷粒商城实战笔记-34-前端基础-ES6-promise异步编排
在ES6中,Promise是一个用于异步编程的重要构造,它代表了一个最终可能完成或失败的异步操作,并且具有一个最终的值。简单的说,Promise提供了一种新的异步调用的语法,让异步调用的语法更加简洁和容易理解。接下里,我们将以一个例子深入浅出的说清楚Promise的来龙去脉。原创 2024-07-12 11:55:32 · 1249 阅读 · 0 评论 -
谷粒商城实战笔记-29~34-前端基础 - ES6
通常被称为ES6,是JavaScript的一种规范,于2015年发布,因此有时也被称为ES2015。它是JavaScript语言的一次重大升级,引入了一系列新特性和语法糖,旨在提高语言的性能、可读性和功能丰富度。ES6 的目标之一是让JavaScript更接近其他成熟的编程语言,同时也保持其原有的灵活性和动态性。原创 2024-07-12 08:30:53 · 1051 阅读 · 0 评论