Spring-jt-Day11-分布式后端登录页面

版权声明：本文为闪耀太阳原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
原文链接：https://blog.csdn.net/qq_16804847/article/details/116737327

1. 京淘项目后端架构图

2. 京淘项目后台搭建

2.1 互联网架构设计

2.1.1 高并发

定义: 在同一时间内,大量用户访问服务器的数量.
常识: 单台tomcat服务器 支持的并发数? 官方数据: 200-270左右(理论值)
实际值: 150左右 网速/硬件设备(核数/内存) 云平台
JVM调优: tomcat服务器单台性能 可以达到1000/秒 (增大运行内存) 监控
软件不够,硬件来凑

2.1.2 分布式

2.1.2.1 分布式计算

一项任务由多台服务器同时完成. 大数据的处理方式  任务拆分(包). 再有多个线程分别执行各自的包, 结果整合

2.1.2.2 分布式系统

说明: 当先的企业在构建项目时 一般都采用分布式的系统的方式.
核心思想: 化整为零 (拆)

2.1.3 分布式系统

2.1.3.0 业务分析

说明: 如果将项目中所有的功能都放到一起,则架构的耦合性较高,如果其中一个出现问题,则直接影响整个服务器.

2.1.3.1 按照业务拆分

说明: 将项目按照业务(模块) 将大型项目进行拆分,拆分为若干的小型的工程.

2.1.3.2 按照层级拆分

说明: 由于业务的复杂度高导致开发耦合性高/业务耦合较高, 则可以采用按照层级拆分的方式 实现解耦.

2.1.3.3 关于分布式总结

说明: 通常由于项目的模块众多业务复杂,导致项目开发时耦合性高. 这时采用分布式的思想进行项目拆分(业务(模块)拆分,按照层级拆分).从架构角度实现了解耦.

2.1.3 集群/高可用(HA)

集群: 通常采用多台服务器一起为用户提供服务.
高可用: 当服务器发生故障时,无需人为的干预,自动的实现故障的迁移.

2.2 分布式系统存在的问题

2.2.1 问题说明

1.众多项目如何管理jar包/版本
2.工具包如何优化

2.2.2 聚合工程构建

3 京淘项目后台搭建

3.1 创建父级工程

3.1.1 创建项目

3.1.2 编辑pom.xml文件

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0"
         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
    <modelVersion>4.0.0</modelVersion>
    <groupId>com.jt</groupId>
    <artifactId>jt</artifactId>
    <version>1.0-SNAPSHOT</version>
    <!--指定打包方式 jar/war/pom聚合工程 -->
    <packaging>pom</packaging>

    <!--引入父级工程-->
    <parent>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-parent</artifactId>
        <version>2.4.5</version>
        <relativePath/>
    </parent>


    <properties>
        <java.version>1.8</java.version>
        <!--跳过测试类打包-->
        <skipTests>true</skipTests>
    </properties>

    <dependencies>
        <!--SpringMVCjar包文件-->
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-web</artifactId>
        </dependency>

        <!-- 引入aop支持 -->
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-aop</artifactId>
        </dependency>

        <!--热部署工具-->
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-devtools</artifactId>
            <scope>runtime</scope>
            <optional>true</optional>
        </dependency>
        <!--lombok插件-->
        <dependency>
            <groupId>org.projectlombok</groupId>
            <artifactId>lombok</artifactId>
            <optional>true</optional>
        </dependency>

        <!--测试包-->
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-test</artifactId>
            <scope>test</scope>
        </dependency>

        <!--引入jdbc包-->
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-jdbc</artifactId>
        </dependency>

        <!--引入数据库驱动 -->
        <dependency>
            <groupId>mysql</groupId>
            <artifactId>mysql-connector-java</artifactId>
            <scope>runtime</scope>
        </dependency>

        <!--spring整合mybatis-plus -->
        <dependency>
            <groupId>com.baomidou</groupId>
            <artifactId>mybatis-plus-boot-starter</artifactId>
            <version>3.4.2</version>
        </dependency>

        <!--spring整合redis -->
        <dependency>
            <groupId>redis.clients</groupId>
            <artifactId>jedis</artifactId>
        </dependency>
        <dependency>
            <groupId>org.springframework.data</groupId>
            <artifactId>spring-data-redis</artifactId>
        </dependency>
    </dependencies>

    <!--父级工程是一种结构 没有java代码 不需要执行运行,所以不需要build标签-->
</project>

3.2 创建工具API

3.2.1 创建common项目

3.2.2 导入资源文件

3.3 创建jt_manage

3.3.1 创建项目

