当前位置：首页 > news >正文

苍穹外卖学习day01：项目概述与环境搭建

news 2026/3/26 18:54:36

最近开始学习一个企业级项目——苍穹外卖，这是一个专门为餐饮企业定制的外卖管理系统。项目分为管理端（商家使用）和用户端（点餐用户使用），涵盖从需求分析到上线运维的完整软件开发流程。作为第一阶段的学习，我主要了解了项目背景、技术选型，并完成了开发环境的搭建。下面将day01的内容整理成博客，与大家分享。

一、软件开发整体介绍

在开始项目之前，我们需要了解软件开发的全貌，包括流程、角色分工和常见环境。

1. 软件开发流程

一个标准的软件项目通常经历以下阶段：

需求分析：输出需求规格说明书、产品原型
设计：UI设计、数据库设计、接口设计
编码：编写代码、单元测试
测试：测试用例、测试报告
上线运维：软件环境安装、配置

每个阶段都有明确的交付物，环环相扣。

2. 角色分工

项目经理：负责整个项目，分配任务、把控进度
产品经理：需求调研，输出需求文档和原型
UI设计师：根据原型设计界面效果图
架构师：项目整体架构设计、技术选型
开发工程师：代码实现
测试工程师：编写测试用例，输出测试报告
运维工程师：搭建环境、部署上线

3. 软件环境

开发环境（development）：开发人员使用，外部无法访问
测试环境（testing）：测试人员使用，模拟真实环境
生产环境（production）：线上环境，正式对外服务

二、苍穹外卖项目介绍

1. 项目定位

苍穹外卖专门为餐饮企业定制，帮助商家管理外卖业务，同时也为用户提供点餐功能。

2. 功能架构

管理端（商家使用）

员工管理
订单管理
分类管理
菜品管理
套餐管理
工作台
数据统计
来单提醒

用户端（小程序）

微信登录
微信支付
商品浏览
历史订单
购物车
地址管理
用户下单
用户催单

3. 产品原型

产品原型由产品经理设计，用于展示项目的业务功能，是开发和测试的重要依据。

4. 技术选型

苍穹外卖采用前后端分离架构，技术栈非常丰富：

用户层：Node.js、Vue.js、ElementUI、微信小程序、Apache ECharts
网关层：Nginx
应用层：Spring Boot、Spring MVC、Spring Task、HttpClient、Spring Cache、JWT、阿里云OSS、Swagger、POI、WebSocket
数据层：MySQL、Redis、MyBatis、PageHelper、Spring Data Redis
工具：Git、Maven、JUnit、Postman

这套技术栈涵盖了目前Java后端开发的常用框架，非常适合用来提升实战能力。

三、开发环境搭建

1. 整体结构

项目分为前端和后端：

管理端Web（基于nginx运行）
用户端小程序
后端Java服务（分模块开发）

2. 前端环境搭建

前端工程基于nginx运行，只需要双击nginx.exe启动nginx服务，访问端口80即可。前端请求通过nginx反向代理转发到后端。

把下载的项目前端部分放在一个没中文的路径下：项目\资料\day01\前端运行环境\nginx-1.20.2，双击运行

访问localhost能正常显示html就行了

3. 后端环境搭建

后端采用Maven进行分模块构建，项目结构如下：

sky-common：公共类、工具类，供其他模块使用
sky-pojo：实体类（Entity）、数据传输对象（DTO）、视图对象（VO）
sky-server：配置文件、配置类、拦截器、Controller、Service、Mapper、启动类等

把资料中\后端初始工程\sky-take-out导入，使用Git进行版本控制，将本地代码推送到远程仓库。

数据库环境这里用MYSQLWorkerbench运行资料里的sql文件创建表结构。数据库密码配置在 application-dev.yml 文件中，记得改成自己的密码。

进入ide调试，clean然后compile，不出意外应该会报错，在设置里把java版本换到17，把lombok版本改成30以上（这里我是1.18.34），然后编译就成功了。

4. 前后端联调

初始工程已经实现了登录功能，我们可以进行联调测试。
前端请求地址：http://localhost/api/employee/login
后端接口地址：http://localhost:8080/admin/employee/login

登录账户名admin，密码123456（数据库empolyee中已经有一个账户），可以看到项目已经导入成功了，可以正常登录进去显示初始页面。

这里使用了nginx反向代理，将/api路径的请求转发到后端服务器。
nginx配置示例：

nginx

server { listen 80; server_name localhost; location /api/ { proxy_pass http://localhost:8080/admin/; } }

这样既提高了访问速度，也保证了后端服务的安全。

如果后端服务部署了多台服务器，nginx还可以实现负载均衡：

nginx

upstream webservers { server 192.168.100.128:8080; server 192.168.100.129:8080; } server { listen 80; server_name localhost; location /api/ { proxy_pass http://webservers/admin/; } }

负载均衡策略包括轮询、权重、ip_hash等。

5. 完善登录功能

初始项目中，员工表的密码是明文存储，存在安全隐患。我们做了两处改进：

将数据库中的密码改为MD5加密后的密文（例如123456加密后为e10adc3949ba59abbe56e057f20f883e）如果用mysqlworkerbench，改完记得commit一下！

UPDATE sky_take_out.employee SET password = MD5('你的密码') WHERE username='admin';

修改Java代码，将前端提交的密码进行MD5加密后再与数据库比对：

password = DigestUtils.md5DigestAsHex(password.getBytes()); if (!password.equals(employee.getPassword())) { throw new PasswordErrorException(MessageConstant.PASSWORD_ERROR); }

这样就提高了系统的安全性。

四、导入接口文档

在前后端分离开发中，接口文档是前后端协作的桥梁。通常我们会使用YApi（网页容易卡）或者apifox（推荐）这样的平台来管理和维护接口文档。

操作步骤：

将课程资料中提供的项目接口导入：建议用apifox导入，类型选yapi。

开发中，前后端都依据接口定义进行开发和调试，这样保证了接口的一致性和可维护性。

五、Swagger接口文档框架（可以仅了解）

Swagger是一个强大的接口文档生成工具，可以让我们在开发过程中实时生成和测试接口文档。

1. 介绍

使用Swagger，只需按照规范定义接口及接口相关信息，就能自动生成接口文档，并提供在线调试页面。
这里我们使用Knife4j，它是Swagger的增强解决方案，界面更友好。

2. 使用方式

步骤1：导入knife4j的Maven坐标

xml

<dependency> <groupId>com.github.xiaoymin</groupId> <artifactId>knife4j-spring-boot-starter</artifactId> <version>3.0.2</version> </dependency>

步骤2：在配置类中添加Docket配置

java

@Bean public Docket docket() { ApiInfo apiInfo = new ApiInfoBuilder() .title("苍穹外卖项目接口文档") .version("2.0") .description("苍穹外卖项目接口文档") .build(); return new Docket(DocumentationType.SWAGGER_2) .apiInfo(apiInfo) .select() .apis(RequestHandlerSelectors.basePackage("com.sky.controller")) .paths(PathSelectors.any()) .build(); }

步骤3：设置静态资源映射，使接口文档页面可以访问

java

@Override protected void addResourceHandlers(ResourceHandlerRegistry registry) { registry.addResourceHandler("/doc.html") .addResourceLocations("classpath:/META-INF/resources/"); registry.addResourceHandler("/webjars/**") .addResourceLocations("classpath:/META-INF/resources/webjars/"); }

之后访问http://ip:port/doc.html即可看到接口文档页面，并可以直接进行接口测试。