1. 蒼穹外賣項(xiàng)目介紹

1.1 項(xiàng)目介紹

1)管理端功能

員工登錄/退出 , 員工信息管理 , 分類管理 , 菜品管理 , 套餐管理 , 菜品口味管理 , 訂單管理 ，數(shù)據(jù)統(tǒng)計(jì)，來單提醒。

2)用戶端功能

微信登錄 , 收件人地址管理 , 用戶歷史訂單查詢 , 菜品規(guī)格查詢 , 購物車功能 , 下單 , 支付、分類及菜品瀏覽。

1.2 產(chǎn)品原型

1)管理端

餐飲企業(yè)內(nèi)部員工使用。 主要功能有:

2)用戶端

移動端應(yīng)用主要提供給消費(fèi)者使用。主要功能有:

1.3 技術(shù)選型

關(guān)于本項(xiàng)目的技術(shù)選型, 我們將會從 用戶層、網(wǎng)關(guān)層、應(yīng)用層、數(shù)據(jù)層 這幾個方面進(jìn)行介紹，主要用于展示項(xiàng)目中使用到的技術(shù)框架和中間件等。

• 用戶層 node.js VUE.js ElementUI 微信小程序 apache echarts
• 網(wǎng)關(guān)層 Nginx
• 應(yīng)用層 SpringBoot SpringMVC SpringTask SpringCache JWT 阿里云OSS httpclient Swagger POI WebSocket
• 數(shù)據(jù)層 MySQL Redis mybatis
• 工具 Git maven Junit postman pagehelper springdataredis

1)用戶層
后臺的前端頁面用到H5、Vue.js、ElementUI、apache echarts(展示圖表)等技術(shù)。移動端應(yīng)用使用到微信小程序。

2)網(wǎng)關(guān)層
Nginx是一個服務(wù)器，主要用來作為Http服務(wù)器，部署靜態(tài)資源，訪問性能高。在Nginx中還有兩個比較重要的作用： 反向代理和負(fù)載均衡， 在進(jìn)行項(xiàng)目部署時，要實(shí)現(xiàn)Tomcat的負(fù)載均衡，就可以通過Nginx來實(shí)現(xiàn)。

3)應(yīng)用層

• SpringBoot： 快速構(gòu)建Spring項(xiàng)目, 采用 "約定優(yōu)于配置" 的思想, 簡化Spring項(xiàng)目的配置開發(fā)。
• SpringMVC：SpringMVC是spring框架的一個模塊，springmvc和spring無需通過中間整合層進(jìn)行整合，可以無縫集成。
• Spring Task: 由Spring提供的定時任務(wù)框架。
• httpclient: 主要實(shí)現(xiàn)了對http請求的發(fā)送。
• Spring Cache: 由Spring提供的數(shù)據(jù)緩存框架
• JWT: 用于對應(yīng)用程序上的用戶進(jìn)行身份驗(yàn)證的標(biāo)記。
• 阿里云OSS: 對象存儲服務(wù)，在項(xiàng)目中主要存儲文件，如圖片等。
• Swagger： 可以自動的幫助開發(fā)人員生成接口文檔，并對接口進(jìn)行測試。
• POI: 封裝了對Excel表格的常用操作。
• WebSocket: 一種通信網(wǎng)絡(luò)協(xié)議，使客戶端和服務(wù)器之間的數(shù)據(jù)交換更加簡單，用于項(xiàng)目的來單、催單功能實(shí)現(xiàn)。

4)數(shù)據(jù)層

• MySQL： 關(guān)系型數(shù)據(jù)庫, 本項(xiàng)目的核心業(yè)務(wù)數(shù)據(jù)都會采用MySQL進(jìn)行存儲。
• Redis： 基于key-value格式存儲的內(nèi)存數(shù)據(jù)庫, 訪問速度快, 經(jīng)常使用它做緩存。
• Mybatis： 本項(xiàng)目持久層將會使用Mybatis開發(fā)。
• pagehelper: 分頁插件。
• spring data redis: 簡化java代碼操作Redis的API。

5)工具

