19 | 南梦秋

1、构建项目

1.1 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>org.example</groupId>
    <artifactId>yibao</artifactId>
    <version>1.0-SNAPSHOT</version>

    <properties>
        <maven.compiler.source>8</maven.compiler.source>
        <maven.compiler.target>8</maven.compiler.target>
        <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
    </properties>
    <parent>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-parent</artifactId>
        <version>2.3.6.RELEASE</version>
    </parent>

    <dependencies>
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-web</artifactId>
        </dependency>
        <dependency>
            <groupId>tk.mybatis</groupId>
            <artifactId>mapper-spring-boot-starter</artifactId>
            <version>2.1.5</version>
        </dependency>
        <!-- jdbc-->
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-jdbc</artifactId>
        </dependency>
        <!--mysql驱动-->
        <dependency>
            <groupId>mysql</groupId>
            <artifactId>mysql-connector-java</artifactId>
        </dependency>
    </dependencies>

    <!-- maven打包插件 -->
    <build>
        <!-- jar包名称 -->
        <finalName>${project.name}</finalName>
        <plugins>
            <plugin>
                <groupId>org.springframework.boot</groupId>
                <artifactId>spring-boot-maven-plugin</artifactId>
            </plugin>
        </plugins>
    </build>

</project>

1.2 application.yaml

server:
  port: 80
spring:
  datasource:
    driver-class-name: com.mysql.cj.jdbc.Driver
    url: jdbc:mysql://localhost:3306/user?serverTimezone=Asia/Shanghai
    username: root
    password: 123456
mybatis:
  type-aliases-package: com.example.pojo
  mapper-locations: classpath:/mapper/*.xml

2、项目结构

main

java

com.example

controller

UserController

mapper

UserMapper

pojo

User

service

impl.UserServiceImpl

UserSerive

UserApplication

resource

mapper

UserMapper.xml

static

script

axios.min.js

vue.js

list.html

submit.html

applicatiom.yaml

3、前端代码

3.1 list.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<script type="text/javascript" src="/script/vue.js"></script>
<script type="text/javascript" src="/script/axios.min.js"></script>

<body>

<div  id="app">
    <h3>用户信息列表</h3>
        <table  border="1"  id="data_tab">
            <tr class="success">
                <th>姓名</th>
                <th>邮箱</th>
            </tr>
            <tr v-for="user in userList">
                <td>{{user.name}}</td>
                <td>{{user.email}}</td>
            </tr>
        </table>

</div>
<script>
    new Vue({
        el:"#app",
        data:{
            userList: [],
            /*user:{
                name:null,
                email:null
            }*/
        },
        created() {
            this.fetchUserList();
        },
        methods: {
            fetchUserList() {
                //使用axios发送异步请求
                axios({
                    method:"get",
                    url:"http://localhost:80/user/findAll"
                }).then(response => {
                    this.userList = response.data
                }).catch(error => {
                    //调用失败信息
                    console.log(error.response)
                })
            }
        }
        });

</script>
</body>
</html>

3.2 submit.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<script type="text/javascript" src="/script/vue.js"></script>
<script type="text/javascript" src="/script/axios.min.js"></script>
<body>
<div id = "app">
    <form >
        用户: <input name="name"  v-model="user.name"><br>
        邮箱: <input type="email"  v-model="user.email"><br>
        密码: <input type="password"  v-model="user.password"><br>
    </form>
    <button @click = "submitForm">submit</button>
    <button onclick="window.location.href='list.html'" type="button" id="add">查看用户列表</button>

</div>
<script>
    new Vue({
        el:"#app",
        data:{
           user:{
               name:null,
               password:null,
               email:null
           }
        },
        methods: {
            submitForm() {
                that = this
                //使用axios发送异步请求
                console.log(that.user)
                axios({
                    method:"post",
                    url:"http://localhost:80/user/save",
                    data:that.user
                }).catch(error => {
                    console.log(error.response)
                })
            }
        }
    });
</script>
</body>
</html>

4、数据库设计

create database user;
use user;
create table user(
id int primary key auto increment
name varchar (15)
password varhcar (15)
email varhcar (20)
);

5、后端代码

5.1 UserController


@RestController
@RequestMapping("/user")
public class UserController {
    @Autowired
    private UserService userService;

    /**
     * 查询用户列表
     * @return
     */
    @GetMapping("/findAll")
    public List<User> findAll(){
        return  userService.findAll();
    }

    @PostMapping("/save")
    public void save( @RequestBody  User user){
        userService.save(user);
    }

}

5.2UserMapper

@Mapper
public interface UserMapper {

    void save(User user);

    List<User> findAll( );
}

5.3User

public class User {


    private Integer id;

    private String name;

    private String password;

    private String email;
    
    getter/setter
}

5.4UserService

