阿里聚石塔部署前后端分离项目

1. 阿里聚石塔控制台

    登录聚石塔账号，进入 控制台>开发运维>服务列表，在服务列表可以查看已创建部署的服务；聚石塔提供一整套完整的运维部署解决方案，列表服务支持停止开启服务，上传部署，编译部署，支持历史版本部署，监控，SSH等。

    这里是前后端分离项目，Vue.js 前端项目 + SpringBoot 后端项目，后端项目Maven 管理打 WAR 包，前端项目 Yarn 管理。

2. 后端项目打包部署

2.1 mvn package 打 war 包

2.2 创建服务 Tomcat

选择镜像-服务配置-环境变量-确认创建

• 选择镜像

    此处 SpringBoot 项目打 WAR 包部署在 Tomcat，根据实际项目选择版本，此处选择 Tomcat8.5.38

• 服务配置

    自定义服务标题名称；
    绑定已创建应用及 appKey；
    选择容器规格，支持自定义规格；
    选择要部署在的云服务器，服务器实际部署容器数量设置为 1 个；

• 环境配置

    网络配置设置服务访问域名；这里仅配置了域名，后端项目提供域名，前端项目配置访问后端项目接口的域名为该域名后打包

• 确认创建

    勾选立即启动，创建服务完成

2.3 上传部署

    创建服务后，在服务列表可以找到该服务；当服务较多时可以创建分组标签，对服务进行编辑分组。
    找到服务，选择上传部署；
    选择本地上传部署，逐个容器部署，可以添加备注，点击上传程序包，增加文件，选择打好的 war 包，等待上传进度为 100% 即可，容器会自动重启。
    有时候点击增加文件后，进度条很长时间不会变动，文件添加到上传队列，队列也没权限查看，也不确定是不是阻塞，我也是看不懂，难顶。

    一般的，项目 war 包没问题的话到此，后端项目部署完成。容器启动后运行中服务有异常，应该是war 包有问题或者容器环境和 war 包要求环境不匹配。你可以在服务列表点击容器管理，在操作项选择 WebSSH 进入 SSH 查看 /acs/log 下的日志排查问题。

    服务启动后，通过配置的服务域名可以访问后端项目的接口，接口访问能有响应部署就完成了。

3. 前端项目打包部署

3.1 yarn build 打包

    前端项目配置好正式环境后端项目的域名，通过build 命令打资源包

3.2 创建服务 Nginx

选择镜像-服务配置-环境变量-确认创建

• 选择镜像

    选择其他>Nginx 1.14.2
    服务版本根据实际项目自主选择。

• 服务配置

    自定义服务标题名称；
    绑定已创建应用及 appKey；
    选择容器规格，支持自定义规格；
    选择要部署在的云服务器，服务器实际部署容器数量设置为 1 个；

• 环境变量

    网络配置支持选择通信协议，自定义域名等
    环境配置支持配置默认 nginx.conf 文件，因此处前端打包文件为dist文件夹，此处我配置资源根路径地址为 /acs/dist

        location / {
            root   /acs/code;
            index  index.html index.htm;
        }

为

        location / {
            root   /acs/dist;
            index  index.html index.htm;
        }

    其他无改动。

• 确认创建

    确认基础信息后，可以勾选立即启动服务，点击创建完成服务创建。

3.3 上传资源包

    前端项目为静态文件资源，打包资源放到 nginx 服务映射对应路径下即可。
    进入 WebSSH ，将 /acs/upload 下的 dist.zip 移动到/acs 解压后，根据 Nginx 服务配置地址 /acs/dist 无误，重启服务即可。

    服务启动后访问配置的域名，能访问到 /acs/dist/index.html 资源，部署就完成了。

4. 访问项目

    服务启动后访问前端项目(前端项目外网域名)即可。

Power By niaonao, The End, Thanks