• git: 版本控制工具, 在團(tuán)隊(duì)協(xié)作中, 使用該工具對項(xiàng)目中的代碼進(jìn)行管理。
• maven: 項(xiàng)目構(gòu)建工具。
• junit：單元測試工具，開發(fā)人員功能實(shí)現(xiàn)完畢后，需要通過junit對功能進(jìn)行單元測試。
• postman: 接口測工具，模擬用戶發(fā)起的各類HTTP請求，獲取對應(yīng)的響應(yīng)結(jié)果。

2. 開發(fā)環(huán)境搭建

2.1 熟悉項(xiàng)目結(jié)構(gòu)

對工程的每個模塊作用說明：

• sky-common: 模塊中存放的是一些公共類，可以供其他模塊使用

  分析sky-common模塊的每個包的作用：

  名稱	說明
  constant	存放相關(guān)常量類
  context	存放上下文類
  enumeration	項(xiàng)目的枚舉類存儲
  exception	存放自定義異常類
  json	處理json轉(zhuǎn)換的類
  properties	存放SpringBoot相關(guān)的配置屬性類
  result	返回結(jié)果類的封裝
  utils	常用工具類

• sky-pojo: 模塊中存放的是一些 entity、DTO、VO

  分析sky-pojo模塊的每個包的作用：

  名稱	說明
  Entity	實(shí)體，通常和數(shù)據(jù)庫中的表對應(yīng)
  DTO	數(shù)據(jù)傳輸對象，通常用于程序中各層之間傳遞數(shù)據(jù)
  VO	視圖對象，為前端展示數(shù)據(jù)提供的對象
  POJO	普通Java對象，只有屬性和對應(yīng)的getter和setter

• sky-server: 模塊中存放的是 配置文件、配置類、攔截器、controller、service、mapper、啟動類等

  分析sky-server模塊的每個包的作用：

  名稱	說明
  config	存放配置類
  controller	存放controller類
  interceptor	存放攔截器類
  mapper	存放mapper接口
  service	存放service類
  SkyApplication	啟動類

2.2 數(shù)據(jù)庫環(huán)境搭建

2.3 前后端聯(lián)調(diào)

1.Controller層

在sky-server模塊中，com.sky.controller.admin.EmployeeController

/**
     * 登錄
     *
     * @param employeeLoginDTO
     * @return
     */
    @PostMapping("/login")
    public Result<EmployeeLoginVO> login(@RequestBody EmployeeLoginDTO employeeLoginDTO) {
        log.info("員工登錄：{}", employeeLoginDTO);
		//調(diào)用service方法查詢數(shù)據(jù)庫
        Employee employee = employeeService.login(employeeLoginDTO);

        //登錄成功后，生成jwt令牌
        Map<String, Object> claims = new HashMap<>();
        claims.put(JwtClaimsConstant.EMP_ID, employee.getId());
        String token = JwtUtil.createJWT(
                jwtProperties.getAdminSecretKey(),
                jwtProperties.getAdminTtl(),
                claims);

        EmployeeLoginVO employeeLoginVO = EmployeeLoginVO.builder()
                .id(employee.getId())
                .userName(employee.getUsername())
                .name(employee.getName())
                .token(token)
                .build();

        return Result.success(employeeLoginVO);
    }

2.Service層

在sky-server模塊中，com.sky.service.impl.EmployeeServiceImpl

/**
     * 員工登錄
     *
     * @param employeeLoginDTO
     * @return
     */
    public Employee login(EmployeeLoginDTO employeeLoginDTO) {
        String username = employeeLoginDTO.getUsername();
        String password = employeeLoginDTO.getPassword();

        //1、根據(jù)用戶名查詢數(shù)據(jù)庫中的數(shù)據(jù)
        Employee employee = employeeMapper.getByUsername(username);

        //2、處理各種異常情況（用戶名不存在、密碼不對、賬號被鎖定）
        if (employee == null) {
            //賬號不存在
            throw new AccountNotFoundException(MessageConstant.ACCOUNT_NOT_FOUND);
        }

        //密碼比對
        if (!password.equals(employee.getPassword())) {
            //密碼錯誤
            throw new PasswordErrorException(MessageConstant.PASSWORD_ERROR);
        }

        if (employee.getStatus() == StatusConstant.DISABLE) {
            //賬號被鎖定
            throw new AccountLockedException(MessageConstant.ACCOUNT_LOCKED);
        }

        //3、返回實(shí)體對象
        return employee;
    }

