【项目部署】在亚马逊云（AWS）上使用宝塔面板部署前后端分离的 Vue3 + Spring Boot 项目

1. 准备工作

AWS 账户 ：确保你已经注册了 AWS 账户，并且有足够的权限来创建 EC2 实例和配置安全组。【AWS账户注册】注册亚马逊免费云服务器一年期个人用户
项目准备 ：确保你已经准备好了前端 Vue3 项目（并且已打包生成静态文件）和后端 Spring Boot 项目（打包为 .jar 文件）。

2. 启动 AWS EC2 实例

登录 AWS 管理控制台。
创建 EC2 实例 ：
- 导航到 EC2 控制台，点击 "Launch Instance"。
- 选择适合的操作系统（建议使用 Ubuntu 20.04 或 CentOS 7）。
- 选择实例类型（如 t2.micro 对小型项目免费使用）。
- 配置存储和网络，使用默认设置即可，存储建议选择 30GB 以上。有资格使用免费套餐的客户最多可获得 30GB 的通用型 (SSD) 或磁存储空间
- 点实例ID蓝色那串，下滑在安全中，配置入站规则，点安全详细信息安全组下边的蓝色那串，编辑入站规则，添加规则的示例：点击 "Add Rule"（添加规则），然后按照以下信息设置新的入站规则：
  - Type（类型）：选择 Custom TCP（自定义 TCP）。 Protocol（协议）：默认是 TCP，保持不变。
  - Port Range（端口范围）：输入 80，这是用于 HTTP 的端口。
  - Source Type（源类型）：选择 Custom（自定义）。
  - Source（源）：输入 0.0.0.0/0，这表示允许任何 IP 地址访问该端口。如果你希望限制为特定 IP 地址访问，输入相应的 IP地址范围。
  - Description（描述）：不要用中文，可以输入 "HTTP Access" 作为可选描述，帮助你未来识别这个规则。

连接到 EC2 实例：
直接网页连接到EC2 实例
或者配置了ssh就使用 SSH 连接到你的 EC2 实例
bash 复制代码
```
ssh -i "path/to/your-key.pem" ubuntu@your-ec2-public-ip 
```
- "path/to/your-key.pem" ：指的是你保存 .pem 文件的路径。如果 .pem 文件在当前目录下，可以直接写 your-key.pem。
- ubuntu ：这是默认的用户名称，取决于你使用的操作系统和 AMI 类型。如果你使用的是 Amazon Linux AMI，则需要使用 ec2-user 用户名。
  - 如果是 Ubuntu 实例，用户名是 ubuntu。
  - 如果是 Amazon Linux 2 实例，用户名是 ec2-user。
- your-ec2-public-ip：这是你的 EC2 实例的公共 IP 地址（或公共 DNS），你需要替换为你在 AWS 控制台中找到的实际 IP 地址。
- 例如：
  ssh -i "~/Downloads/my-key.pem" ubuntu@3.123.456.789

3. 安装宝塔面板

安装宝塔面板：
- 使用 SSH 连接到 EC2 实例后，执行以下命令安装宝塔面板：
  - Ubuntu 系统 ：
    bash 复制代码
```
 wget -O install.sh https://download.bt.cn/install/install_lts.sh && sudo bash install.sh ed8484bec
```
安装完成后，终端会显示宝塔的管理地址和登录信息账号密码，创建一个txt保存一下。使用这些信息通过浏览器访问宝塔面板。会提示，请在安全组放行。。端口，入站规则放行一下。
复制外网面板地址到Chrome，登录宝塔面板，会提示不安全继续前往就好了，账号密码就用安装好时给的登录信息，阅读同意用户信息协议，绑定官网帐号，这里自行注册。

4. 配置宝塔环境

安装必要的软件环境 ：
- 进入宝塔面板，点击 "软件商店"。
- 安装以下软件：
  - Nginx
  - Redis
  - MySQL
  - Java项目一键部署：安完点进去容器管理那安装一下tomcat
  bash 复制代码
```
sudo apt update
sudo apt install openjdk-11-jdk
```
数据库导入：数据库，添加数据库，上传sql文件，上传成功后记得导入覆盖，导入成功后就可以点工具看到导入的各个表。

5. 部署前端 Vue3 项目

准备 Vue3 项目：
- 在本地开发环境中，确保已经构建了 Vue3 项目，使用以下命令生成打包后的静态文件：
  bash 复制代码
```
npm run build
```
- 打包完成后，文件一般会生成在 dist 文件夹中。
上传 Vue3 静态文件到服务器：
- 将打包好的 dist 文件夹上传到服务器上的网站目录中。
- 在宝塔面板中，点击左侧的 "网站" -> "添加站点" -> 填写域名或 IP 地址，创建网站。
- 将 Vue3 的 dist 文件夹上传到该网站的根目录 /www/wwwroot/your-site/。
配置 Nginx 托管静态文件：
- 到这个文件夹/www/server/panel/vhost/nginx 上传.conf 文件

nginx 复制代码

server {
    listen 8010;  # Nginx 用于前端监听的端口
    server_name 43.03.0.3;  # 将此改为你的宝塔服务器 IP

    charset utf-8;

    # 前端静态资源
    location / { 
        alias /www/wwwroot/easypan/admin-front/dist/;
        try_files $uri $uri/ /index.html;
        index index.html index.htm;
    }

    # 代理后端 API 请求
    location /api { 
        proxy_pass http://localhost:9091/api;
        proxy_set_header x-forwarded-for  $remote_addr;
    }
}

AWS再加一个入站规则放行8010端口，宝塔安全也放行8010
重启nginx

bash 复制代码

sudo su
cd /www/server/nginx/sbin
./nginx -s reload

访问43.23.70.3:8010就可以看到前端页面了。

6. 部署后端 Spring Boot 项目

打包 Spring Boot 项目：
- 在本地开发环境中，使用 Maven 或 Gradle 将 Spring Boot 项目打包为 .jar 文件：
  bash 复制代码
```
mvn clean package
```
- 生成的 .jar 文件通常在 target 文件夹中。
上传后端项目到服务器：
- 将打包好的 .jar 文件上传到服务器的某个目录下，例如 /www/wwwroot/your-site/java/。
- 上传配置文件application.properties，改一下里面的项目地址之类的。
启动 Spring Boot 应用：
- 终端进入 .jar 文件所在目录，使用以下命令启动应用：
  bash 复制代码
```
sudo su
nohup java -jar easybbs-web-release-1.0.jar --server.port=9091 > /dev/null 2>&1 &
```
- 该命令会在后台运行 Spring Boot 项目，日志输出到 backend.log 文件。
再次打开网站就可以看到验证码正确显示出来了，顺利登陆