项目的部署

利用linux和docker部署项目。Linux部署，使用的部署平台为我购买的阿里云服务器，2核2g，其操作系统为Ubuntu 24.04LTS。docker部署，使用官方教程提供的CentOS7镜像，在虚拟机上进行。

linux的部署

第一步 环境配置

首先，在Linux服务器配置jdk和MySQL环境：

# 安装jdk，这里我使用的是Java17
apt install openjdk-17-jre

# 安装MySQL

sudo apt install mysql-server

第二步 前端和后端的打包

在前端项目目录进入控制台，运行npm脚本：

npm run build

之后在对应目录下找到dist文件夹，这就是我们打包好的前端文件。

后端使用maven进行打包。在idea里双击package即可打包生成jar：

准备好前端文件和后端jar包，就可以在Linux上进行部署了。

第三步 前端项目的部署

我们部署前端项目。需要先安装配置好nginx，然后再把打包好的前端文件上传到对应的文件目录下，这样我们的前端才可以顺利运行：我们的前端将会由nginx托管。nginx是一款强大的HTTP和反向代理服务器。能够帮我们处理http请求（这里我们是使用http访问来进行部署的测试。使用https的话需要更加麻烦的配置，要申请ssl证书）。我们先安装nginx：

sudo apt update
sudo apt install nginx -y

我们此时可以尝试访问服务器公网ip（我这里默认80端口）。如果出现nginx欢迎页面则成功了。需要注意：如果原来服务器有东西占着80端口，最好把它暂时关掉，防止引起冲突。我们处理此种问题，可以先把原有的服务关掉然后再调nginx。或者是写一个脚本，使得安装好nginx后它不会自动启动，然后我们调整它监听的端口之后再让它启动。

如果你使用的是云服务器，记得把你要访问的端口加入安全组。

然后进行相关文件配置。我们首先建好一个目录上传我们打包好的前端文件：

这里我把前端文件放在了tlias目录下。然后进行nginx的配置。这个是/etc/nginx/sites-available/default。我在80端口有搭建一个博客。所以调整了配置文件。

server {
    # 监听 81 端口，不与 80 端口的 Halo 博客冲突
    listen 81 default_server;
    listen [::]:81 default_server;

    server_name localhost;

    # 1. 前端静态资源配置
    location / {
        # 注意：这里指向文件夹路径，确保 index.html 就在此目录下
        root   /tlias; 
        index  index.html index.htm;

        # 解决 Vue 路由刷新 404 的关键配置
        try_files $uri $uri/ /index.html;
    }

    # 2. 后端 API 代理配置
    # 匹配前端发出的 /api 开头的请求
    location /api/ {
        # 转发到 Spring Boot 后端。末尾的 / 实现了路径重写，去掉 /api。要和开发环境中vite文件的配置相对应。
        proxy_pass http://127.0.0.1:8080/;  

        # 保证后端能获取到客户端的真实 IP
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;

        # 解决可能出现的跨域及长连接问题
        proxy_http_version 1.1;
        proxy_set_header Connection "";
    }

    # 错误页面处理
    error_page   500 502 503 504  /50x.html;
    location = /50x.html {
        root   /usr/share/nginx/html;
    }
}

同时要注意权限问题。

# 1. 递归修改文件夹所有者为 nginx 用户
sudo chown -R nginx:nginx /tlias

# 2. 修改目录权限：文件夹需要 755（可进入），文件需要 644（可读取）
sudo find /tlias -type d -exec chmod 755 {} \;
sudo find /tlias -type f -exec chmod 644 {} \;

这里的配置文件不少地方是我描述需求然后用Gemini生成的。nginx的配置其实还是比较复杂。需要知道：监听哪个端口，请求要转发到哪个端口，同时还需要配置页面跳转问题。

配置文件修改完成后，输入 systemctl restart nginx，访问对应端口。如果见到了前端页面，则说明我们成功了。

第四步 后端项目的部署