3.Mapper層

在sky-server模塊中，com.sky.mapper.EmployeeMapper

package com.sky.mapper;

import com.sky.entity.Employee;
import org.apache.ibatis.annotations.Mapper;
import org.apache.ibatis.annotations.Select;

@Mapper
public interface EmployeeMapper {

    /**
     * 根據(jù)用戶名查詢員工
     * @param username
     * @return
     */
    @Select("select * from employee where username = #{username}")
    Employee getByUsername(String username);

}

注：可以通過斷點(diǎn)調(diào)試跟蹤后端程序的執(zhí)行過程

2.4 nginx反向代理和負(fù)載均衡

對登錄功能測試完畢后，接下來一個問題：前端發(fā)送的請求，是如何請求到后端服務(wù)的？

前端請求地址：http://localhost/api/employee/login
后端接口地址：http://localhost:8080/admin/employee/login
很明顯，兩個地址不一致，那是如何請求到后端服務(wù)的呢？

1)nginx反向代理

nginx 反向代理，就是將前端發(fā)送的動態(tài)請求由 nginx 轉(zhuǎn)發(fā)到后端服務(wù)器

那為什么不直接通過瀏覽器直接請求后臺服務(wù)端，需要通過nginx反向代理呢？

nginx 反向代理的好處：

• 提高訪問速度
  因?yàn)閚ginx本身可以進(jìn)行緩存，如果訪問的同一接口，并且做了數(shù)據(jù)緩存，nginx就直接可把數(shù)據(jù)返回，不需要真正地訪問服務(wù)端，從而提高訪問速度。

• 進(jìn)行負(fù)載均衡
  所謂負(fù)載均衡,就是把大量的請求按照我們指定的方式均衡的分配給集群中的每臺服務(wù)器。

• 保證后端服務(wù)安全
  因?yàn)橐话愫笈_服務(wù)地址不會暴露，所以使用瀏覽器不能直接訪問，可以把nginx作為請求訪問的入口，請求到達(dá)nginx后轉(zhuǎn)發(fā)到具體的服務(wù)中，從而保證后端服務(wù)的安全。

nginx 反向代理的配置方式：

server{
    listen 80;
    server_name localhost;

    location /api/{
        proxy_pass http://localhost:8080/admin/; #反向代理
    }
}

proxy_pass：該指令是用來設(shè)置代理服務(wù)器的地址，可以是主機(jī)名稱，IP地址加端口號等形式。

如上代碼的含義是：監(jiān)聽80端口號， 然后當(dāng)我們訪問 http://localhost:80/api/../..這樣的接口的時候，它會通過 location /api/ {} 這樣的反向代理到 http://localhost:8080/admin/上來。

接下來，進(jìn)到nginx-1.20.2\conf，打開nginx配置

# 反向代理,處理管理端發(fā)送的請求
location /api/ {
	proxy_pass   http://localhost:8080/admin/;
    #proxy_pass   http://webservers/admin/;
}

當(dāng)在訪問http://localhost/api/employee/login，nginx接收到請求后轉(zhuǎn)到http://localhost:8080/admin/，故最終的請求地址為http://localhost:8080/admin/employee/login，和后臺服務(wù)的訪問地址一致

2)nginx 負(fù)載均衡

當(dāng)如果服務(wù)以集群的方式進(jìn)行部署時，那nginx在轉(zhuǎn)發(fā)請求到服務(wù)器時就需要做相應(yīng)的負(fù)載均衡。其實(shí)，負(fù)載均衡從本質(zhì)上來說也是基于反向代理來實(shí)現(xiàn)的，最終都是轉(zhuǎn)發(fā)請求。

nginx 負(fù)載均衡的配置方式：

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;#負(fù)載均衡
    }
}

upstream：如果代理服務(wù)器是一組服務(wù)器的話，我們可以使用upstream指令配置后端服務(wù)器組。