public interface UserService {

     void save(User user);

     List<User> findAll( );
}

5.5UserServiceImpl


@Service
public class UserServiceImpl implements UserService {

    //数据缓存
    static List<User>  userList =  new  ArrayList();

    //判断第一次查询,
    private Boolean flag = true;
    @Autowired
    private UserMapper userMapper;

    @Override
    public void save(User user) {
        if(flag){
            this.findAll();
        }
        if (!userList.contains(user)){
            //缓存中没有user,插入到数据库，插入缓存
            userList.add(user);
            userMapper.save(user);
        }
    }
    /**
     * 查询所有用户，
     * @return 返回所有用户集合 List<User>
     */
    @Override
    public List<User> findAll() {
        if(flag){
            //第一次查询，查询数据库
            userList.addAll(userMapper.findAll());
            flag=false;
        }
        return  userList;
    }
}

5.6UserApplication


@SpringBootApplication
@MapperScan(basePackages = "com.example.mapper")
public class UserApplication {
    public static void main(String[] args) {
        SpringApplication.run(UserApplication.class,args);
    }
}

5.7Mapper

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE mapper
        PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
        "https://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="com.example.mapper.UserMapper">


    <select id="findAll" resultType="com.example.pojo.User">
        select * from user
    </select>

    <insert id="save" useGeneratedKeys="true" keyProperty="id">
        insert into user(name,password,email)
        values(#{name},#{password},#{email})
    </insert>

</mapper>

6、打包

maven -clean-package 得到项目名.jar

7、部署及后续

7.1 部署下载 xshell 上传 jar 到任意文件

7.2 设置防火墙

sudo apt-get update

sudo apt-get install iptables

sudo iptables -A INPUT -p tcp –dport 80 -j ACCEPT

访问 ip / list.html 进行数据查询

7.3 配置 jvm

步骤：

打开 JVM 配置文件：打开用于配置 JVM 参数的配置文件，通常是 jvm.options 或 jvm.config 等。

配置垃圾回收参数：在配置文件中添加以下参数来配置年老代的并发收集和导出 GC 日志：
1
2
3
4
5
6
propertiesCopy code-XX:+UseConcMarkSweepGC  // 启用并发标记-清除收集器
-XX:+UseCMSInitiatingOccupancyOnly  // 仅在初始化占用达到阈值时触发CMS
-XX:CMSInitiatingOccupancyFraction=70  // 年老代占用阈值（百分比），触发CMS
-XX:+PrintGCDetails  // 输出GC详细信息
-XX:+PrintGCDateStamps  // 输出GC时间戳
-Xloggc:/path/to/gc.log  // 指定GC日志输出路径
替换 /path/to/gc.log 为您希望存储 GC 日志的实际路径。

重启应用服务器：重启应用服务器以应用新的 JVM 配置。

说明：

-XX:+UseConcMarkSweepGC 启用了并发标记 - 清除收集器（Concurrent Mark Sweep，CMS）。这个收集器在年老代上并发执行垃圾回收，以减少停顿时间。

-XX:+UseCMSInitiatingOccupancyOnly 表示仅在初始化占用达到阈值时触发 CMS 垃圾回收。

-XX:CMSInitiatingOccupancyFraction=70 设置了年老代的占用阈值为 70%，达到该阈值时触发 CMS 垃圾回收。

-XX:+PrintGCDetails 和 -XX:+PrintGCDateStamps 用于输出 GC 详细信息和时间戳，便于分析 GC 活动。

-Xloggc:/path/to/gc.log 指定了 GC 日志的输出路径，将 GC 信息记录到指定路径的日志文件中。

确保您替换实际的日志路径 /path/to/gc.log，并根据您的具体需求调整参数。

jvm.option 文件是一些程序运行依赖 java 环境，对这个 java 环境进行设置参数的配置文件，比如 es 依赖 java 环境，这里也就有个 jvm 文件，一些参数需要了解。
注意事项：

jvm.option 文件属高级配置，若需要自定义设置 JVM 选项，可以通过添加自定义选项文件或设置 ES_JAVA_OPTS 环境变量来重写默认 JVM 选项。不要直接修改 jvm.option 文件本身。
自定义 JVM 选项文件必须具有后缀 options，并包含一个行分隔的 JVM 参数列表。JVM 按字典顺序处理选项文件。
JVM 选项文件的放置位置取决于安装类型：
tar.gz 或 zip 安装：将自定义 JVM 选项文件添加到 config/ivm.optionsd/ 目录下。
Debian 或 RPM 安装：将自定义 JVM 选项文件添加到 /etc/elasticsearch/ivm.options.d/ 目录下。
Docker 安装：将挂载自定义 JVM 选项文件绑定到 /usr/share/elasticsearch/config/ivmoptionsd/ 目录下。