这个相比前端简单的多。首先导入数据库信息，然后把jar包放到服务器某个地方，命令行启动就可以了。需要注意的是：如果使用云服务器的话，可以使用3306端口远程连接用datagrip等图形化工具导入。但是一定一定要注意：3306端口一定要设定为只有本机ip才可以访问。否则极其容易受到攻击！同时，配置数据库时要注意数据库的连接信息和后端项目的yml配置信息一定要对的上。

# 进入相关目录
# cd /root/tlias-backend

# 启动后端项目
java -jar tlias-web-management-0.0.1-SNAPSHOT.jar

第五步 前后端联调测试

后端启动之后，运行前端进行各种测试吧。到这一步就说明我们成功了。注意，使用图片上传的有关功能要设置阿里云OSS相关配对密钥：

# 注意，这里的密钥信息要换成自己的
echo "export OSS_ACCESS_KEY_ID=密钥信息" >> /etc/profile

echo "export OSS_ACCESS_KEY_SECRET=密钥信息" >> /etc/profile

source /etc/profile

docker的部署

第一步 mysql环境准备

准备好环境。按照黑马官方步骤操作，配置linux环境。安装VMware并挂载提供的CentOS7镜像。

19-项目部署(Linux) - 飞书云文档

ens33这个网卡的ip地址，就是我们用来访问虚拟机用的地址了。注意按照教程配置好相关IP地址。

挂载好镜像并启动成功以后，我们就安装finalshell进行远程连接，对我们的虚拟机进行操作。

使用ssh连接到虚拟机，注意输入配置好的ip和密码。

连接成功后，它已经安装好了docker了。我们直接使用docker拉取mysql，创建一个docker容器来跑mysql。

# 注意配置镜像源。如果没有配置镜像源或者配置失败的话可以运行：
# 创建目录
rm -f /etc/docker/daemon.json

# 复制内容
tee /etc/docker/daemon.json <<-'EOF'
{
    "registry-mirrors": [
        "http://hub-mirror.c.163.com",
        "https://mirrors.tuna.tsinghua.edu.cn",
        "http://mirrors.sohu.com",
        "https://ustc-edu-cn.mirror.aliyuncs.com",
        "https://ccr.ccs.tencentyun.com",
        "https://docker.m.daocloud.io",
        "https://docker.awsl9527.cn"
    ]
}
EOF

# 重新加载配置
systemctl daemon-reload

# 重启Docker
systemctl restart docker

# 拉取mysql镜像并创建一个容器运行它
docker run -d \
  --name mysql \
  -p 3307:3306 \
  -e TZ=Asia/Shanghai \
  -e MYSQL_ROOT_PASSWORD=123 \
  mysql:8

执行完没报错的话，输入docker ps 命令，观察，可以找到名为mysql的容器在跑了。

我们接下来使用datagrip这样的数据库连接工具远程连接到这个mysql，注意密码和端口号：

导入提前准备好的数据库脚本：

这样我们就准备好了数据库运行的环境。

第二步 部署后端

在idea中，修改相关配置文件，调整数据库连接设置和日志输出：

然后再在maven中跳过测试，打包生成.jar文件。修改该文件的文件名称为tlias.jar。

之后将该文件，jdk的压缩文件，上传到/root/tlias目录下并配置Dockerfile:

# 使用 CentOS 7 作为基础镜像
FROM centos:7

# 添加 JDK 到镜像中
COPY jdk17.tar.gz /usr/local/
RUN tar -xzf /usr/local/jdk17.tar.gz -C /usr/local/ &&  rm /usr/local/jdk17.tar.gz

# 设置环境变量
ENV JAVA_HOME=/usr/local/jdk-17.0.10
ENV PATH=$JAVA_HOME/bin:$PATH

# 阿里云OSS环境变量
ENV OSS_ACCESS_KEY_ID=OSS设置的id
ENV OSS_ACCESS_KEY_SECRET=OSS设置的secret