3.3.2 编辑pom.xml文件

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0"
         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
    <parent>
        <artifactId>jt</artifactId>
        <groupId>com.jt</groupId>
        <version>1.0-SNAPSHOT</version>
    </parent>
    <modelVersion>4.0.0</modelVersion>

    <artifactId>jt_manage</artifactId>

    <!-- 依赖工具API-->
    <dependencies>
        <dependency>
            <groupId>com.jt</groupId>
            <artifactId>jt_common</artifactId>
            <version>1.0-SNAPSHOT</version>
        </dependency>
    </dependencies>

    <!--添加build标签-->
    <build>
        <plugins>
            <plugin>
                <groupId>org.springframework.boot</groupId>
                <artifactId>spring-boot-maven-plugin</artifactId>
                <configuration>
                    <excludes>
                        <exclude>
                            <groupId>org.projectlombok</groupId>
                            <artifactId>lombok</artifactId>
                        </exclude>
                    </excludes>
                </configuration>
            </plugin>
        </plugins>
    </build>


</project>

3.3.3 导入jt_manage的src文件

说明: 将课前资料中的jt_manage中的src文件导入. 导入之前先删除自己的文件, 效果如图.

3.3.4 代码测试

4. 京淘项目业务实现

4.1 关闭ESLint代码校验

4.1 编辑用户输入框

4.2 用户数据校验

4.2.1 思路

在防止用户犯错的前提下，尽可能让用户更早地发现并纠正错误。

4.2.2 elementUI表单校验

API用法: Form 组件提供了表单验证的功能，只需要通过 rules 属性传入约定的验证规则，并将 Form-Item 的 prop 属性设置为需校验的字段名即可。
1).编辑页面HTML

2).编辑页面JS

3).页面效果展现

4.3 表单重置

4.3.1 需求说明

说明:当用户点击重置按钮时,应该清空表单数据.

4.3.2 组件结构

4.3.4 实现表单重置

4.4 登录校验

4.4.1 校验API

4.4.2 编辑页面JS

4.5 引入Axios组件

说明: 在main.js中添加axios的组件,并且设定全局变量.

import Vue from 'vue'
import App from './App.vue'
import router from './router'
import './plugins/element.js'
import './assets/css/global.css'
import './assets/ali-icon/iconfont.css'

/* 导入axios包 */
import axios from 'axios'
/* 设定axios的请求根目录 */
axios.defaults.baseURL = 'http://localhost:8091/'
/* 向vue对象中添加全局对象 以后发送ajax请求使用$http对象 */
Vue.prototype.$http = axios



Vue.config.productionTip = false

new Vue({
  router,
  render: h => h(App)
}).$mount('#app')

4.6 登录业务实现

4.6.1 编辑VO对象

说明: 在jt-common的vo中添加SysResult对象

package com.jt.vo;

import lombok.AllArgsConstructor;
import lombok.Data;
import lombok.NoArgsConstructor;
import lombok.experimental.Accessors;

@Data
@Accessors(chain = true)
@NoArgsConstructor
@AllArgsConstructor
public class SysResult {

    private Integer status; //状态码信息 200成功  201失败
    private String msg;     //服务器提示信息
    private Object data;    //服务器返回值

    public static SysResult fail(){
        return new SysResult(201,"服务器运行失败",null);
    }

    public static SysResult success(){
        return new SysResult(200, "服务器运行成功", null);
    }

    public static SysResult success(Object data){
        return new SysResult(200, "服务器运行成功", data);
    }

    public static SysResult success(String msg,Object data){
        return new SysResult(200, msg, data);
    }
}

4.6.2 编辑UserController

说明: 根据Ajax提交的请求,在UserController中编辑方法,实现用户登录业务.

package com.jt.controller;

import com.jt.pojo.User;
import com.jt.service.UserService;
import com.jt.vo.SysResult;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.util.StringUtils;
import org.springframework.web.bind.annotation.*;

import java.util.List;

/**
 * @author 刘昱江
 * 时间 2021/5/11
 */
@RestController
@CrossOrigin
@RequestMapping("/user")    //抽取公共的请求
public class UserController {

    @Autowired
    private UserService userService;

    /**
     * 1.url地址: /user/login
     * 2.请求参数: 用户表单对象的JSON串   post类型
     * 3.返回值结果 SysResult  token?有值 正确        null 错误
     */
    @PostMapping("/login")
    public SysResult login(@RequestBody User user){

        String token = userService.findUserByUP(user);
        if(StringUtils.hasLength(token)){
            return SysResult.success(token);
        }else{
            return SysResult.fail();
        }
    }

}

4.6.3 MD5

MD5信息摘要算法（英语：MD5 Message-Digest Algorithm），一种被广泛使用的密码散列函数，可以产生出一个128位（16字节）的散列值（hash value），用于确保信息传输完整一致。MD5由美国密码学家罗纳德·李维斯特（Ronald Linn Rivest）设计，于1992年公开，用以取代MD4算法。这套算法的程序在 RFC 1321 标准中被加以规范。1996年后该算法被证实存在弱点，可以被加以破解，对于需要高度安全性的数据，专家一般建议改用其他算法，如SHA-2。2004年，证实MD5算法无法防止碰撞（collision），因此不适用于安全性认证，如SSL公开密钥认证或是数字签名等用途。

4.6.4 编辑UserService

作业

完成用户登录操作