目录
1. 电商项目架构图
1.1 系统架构
1.2 技术架构
2. 介绍电商项目
2.1 后台和前台、后端和前端
2.2 Vue全家桶包含哪些技术?
2.3 什么是Vuex?
2.4 什么是SSR
2.5 电商模式是什么?
2.6 枚举类
2.7 elasticsearch相关
2.8 gateway网关相关
2.9 nacos相关
2.10 定时任务
2.11 电商术语
3 项目中的业务
3.1 注册业务
3.2 权限任务业务
3.3 搜索业务
3.4 购物车业务
3.5 订单业务
3.6 支付业务
4. 项目中有哪些难点?你是如何解决的?
4.1 难点1:下单业务
4.2 难点2:支付业务
4.3 难点3:搜索
4.4 难点4:权限认证
5. 通过这个项目,你有哪些收获?
1. 电商项目架构图
- 技术框架/技术选型
1.1 系统架构
- 该项目是一个B2C的电商项目(类似小米商城、京东商城、天猫商城)
- 允许客户通过网络购买商品
- 该项目主要完成的是电商项目
前台
的开发。
- 采用前后端分离的方式进行开发的
- 前端:vue全家桶(Vue、Router、Vuex、Axios、Nuxt、SSR等技术)。
- 后端:Spring Cloud Gateway 网关、Spring Cloud alibaba技术栈(nacos、sentinel 等)分布式微服务架构。
- 该项目共有6个微服务(不考虑集群):
- gateway网关服务
- service-auth 认证服务
- service-cart 购物车服务
- service-orders 订单服务
- service-search 搜索服务
- service-web 核心业务(基本业务)服务
- 扩展:
- MQ服务(消息队列服务)
- SMS服务(短信服务)
- 本项目使用Nacos作为服务的注册与发现中心,以及信息的配置中心。
- 使用企业级消息队列RabbitMQ进行消息通信、应用解耦、流量控制、流量削峰。
- 采用企业级搜索引擎Elasticsearch实现商品的在线实时搜索。
- 该项目的追求目标:高并发、高可用、高稳定 。
1.2 技术架构
- 前端:
- Node.js :前端的服务器,用于启动vue相关的内容。
- Vue.js:前端使用的是vue相关的技术
- Element UI :vue的前端框架,提供通用的组件,减少CSS、特效等编写。
- Nuxt.js :vue的前端框架,用于解决SSR(服务端渲染)问题,易于SEO。
- 运维技术:
- Nacos:服务中心、配置中心
- redis:数据存储中心
- elasticsearch:搜索服务中心
- docker:用于部署项目(会将项目部署到linux系统中,在通过docker进行具体的部署)
- canal: https://github.com/alibaba/canal 自学
- 分布式架构
- spring boot :项目结构基础
- spring cloud alibaba:微服务架构
- jwt + RSA:鉴权中心,
- jwt用于生成token,
- RSA进行加密操作,用于辅助生成或校验token。
- 持久化技术栈:
- MyBatis Plus:用于取代MyBatis、通用Mapper,提供更优的工具、性能也有对应提升。
- Spring data redis:用于简化Java对redis操作
- spring data elasticsearch:用于简化java对es操作
- 数据库:
- mysql:免费的
- MyCat:用于数据库分库分表的。
- 外部接口:
- 阿里大鱼:发送短信
- 微信支付接口
2. 介绍电商项目
- 介绍一下你最熟悉的项目?
- 介绍一下最近完成的一个项目?
2.1 后台和前台、后端和前端
- 前台和后台均可以采用前后端分离的方式进行开发,也就形成了对应的前端和后端。
- 后台:提供给管理员使用。
- 电商的后台模块:会员管理、分类管理、快报管理、广告管理、商品管理、订单管理、财务管理、报表管理。
- 前端:element ui、element ui admin
- 后端:spring boot、spring cloud、spring cloud alibaba
- 前台:提供给用户使用。目前完成的电商项目只是部分,完成了前台部分。
- 电商的前台模块:注册、认证、无限极分类、快报、搜索、购物车、订单、支付。
- 前端:nuxt.js
- 后端:spring cloud alibaba
2.2 Vue全家桶包含哪些技术?
- vue:核心组件,主要用于数据的双向绑定。(html标签 与 vue data数据 进行 双向绑定)
- 生命周期、计算属性、过滤器、监听器 等
- router:路由,映射作用,使访问路径可以映射到对应的vue资源。
- 请求拦截器、响应拦截器 等
- vuex:状态管理,用于在多个组件之间共享数组。
- element ui :vue的组件库,提供通用的组件(内含CSS样式、JS特效)
- Nuxt:vue的框架,用于实现SSR技术。
- axios:第三方ajax框架
2.3 什么是Vuex?
- vuex是什么?
- vue全家桶的一个组件,进行状态管理,也就是在组件之间进行数据的共享
- vuex组件:状态state(死爹)、方法mutations(模特神)、功能actions、(模块modules、获得getters)
- 状态state:相当于变量,用于存放数据
- 方法mutations:用于操作变量,对变量的数据进行修改的
- 功能actions:用于调用方法,可以进行ajax操作。
- 如何使用?
- 基本使用:
- state:获得值
this.$store.state.变量
。一般与vue计算属性一起使用。 - mutations:调用方法
this.$store.commit("方法名", 参数)
。与vue method一起使用。 - actions:调用功能
this.$store.dispatch("功能名", 参数)
- 映射使用:
- 导入:
import {mapState, mapMutations, mapActions } from 'vuex'
- state : 编写在计算属性处
computed: {
...mapState(['变量名']),
变量名() { //等效
return this.$store.state.变量;
},
}
mutations:编写在普通方法处
methods: {
...mapMutations(['方法名']),
方法名(参数) { //等效
this.$store.commit("方法名", 参数)
}
}
2.4 什么是SSR
- SSR:服务端渲染技术,前端页面静态化技术,使ajax的数据与html标签不在分离,整合成一个整体。
- 也就是说将ajax查询的结果,处理成静态页面。
- nuxt.js 支持SSR技术,在页面加载前,通过asyncData进行ajax查询,并将查询结果合并定data区域,页面加载成功后,不需要再次查询。相当于静态页面。
- 用途:用于解决SEO(搜索引擎优化)问题。
- 搜索引擎提供的爬虫,优先爬取静态页面,为了提高网站的收录率,所以需要将动态页面转换成静态页面。
2.5 电商模式是什么?
- B2C:商家-客户
- 商家开发一个商城,并进行商品售卖。
- 用户通过商城进行商品的购买。
- 例如:唯品会、乐蜂网
- B2B2C:商家A-商家B-客户
- 商家B:开发一个商城,提供给商家A进行商品的售卖。商家B对商家A有监督等权利。
- 商家A:入驻到商家B开发的商城,进行商品的售卖。
- 客户:通过商城进行购买。
- 例如:京东、天猫
- C2B:客户-商家,客户提需求,商家进行定制。
- 例如:尚品宅配
- O2O:线上/线下,通过线上进行下单,通过线下进行交付。
- 例如:美团外卖、饿了么
- C2C:客户-客户,私人买卖。
- 例如:瓜子二手车、转转、咸鱼。
2.6 枚举类
- 枚举类的用途:限定指定类型的实例
- 常量类是jdk1.4的技术
- 枚举类是jdk1.5技术,用于取代常量类。如果没有参数,定义非常简单。
- 枚举:通过参数,设置需要记录的信息
package com.czxy.changgou4.enum_demo;
/**
* @author 桐叔
* @email liangtong@itcast.cn
* @description
*/
public enum Gender {
MALE(1,"男男"),FEMALE(0,"女女");
private Integer id; //编号
private String text; //文本
Gender(Integer id, String text) {
this.id = id;
this.text = text;
}
public Integer getId() {
return id;
}
public String getText() {
return text;
}
}
常量类,与上面的枚举等效的功能。
package com.czxy.changgou4.enum_demo;
/**
* @author 桐叔
* @email liangtong@itcast.cn
* @description
*/
public class GenderClass {
public final static GenderClass MALE = new GenderClass(1, "男");
public final static GenderClass FEMALE = new GenderClass(0, "女");
private Integer id; //编号
private String text; //文本
public GenderClass(Integer id, String text) {
this.id = id;
this.text = text;
}
public Integer getId() {
return id;
}
public String getText() {
return text;
}
}
测试
package com.czxy.changgou4.enum_demo;
/**
* @author 桐叔
* @email liangtong@itcast.cn
* @description
*/
public class TestGender {
public static void main(String[] args) {
System.out.println(Gender.MALE.getId());
System.out.println(GenderClass.FEMALE.getText());
}
}
2.7 elasticsearch相关
- elasticsearch的原理?
- 将数据保存到es中时,es会对数据进行分词。
- 每一个分词进行编号,在进行查询时,通过分词找到对应的编号,然后通过编号从索引库中找到对应的数据。
- 此过程就是原理,此原理称为“倒排索引”
- 为什么要使用elasticsearch?
- 数据库mysql不能分词,es可以进行分词搜索。
- 数据库可以对指定的字段进行模糊查询,也就是某个字段
- es进行全文分词检索。比mysql更灵活。
- es专业搜索,可以处理海量的数据,且速度很快。电商项目有海量的商品,需要es进行搜索。
- 为什么要使用IK分词器?
- 默认es对单字进行分词。
- 实际需要时,根据
词组
进行分词。需要特定的中文分词器。
2.8 gateway网关相关
- gateway网关的功能?网关的作用?
- 动态路由
- 负载均衡
- 鉴权
2.9 nacos相关
- nacos的作用?
- 微服务的注册中心:可以通过服务的名字获得对应服务位置
- 微服务的配置中心:将yml或properties配置文件中的内容,抽取到nacos中,通过修改nacos,相当于修改yml或properties文件。
- 为什么需要nacos?
- 微服务架构,都需要一个注册中心,管理所有的微服务。方便通过服务名称获得每一个服务的真实的IP地址+端口号。项目之间只需要记录服务名即可,服务的真实地址和端口号可以随意改变。
- 需要给自己的微服务选择一个注册中心。
- 常见的注册中心:nacos、eureka、dubbo的zookeeper 等
- nacos是alibaba提供额技术支持,经历过双十一的实战考验,优先选择。
2.10 定时任务
什么是SpringTask?
- SpringTask 是一个定时任务组件。
- 可以在指定的时间周期内,完成指定的任务。
- 一般情况采用的是cron表达式。
@Scheduled(cron = “0-5 * * ? * *”)
cron表达式
分7部分:秒 分 时 日期 月 周 年?
常用6部分:秒 分 时 日期 月 周, 且“日期”和“周”存在冲突问题,需要忽略其中一个,使用?。
, 或,例如:1,2,3
- 至,例如:1-5
/ 每,例如:0/5
* 任意
2.11 电商术语
- SKU、SPU
- SKU:stock keeping unit(库存量单位),进出库的最小单位,不能分隔。也就是具体的一个产品。
- SPU:Standard Product Unit(标准产品单位),一组可复用产出特性,相当于一个小的分类。
- PV、UV
- PV:Page View 页面浏览量,每访问一个页面就记录一次,同一个用户,同一个页面,访问多次,也记录多次。访问的累积量。
- UV:unique visitor 独立房客,同一个IP地址,在同一天内访问的次数。
3 项目中的业务
3.1 注册业务
- 为什么使用验证码?
- 防止用户的恶意点击
- 防止程序恶意访问
- 验证码有几种形式?
- 静态图片验证码(jpeg图)
- 动态图片验证码(gif图)
- 邮件验证码
- 短信验证码
- 特殊验证码(滑动图片部分、9宫格、选择若干汉字 等)
- 验证码是否有有效时长?如果有是多久?
- 有,一般5分钟
- 在后端存放到redis中有效时长。
- 为什么使用倒计时?时长多久?
- 防止用户恶意点击、误点击
- 短信存在延迟,需要有一个接收的时间
- 时长一般为60秒,不建议太长,用户不乐意等待
- 减少对服务器的访问次数,从而降低服务器请求压力
- 描述一下实现倒计时的基本思路?
- 一共需要使用3个变量:btnDisabled、seconds、timer
- seconds变量,用于进行倒计时,如果为零,将重置所有状态
- btnDisabled变量,用于控制按钮是否可以,倒计时阶段不能用
- timer变量,用于记录轮询,当倒计时为零时,停止轮询。
- 倒计时结束后,验证码是否仍有效?
- 有效,倒计时为60秒,发送验证码时,在redis中存5分钟,此时仍有效。
- 倒计时结束后,是否还可以发送验证码?
- 可以,60秒倒计时后,按钮就可以点击了。
- 短信发送失败的原因,及其解决方案?
- 阿里大鱼余额不足,无法发送。检查余额,及时充钱。
- 短信服务没有响应。检查对应短信服务,是否可以访问。
- 第三方软件不可用。检查redis、mq等是否可用
- 前端ajax没有发送成功。检查ajax路径、参数等,前端没有绑定ajax
- Redis的数据类型有哪些?
- redis有5种数据类型
- string类型:字符串,在redis最常用的类型,可以存放任意数据,通常转换成json即可。一键一值。
- list:有序集合,一键多值,值可以重复。
- set:无序,一键多值,值不可以重复。
- zset:有序不可重复的集合。一键多值。
- hash:键值对
- 验证码如何在redis唯一标识的?是否还有其他方案?
- 需要用户填写
用户名/手机号
,redis唯一标识固定串+手机号
或固定串+用户名
- 弊端:用户没有填写手机号前,不能点击获得验证码的。在用户填写验证码后,失去焦点时,进行ajax请求
- 常见方案:
- 每一个用户第一次访问页面时,给其分配一个随机数,记录再浏览器端(cookie、localStorage)
- 之后每次访问,都将携带该随机数,用随机数表示当前用户。
3.2 权限任务业务
- 权限认证使用的框架是什么?
- JWT: JSON Web Tokens , 目前最流行的跨域身份验证解决方案
- JWT的理解?JWT鉴权的流程
- 加密方式有哪些?
- Base64:使用64个可打印字符来表示二进制数据,从而进行数据的加密和解密。
- MD5: Message Digest Algorithm 消息摘要算法, 任意长度的数据字符串转化成短小的固定长度的值
- SHA: Secure Hash Algorithm,安全散列算法
- RSA:一种非对称加密算法,需要一对密钥,一个用于加密,另一个用于解密。
- 登录成功后,用户信息如何保存?
- 在微服务系统中,保存sessionStorage中
- 如果数据存放到vuex中,如何解决刷新页面数据丢失的问题?
- 方案1:不是公共组件:页面在pages目录下,可以nuxt.js提供 fetch进行操作。
- 方案2:是公共组件:组件在components目录下,借助第三方进行存储(cookie、localStorage、sessionStorage)
- 选择1:sessionStorage存放数据,如果vuex中没有,将sessionStorage同步过去。
- 选择2:vuex中actions模块就可以发送ajax,从而同步数据。
- 白名单是什么?如果使用?
- 白名单中的路径,无需鉴权校验,可以直接放行。
3.3 搜索业务
- elastisearch是如何搜索的
- 首先需要创建索引,
- 然后springboot-data-elasticsearch提供了丰富的API,进行查找所有、分页查找、排序,
- 还可以直接编写方法名,根据方法名搜索,
- 如果还不能满足需求,还可以使用NativeSearchQueryBuilder进行自定义查询
- withQuery 条件查询,通过 boolQueryBuilder进行组合查询
- matchQuery:分词查找
- termQuery: 精确匹配
- rangeQuery:范围搜索
- withSort :排序查询
- withPageable :分页查询
- 项目中的搜索业务是如何实现的?
- 电商项目中,搜索商品,我们实现了,根据三级分类搜索、关键字搜索,同时根据品牌、规格和规格选项、价格范围、销量降序、价格升序/降序、评论降序、上架时间降序等等条件进行组合搜索
- elasticsearch中的数据来自哪里?如何存进去的?
- elasticsearch中的数据会保存两份,一份是来自mysql,一份是来自elasticsearch,
- 代码同步:将mysql中的数据同步到elasticsearch中
- 其他方式:canal
3.4 购物车业务
- 购物车业务是商城非常核心的业务之一,跟购物车相关的功能有哪些?
- 加入购物车
- 修改购物车商品数量
- 修改购物车商品打钩状态
- 删除购物车中的商品
- 为什么使用localStorage?localStorage的优势?有哪些劣势?
- localStorage的存储量比cookie大,突破了cookie4k的限制
- localStorage属于永久性直接存储到本地,相当于一个前端页面的数据库,相比于 cookie 可以节约带宽
- 劣势:
- 浏览器的大小不统一,并且在 IE8 以上的 IE 版本才支持 localStorage 这个属性。
- 目前所有的浏览器中都会把localStorage的值类型限定为string类型,这个在对我们日常比较常见的JSON对象类型需要一些转换。
- localStorage在浏览器的隐私模式下面是不可读取的。
- localStorage本质上是对字符串的读取,如果存储内容多的话会消耗内存空间,会导致页面变卡。
- localStorage和sessionStorage的区别?
- localStorage 本地存储,属于永久性。只要浏览器不清空浏览器缓存,数据就可以长期保存。
- sessionStorage 会话存储,属于临时存储。浏览器端会话结束,数据就被清空。
- 为什么登录的情况下,将数据放入redis,而不是放入mysql?
- redis的优势是读写速度都快,写入mysql需要更多的时间,并发能力还没有redis强。
- 对于加入购物车的功能,操作很频繁,可以通过redis快速的写入、修改、获取,符合业务需求
3.5 订单业务
- 下单的业务是啥?项目如何实现下单功能的?下单流程是啥?
- 页面点击"提交"按钮,此时后端下单就开始执行了,流程中需要处理的业务非常多
- 第一个:需要生成订单的编号,考虑到分布式系统订单量庞大,如何防止订单编号重复呢?我们采用了雪花算法,雪花算法是推特开源的分布式ID生成器,在高并发场景下,可以有效的保证id唯一
- 第二个:需要根据地址编号addressId发起远程调用,请求address的详细信息,在我们的订单表中,我们是保存了每个订单的详细收货地址信息的,为什么订单需要重复保存收获地址信息呢?不是保存地址编号呢?因为地址信息是可以修改的,如果保存的是地址编号,后期地址信息发生改变的话,我这个订单的地址信息也就发生了改变,这与当时下单需要寄送的地址是冲突的
- 第三个:获取token,解析userId,根据userId去redis中取出数据。因为下单的商品数据来自redis,下单直接将redis中购物车中打钩的商品数据,保存为订单商品
- 第四个:保存订单、保存订单商品数据。
- 第五个:扣减库存,包括mysql、elasticsearch、redis;下单成功,对于mysql,需要修改sku的库存信息;对于elasticsearch,需要修改库存信息;对于redis,删除已经下单成功的商品信息,
- 第六个:对于第四个业务和第五个业务,要么全部成功,要么全部失败,在SpringCloud微服务架构下,涉及到多个服务间的业务调用,所以我们采用了分布式事务seata来保证数据的一致性和完整性
- 事务的特性?
- 什么是事务?
在一组(ABCD)业务逻辑操作中,要么全部成功,要么全部失败。
- 事务有哪些特性?
ACID 4个特性
原子性:一个事务是一个不可分割的整体
一致性:一个事务前后,数据时一致性的,也称为数据完整性。
隔离性:两个事务之间的并发访问问题
持久性:事务一旦操作,不能再改变。
- 隔离性有哪些问题?
脏读:一个事务读到了另一个事务没有提交的数据
不可重复读:一个事务读到了另一个事务已经提交的数据(更新)
虚读/幻读:一个事务读到了另一个事务已经提交的数据(添加),理论信息
- 如果解决隔离性的问题?
采用
隔离级别
来进行问题的解决。共4种隔离级别
- read uncommitted 读未提交:一个事务读到了另一个事务没有提交的数据。
解决了0个问题,存在脏读、不可重复读、虚读等3个问题。
- read commmitted 读已提交:一个事务读到了另一个事务已经提交的数据
解决了脏读等1个问题,存在不可重复读、虚读等2个问题。
- repeatable read 可重复读:在一个事务中,读到的数据时一致的。
解决了脏读、不可重复读等2个问题,存在虚读等1个问题。
- serializable 串行化:单事务,一次只能有一个事务。
解决了脏读、不可重复读、虚读等3个问题,存在0个问题。
- 隔离级别的安全与性能对比?
安全:read uncommitted < read commmitted < repeatable read < serializable
性能:read uncommitted > read commmitted > repeatable read > serializable
- 常见数据库的默认隔离级别
mysql:repeatable read
Oracle:read commmitted
- 分布式事务事务模型?
- 分布式事务的四种模式:XA 、AT、TCC、Saga、
- XA模式:基于XA协议的两阶段提交
- 优点:事务的强一致性,满足ACID原则。常用数据库都支持,实现简单。
- 缺点:因为一阶段需要锁定数据库资源,等待二阶段结束才释放,性能较差。
- AT模式:是一种无侵入的分布式事务解决方案。 阿里seata框架,实现了该模式
- 优点:
- 一阶段完成直接提交事务,释放数据库资源,性能比较好
- 利用全局锁实现读写隔离
- 没有代码侵入,框架自动完成回滚和提交
- 缺点:
- 两阶段之间属于软状态,属于最终一致,可能会引起脏写
- 框架的快照功能会影响性能,但比XA模式要好很多
- TCC模式: 根据自己的业务场景实现 Try、Confirm 和 Cancel 三个操作补偿机制。
- 优点:
- 一阶段完成直接提交事务,释放数据库资源,性能好
- 相比AT模型,无需生成快照,无需使用全局锁,性能最强
- 不依赖数据库事务,而是依赖补偿操作,可以用于非事务型数据库
- 缺点:
- 有代码侵入,需要人为编写try、Confirm和Cancel接口,太麻烦
- 软状态,事务是最终一致
- 需要考虑Confirm和Cancel的失败情况
- Saga模式: 是长事务解决方案。
3.6 支付业务
电商项目使用的是什么支付?是如何完成支付的?
- 微信支付
- 你还了解哪些支付方式?
- 微信支付
- 支付支付
- 银联支付
- 支付成功的回调,是如何调用本地方法的?
- 内网穿透技术
4. 项目中有哪些难点?你是如何解决的?
4.1 难点1:下单业务
- 涉及到多个多个微服务,多个业务的操作,需要向订单order 表、订单商品order-goods表新增数据,扣减sku的库存、更新elasticsearch的数据、更新redis的数据等等操作
- 这些操作要么全部成功,要么全部失败,所有需要采用分布式事务进行控制,
4.2 难点2:支付业务
- 微信服务器通知我们的服务器修改订单状态,由于开发的时候是内网,如何通知呢?我查了很多资料,最终发现通过内网穿透工具解决
- 项目后端如何通知项目前端根据订单状态进行页面跳转呢?采用websocket,以前没有接触过,自学了websocket,解决了这个问题
4.3 难点3:搜索
elasticsearch搜索,我们实现类跟京东、淘宝几乎一样的功能,搜索条件非常多、需要根据三级分类、关键字、品牌、规格和规格选项、价格排序、销量排序、上架时间排序、评论排序、分页等等功能,前后端都要事先,功能复杂,难度系数大
4.4 难点4:权限认证
- 如何保证用户信息的安全?采用MD5+SHA加密密码的方式,即使数据的用户信息被盗,盗用者也无法获取用户的密码信息
- 如何保证jwt的安全?JWT通过撒盐的方式,增加破解的难度
- 如何保证各个微服务的安全?通过jwt进行鉴权和授权,jwt解析失败,无法访问某些微服务
5. 通过这个项目,你有哪些收获?
- 第一次做这么大的项目,从业务逻辑、代码量都有很多提升
- 解决bug的能力
- 接触到了更多的新技术
- 自学了很多新技术
- 沟通、合作很重要