如上代碼的含義是：監(jiān)聽80端口號， 然后當(dāng)我們訪問 http://localhost:80/api/../..這樣的接口的時候，它會通過 location /api/ {} 這樣的反向代理到 http://webservers/admin，根據(jù)webservers名稱找到一組服務(wù)器，根據(jù)設(shè)置的負(fù)載均衡策略(默認(rèn)是輪詢)轉(zhuǎn)發(fā)到具體的服務(wù)器。

注：upstream后面的名稱可自定義，但要上下保持一致。

nginx 負(fù)載均衡策略：

具體配置方式：

輪詢：

upstream webservers{
    server 192.168.100.128:8080;
    server 192.168.100.129:8080;
}

weight:

upstream webservers{
    server 192.168.100.128:8080 weight=90;
    server 192.168.100.129:8080 weight=10;
}

ip_hash:

upstream webservers{
    ip_hash;
    server 192.168.100.128:8080;
    server 192.168.100.129:8080;
}

least_conn:

upstream webservers{
    least_conn;
    server 192.168.100.128:8080;
    server 192.168.100.129:8080;
}

url_hash:

upstream webservers{
    hash &request_uri;
    server 192.168.100.128:8080;
    server 192.168.100.129:8080;
}

fair:

upstream webservers{
    server 192.168.100.128:8080;
    server 192.168.100.129:8080;
    fair;
}

3. 完善登錄功能

問題：員工表中的密碼是明文存儲，安全性太低。
解決思路：

1. 將密碼加密后存儲，提高安全性
2. 使用MD5加密方式對明文密碼加密

實(shí)現(xiàn)步驟：

1. 修改數(shù)據(jù)庫中明文密碼，改為MD5加密后的密文
   打開employee表，修改密碼

2. 修改Java代碼，前端提交的密碼進(jìn)行MD5加密后再跟數(shù)據(jù)庫中密碼比對
   打開EmployeeServiceImpl.java，修改比對密碼

   /**
        * 員工登錄
        *
        * @param employeeLoginDTO
        * @return
        */
       public Employee login(EmployeeLoginDTO employeeLoginDTO) {
           //1、根據(jù)用戶名查詢數(shù)據(jù)庫中的數(shù)據(jù)
           //2、處理各種異常情況（用戶名不存在、密碼不對、賬號被鎖定）
           //.......
           //密碼比對
           // TODO 后期需要進(jìn)行md5加密，然后再進(jìn)行比對
           password = DigestUtils.md5DigestAsHex(password.getBytes());
           if (!password.equals(employee.getPassword())) {
               //密碼錯誤
               throw new PasswordErrorException(MessageConstant.PASSWORD_ERROR);
           }
           //3、返回實(shí)體對象
           return employee;
       }

4. Swagger

4.1 介紹

