苍穹外卖项目Day01
1、软件开发整体介绍
1.1、软件开发流程

1.2、角色分工
- 项目经理:对整个项目负责,任务分配、把控进度
- 产品经理:进行需求调研,输出需求调研文档、产品原型等
- UI设计师:根据产品原型输出界面效果图
- 架构师:项目整体架构设计、技术选型等
- 开发工程师:代码实现
- 测试工程师:编写测试用例,输出测试报告
- 运维工程师:软件环境搭建、项目上线
1.3、软件环境
- 开发环境(development):开发人员在开发阶段使用的环境,一般外部用户无法访问
- 测试环境(testing):专门给测试人员使用的环境,用于测试项目,一般外部用户无法访问
- 生产环境(production):即上线环境,正式提供对外服务的环境
2、项目介绍
定位:专门为餐饮企业(餐厅、饭店)定制的一款软件产品
功能架构:体现项目中的业务功能模块

产品原型:用于展示项目的业务功能,一般由产品经理进行设计
技术选型:展示项目中使用到的技术框架和中间件等

3、开发环境搭建
整体结构
- 前端:管理端(Web)、用户端(小程序)
- 后端服务(Java)
3.1、前端环境搭建
开启nginx

3.2、后端环境搭建
3.2.1、熟悉项目结构
后端工程基于maven进行项目构建,并且进行分模块开发

如果maven加载不了可以加入镜像下载
xml
<repositories>
<repository>
<id>huawei</id>
<name>华为云</name>
<url>https://repo.huaweicloud.com/repository/maven/</url>
<releases><enabled>true</enabled></releases>
</repository>
<repository>
<id>aliyun</id>
<name>阿里云</name>
<url>http://maven.aliyun.com/nexus/content/groups/public/</url>
<releases><enabled>true</enabled></releases>
<!--snapshots默认是关闭的,需要开启 -->
<!--禁止从公共仓库下载snapshot构件是推荐的做法,因为这些构件不稳定,且不受你控制,你应该避免使用。
但是如果是私服仓库,可以激活snapshot的支持 -->
<snapshots><enabled>false</enabled></snapshots>
</repository>
</repositories>
3.2.2、使用git进行版本控制
使用Git进行项目代码的版本控制,具体操作:
-
创建Git本地仓库
-
创建Git远程仓库
- 复制仓库链接
- 复制仓库链接
-
将本地文件推送到Git远程仓库(选中全部)

3.2.3、数据库环境搭建
通过数据库建表语句创建数据库表结构:


在数据库中导入sql文件:

在idea中连接数据库

把配置文件中的用户名和密码改为自己的

3.2.4、前后端联调
后端的初始工程中已经实现了登录功能,直接进行前后端联调测试即可

编译项目:

编译成功后启动程序:

确保提前运行了nginx.exe,端口号为:localhost:80如果没有页面显示需要手动修改端口号
用户名:admin、密码:123456

成功登录!
前端发送的请求,是如何请求到后端服务的?
前端请求地址:http://localhost/api/employee/login
后端接口地址:http://localhost:8080/admin/employee/login
nginx反向代理,就是将前端发送的动态请求由nginx转发到后端服务器


nginx反向代理的好处:
- 提高访问速度
- 进行负载均衡
- 所谓负载均衡,就是把大量的请求按照我们特定的方式均衡的分配给集群中的每台服务器
- 保证后端服务安全
nginx反向代理的配置方式:

nginx负载均衡的配置方式:

nginx负载均衡策略:
名称 | 说明 |
---|---|
轮询 | 默认方式 |
weight | 权重方式,默认为1,权重越高,被分配的客户端请求就越多 |
ip_hash | 依据ip分配方式,这样每个访客可以固定访问一个后端服务 |
least_conn | 依据最少连接方式,把请求优先分配给连接少的后端服务 |
url_hash | 根据url分配方式,这样相同的url会被分配到同一个后端服务 |
fair | 依据响应时间方式,响应时间短的服务将会被优先分配 |
3.3、完善登录功能
问题:员工表中的密码是明文存储,安全性太低
1、将密码加密后存储,提高安全性
2、使用MD5加密方式对明文密码加密(不可逆)


步骤:
1、修改数据库中明文密码,改为MD5加密后的密文(e10adc3949ba59abbe56e057f20f883e)

2、修改Java代码,前端提交的密码进行MD5加密后再跟数据库中密码对比
EmployeeServiceImpl
java
//密码比对
// TODO 后期需要进行md5加密,然后再进行比对
//对前端传过来的明文密码进行md5加密处理
password = DigestUtils.md5DigestAsHex(password.getBytes());
3、测试:登录成功
4、导入接口文档
4.1、前后端分离开发流程

4.2、操作步骤
将课程资料中提供的项目接口导入YApi

打开yapi网页:YApi Pro-高效、易用、功能强大的可视化接口管理平台
5、Swagger
5.1、介绍
使用Swagger你只需要按照它的规范去定义接口及接口相关的信息,就可以做到生成接口文档,以及在线接口调试页面。官网:API Documentation & Design Tools for Teams | Swagger
Knife4j是Java MVC框架集成Swagger生成Api文档的增强解决方案
5.2、使用方式
1、导入maven坐标
xml
<!-- Knife4j-->
<dependency>
<groupId>com.github.xiaoymin</groupId>
<artifactId>knife4j-spring-boot-starter</artifactId>
<version>3.0.2</version>
</dependency>
2、在配置类中加入knife4j相关配置
java
/**
* 通过knife4j生成接口文档
* @return
*/
@Bean
public Docket docket() {
ApiInfo apiInfo = new ApiInfoBuilder()
.title("苍穹外卖项目接口文档")
.version("2.0")
.description("苍穹外卖项目接口文档")
.build();
Docket docket = new Docket(DocumentationType.SWAGGER_2)
.apiInfo(apiInfo)
.select()
.apis(RequestHandlerSelectors.basePackage("com.sky.controller"))
.paths(PathSelectors.any())
.build();
return docket;
}
3、设置静态资源映射,否则接口文档页面无法访问
java
/**
* 设置静态资源映射
* @param registry
*/
protected void addResourceHandlers(ResourceHandlerRegistry registry) {
registry.addResourceHandler("/doc.html").addResourceLocations("classpath:/META-INF/resources/");
registry.addResourceHandler("/webjars/**").addResourceLocations("classpath:/META-INF/resources/webjars/");
}
3、在浏览器中输入http://localhost:8080/doc.html#/home

- Yapi是设计阶段使用的工具,管理和维护接口
- Swagger在开发阶段使用的框架,帮助后端开发人员做后端的接口测试
登录测试:

5.2、常用注解
通过注解可以控制生成的接口文档,使接口文档拥有更好的可读性,常用注解如下:
注解 | 说明 |
---|---|
@Api | 用在类上,例如Controller,表示对类的说明 |
@ApiModel | 用在类上,例如entity、DTO、VO |
@ApiModelProperty | 用在属性上,描述属性信息 |
@ApiOperation | 用在方法上,例如Controller方法,说明方法的用途、作业 |
----------------------------------------------- |
| @Api | 用在类上,例如Controller,表示对类的说明 |
| @ApiModel | 用在类上,例如entity、DTO、VO |
| @ApiModelProperty | 用在属性上,描述属性信息 |
| @ApiOperation | 用在方法上,例如Controller方法,说明方法的用途、作业 |