#统一编码
ENV LANG=en_US.UTF-8
ENV LANGUAGE=en_US:en
ENV LC_ALL=en_US.UTF-8

# 创建应用目录
RUN mkdir -p /tlias
WORKDIR /tlias

# 复制应用 JAR 文件到容器
COPY  tlias.jar  tlias.jar

# 暴露端口
EXPOSE 8080

# 运行命令
ENTRYPOINT ["java","-jar","/tlias/tlias.jar"]

之后构建镜像，部署docker容器，进行测试

# 构建镜像
docker build -t tlias:1.0 .

# 部署docker容器，注意，这里的itheima网络需要自己创建。后面还需要把mysql容器也加入这个网络。这个要在之前创建好的tlias应用目录下运行
docker run -d --name tlias-server --network itheima -p 8080:8080  tlias:1.0

# 把mysql加入网络
docker network connect itheima mysql

然后我们输入docker logs -f 容器名 就可以观察到运行日志的输出：

说明我们docker部署的后端跑通了。

第三步 部署前端

首先，在 /usr/local 目录下创建 tlias-web 目录，存放打包好的前端文件以及nginx配置文件。

html文件目录下，就是我们的打包好的前端文件。conf下面是nginx.conf。nginx的配置文件：

#user  nobody;
worker_processes  1;

events {
    worker_connections  1024;
}

http {
    include       mime.types;
    default_type  application/octet-stream;

    sendfile        on;
    keepalive_timeout  65;

    server {
        listen       80;
        server_name  localhost;
        client_max_body_size 10m;
        
        location / {
            root   /usr/share/nginx/html;
            index  index.html index.htm;
            try_files $uri $uri/ /index.html;
        }

        location ^~ /api/ {
			rewrite ^/api/(.*)$ /$1 break;
			proxy_pass http://tlias-server:8080;
        }
    }

}

注意后端接口反向代理部分(Location ^~ /api/)。它负责把前端的请求转发给后端容器。

逻辑分解：

匹配路径：^~ /api/ 表示只要请求是以 /api/ 开头的（例如 http://192.168.../api/login），就进入这个规则。

路径重写 (rewrite)：

前端请求：/api/login

重写后：/login

为什么要重写？ 因为前端通常为了区分接口会加个 /api 前缀，但你的后端 Spring Boot 代码里 RequestMapping 通常是不带 /api 的。break 表示重写完成后停止匹配其他规则。

转发请求 (proxy_pass)：

它将处理后的请求转发到 http://tlias-server:8080。

注意：这里的 tlias-server 必须是你后端容器的名字。根据你之前的操作，如果后端容器名是 tlias-backend，这里需要修改一致！

之后执行命令，启动nginx运行。

docker run -d \
--name nginx-tlias \
-v /usr/local/tlias-web/html:/usr/share/nginx/html \
-v /usr/local/tlias-web/conf/nginx.conf:/etc/nginx/nginx.conf \
--network itheima \
-p 80:80 \
nginx:1.20.2

第四步 联调测试

用虚拟机ip地址访问前端，运行各种功能观察部署是否成功：

总结

通过linux和docker部署，我进一步掌握了把项目部署落地的工程能力，尤其是对配置环境以及整个系统各个功能的运行有了更深的了解。我甚至接触到了部分linux运维知识。在部署期间，甚至有人通过我在疏忽之间没有关闭的3306端口号发起进攻，一度使得服务器cpu占用率99%，引起崩溃重启，这更强迫我发展了排查定时任务，排查端口情况的能力。通过docker部署，我了解了docker部署和管理项目比纯linux裸机部署要方便和安全很多。因为docker是用一个个容器管理项目，比如我这个tlias项目的mysql，前端，后端都是跑在一个个docker之中的。这使得我的项目具有隔离性：减少不同项目组件的相互影响。黑客攻击不能影响整个服务器，我还可以设置最大占用cpu为多少百分比，调节性能。