Swagger 是一個規(guī)范和完整的框架，用于生成、描述、調(diào)用和可視化 RESTful 風(fēng)格的 Web 服務(wù)(https://swagger.io/)。 它的主要作用是：

1. 使得前后端分離開發(fā)更加方便，有利于團(tuán)隊(duì)協(xié)作
2. 接口的文檔在線自動生成，降低后端開發(fā)人員編寫接口文檔的負(fù)擔(dān)
3. 功能測試

Spring已經(jīng)將Swagger納入自身的標(biāo)準(zhǔn)，建立了Spring-swagger項(xiàng)目，現(xiàn)在叫Springfox。通過在項(xiàng)目中引入Springfox ，即可非常簡單快捷的使用Swagger。

knife4j是為Java MVC框架集成Swagger生成Api文檔的增強(qiáng)解決方案,前身是swagger-bootstrap-ui,取名kni4j是希望它能像一把匕首一樣小巧,輕量,并且功能強(qiáng)悍!

目前，一般都使用knife4j框架。

4.2 使用步驟

1. 導(dǎo)入 knife4j 的maven坐標(biāo)

在pom.xml中添加依賴

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

2. 在配置類中加入 knife4j 相關(guān)配置

WebMvcConfiguration.java

   /**
        * 通過knife4j生成接口文檔
        * @return
   */
       @Bean
       public Docket docket() {
           ApiInfo apiInfo = new ApiInfoBuilder()
                   .title("蒼穹外賣項(xiàng)目接口文檔")
                   .version("2.0")
                   .description("蒼穹外賣項(xiàng)目接口文檔")
                   .build();
           Docket docket = new Docket(DocumentationType.SWAGGER_2)
                   .apiInfo(apiInfo)
                   .select()
                   .apis(RequestHandlerSelectors.basePackage("com.sky.controller"))
                   .paths(PathSelectors.any())
                   .build();
           return docket;
       }

3. 設(shè)置靜態(tài)資源映射，否則接口文檔頁面無法訪問

WebMvcConfiguration.java

   /**
        * 設(shè)置靜態(tài)資源映射
        * @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/");
   }

4. 訪問測試

接口文檔訪問路徑為 http://ip:port/doc.html ---> http://localhost:8080/doc.html

4.3 常用注解

通過注解可以控制生成的接口文檔，使接口文檔擁有更好的可讀性，常用注解如下：

接下來，使用上述注解，生成可讀性更好的接口文檔

在sky-pojo模塊中
EmployeeLoginDTO.java

package com.sky.dto;

import io.swagger.annotations.ApiModel;
import io.swagger.annotations.ApiModelProperty;
import lombok.Data;

import java.io.Serializable;

@Data
@ApiModel(description = "員工登錄時傳遞的數(shù)據(jù)模型")
public class EmployeeLoginDTO implements Serializable {

    @ApiModelProperty("用戶名")
    private String username;

    @ApiModelProperty("密碼")
    private String password;

}

EmployeeLoginVo.java

package com.sky.vo;

import io.swagger.annotations.ApiModel;
import io.swagger.annotations.ApiModelProperty;
import lombok.AllArgsConstructor;
import lombok.Builder;
import lombok.Data;
import lombok.NoArgsConstructor;

import java.io.Serializable;

@Data
@Builder
@NoArgsConstructor
@AllArgsConstructor
@ApiModel(description = "員工登錄返回的數(shù)據(jù)格式")
public class EmployeeLoginVO implements Serializable {

    @ApiModelProperty("主鍵值")
    private Long id;

    @ApiModelProperty("用戶名")
    private String userName;

    @ApiModelProperty("姓名")
    private String name;

    @ApiModelProperty("jwt令牌")
    private String token;

}

在sky-server模塊中

EmployeeController.java

package com.sky.controller.admin;

import com.sky.constant.JwtClaimsConstant;
import com.sky.dto.EmployeeLoginDTO;
import com.sky.entity.Employee;
import com.sky.properties.JwtProperties;
import com.sky.result.Result;
import com.sky.service.EmployeeService;
import com.sky.utils.JwtUtil;
import com.sky.vo.EmployeeLoginVO;
import io.swagger.annotations.Api;
import io.swagger.annotations.ApiOperation;
import lombok.extern.slf4j.Slf4j;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;

import java.util.HashMap;
import java.util.Map;

/**
 * 員工管理
 */
@RestController
@RequestMapping("/admin/employee")
@Slf4j
@Api(tags = "員工相關(guān)接口")
public class EmployeeController {

    @Autowired
    private EmployeeService employeeService;
    @Autowired
    private JwtProperties jwtProperties;

    /**
     * 登錄
     *
     * @param employeeLoginDTO
     * @return
     */
    @PostMapping("/login")
    @ApiOperation(value = "員工登錄")
    public Result<EmployeeLoginVO> login(@RequestBody EmployeeLoginDTO employeeLoginDTO) 	{
        //
    }

    /**
     * 退出
     *
     * @return
     */
    @PostMapping("/logout")
    @ApiOperation("員工退出")
    public Result<String> logout() {
        return Result.success();
    }

}

啟動服務(wù)：訪問http://localhost:8080/doc.html文章來源地址http://www.zghlxwxcb.cn/news/detail-710359.html

到了這里，關(guān)于蒼穹外賣-第一章項(xiàng)目介紹的文章就介紹完了。如果您還想了解更多內(nèi)容，請?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！