阿里云云效 流水线发布spring cloud项目及Vue项目

本文介绍了如何使用流水线进行Springboot项目的主机部署,包括选择模板创建流水线,添加代码仓库,Java构建并上传jar包,以及配置主机和部署脚本。对于Vue项目,创建Node.js流水线,构建并打包Vue的dist目录,然后将其部署到nginx服务器。整个过程详细讲解了每个步骤的关键操作。
摘要由CSDN通过智能技术生成

1. 单体spring boot 项目流水线主机部署

1.1 创建流水线

页面地址

我们选择模板,当然也可以自己新建一个

image-20230630101427198

1.2 添加流水线源

这里是根据自己的代码仓库决定的,我用的gitee,需要添加服务连接

image-20230630102937038

添加服务连接

image-20230630103216568

新建服务授权/证书 ==点击新建==自动跳转至gitee认证页面,同意授权即可

image-20230630103431611

授权过后自动返回并选择证书

image-20230630103522461

选择需要部署的代码仓库及分支,之后点击创建即可

  • 工作目录是流水线执行的目录不用管,或者需要自定义也可以

image-20230630104051274

1.3 Java构建并上传

首先我们本地打包后的目录,我们需要打包两个文件

  • gateway/target/gateway-0.0.1-SNAPSHOT.jar -部署包
  • gateway/deploy.sh-部署命令(具体内容在1.4中,先填写)

image-20230630105017681

将路径填写到打包路径上,需要上传几个就填几个,数量太多也可以直接上传目录

如:我只填写gateway/那么gateway目录下的所以文件都会被打包上传

image-20230630105819286

1.4 主机部署

1.4.1 添加新主机

因为我的主机是谷歌云的,我选择的是自有主机,如果是阿里云的主机选择阿里云ECS即可

image-20230630111155513

将命令在需要添加的主机上执行

image-20230630111430026

添加完成后,在此处就可以选择自己的主机了

image-20230630111510199

1.4.2 配置下载路径及执行用户

这里选默认就行

  • 下载路径就是我们在java构建上传后打好的包下载到我们部署主机的什么位置

image-20230630111634832

1.4.3 配置部署脚本

1.4.3.1 官方脚本部署

deploy.sh脚本-这是官方的示例启动脚本,但是我没有使用

  • APP_NAME:配置为我们的服务名称
  • APP_PORT:配置为我们的服务启动端口
  • JAR_NAME:打包后jar包的位置+名字
  • JAR_NAME:启动日志输出位置
  • HEALTH_CHECK_URL:健康检查URL
    • start()方法时需要健康检查(我没有就注释了)

如果需要使用官方示例启动脚本可以参照官方文档

#!/bin/bash

# 修改APP_NAME为云效上的应用名
APP_NAME=application


PROG_NAME=$0
ACTION=$1
APP_START_TIMEOUT=20    # 等待应用启动的时间
APP_PORT=8080          # 应用端口
HEALTH_CHECK_URL=http://127.0.0.1:${APP_PORT}  # 应用健康检查URL
APP_HOME=/home/admin/${APP_NAME} # 从package.tgz中解压出来的jar包放到这个目录下
JAR_NAME=${APP_HOME}/target/${APP_NAME}.jar # jar包的名字
JAVA_OUT=${APP_HOME}/logs/start.log  #应用的启动日志

# 创建出相关目录
mkdir -p ${APP_HOME}
mkdir -p ${APP_HOME}/logs
usage() {
    echo "Usage: $PROG_NAME {start|stop|restart}"
    exit 2
}

health_check() {
    exptime=0
    echo "checking ${HEALTH_CHECK_URL}"
    while true
        do
            status_code=`/usr/bin/curl -L -o /dev/null --connect-timeout 5 -s -w %{http_code}  ${HEALTH_CHECK_URL}`
            if [ "$?" != "0" ]; then
               echo -n -e "\rapplication not started"
            else
                echo "code is $status_code"
                if [ "$status_code" == "200" ];then
                    break
                fi
            fi
            sleep 1
            ((exptime++))

            echo -e "\rWait app to pass health check: $exptime..."

            if [ $exptime -gt ${APP_START_TIMEOUT} ]; then
                echo 'app start failed'
               exit 1
            fi
        done
    echo "check ${HEALTH_CHECK_URL} success"
}
start_application() {
    echo "starting java process"
    nohup java -jar ${JAR_NAME} > ${JAVA_OUT} 2>&1 &
    echo "started java process"
}

stop_application() {
   checkjavapid=`ps -ef | grep java | grep ${APP_NAME} | grep -v grep |grep -v 'deploy.sh'| awk '{print$2}'`
   
   if [[ ! $checkjavapid ]];then
      echo -e "\rno java process"
      return
   fi

   echo "stop java process"
   times=60
   for e in $(seq 60)
   do
        sleep 1
        COSTTIME=$(($times - $e ))
        checkjavapid=`ps -ef | grep java | grep ${APP_NAME} | grep -v grep |grep -v 'deploy.sh'| awk '{print$2}'`
        if [[ $checkjavapid ]];then
            kill -9 $checkjavapid
            echo -e  "\r        -- stopping java lasts `expr $COSTTIME` seconds."
        else
            echo -e "\rjava process has exited"
            break;
        fi
   done
   echo ""
}
start() {
    start_application
    #health_check
}
stop() {
    stop_application
}
case "$ACTION" in
    start)
        start
    ;;
    stop)
        stop
    ;;
    restart)
        stop
        start
    ;;
    *)
        usage
    ;;
esac
1.4.3.2 自定义脚本部署(本次采用)

因为没有健康检查,所以没办法知道程序是否真正构建成功需要到/home/gatewayStartLog查看部署日志

#删除上次部署包
rm -rf /home/admin/application/gateway/
echo "删除上次部署包"

#关闭指定端口的进程-这里是8089
kill -9 `netstat -nlp | grep :8089 | awk '{print $7}' | awk -F"/" '{ print $1 }'`
wait
echo "已停止8089"
#创建一个文件夹用户存放构建包解压后的文件
mkdir -p /home/admin/application
wait
echo "创建目录/home/admin/application"
#解压构建包
tar zxvf /home/admin/app/package.tgz -C /home/admin/application/
wait
echo "解压至/home/admin/application/"
#后台启动并打印启动日志
nohup java -jar /home/admin/application/gateway/target/gateway-0.0.1-SNAPSHOT.jar > /home/gatewayStartLog 2>&1 &
echo "部署成功"
#删除构建包,下次上传的构建包不会覆盖,所以必须删除
rm -rf /home/admin/app/package.tgz
echo "删除本次构建包"

部署日志

image-20230630171757186

2. 多个spring boot 项目流水线主机部署

2.1 多流水线部署

只需要重复章节1的操作重复部署多个服务即可

2.2 单流水线部署多个项目

此处我只示范启动两个项目gateway和admin-service,如果是多个再按照方法加就行

首先我们先复制之前的单流水线

image-20230630172223363

2.2.1 将admin-service的打包进构建包

image-20230630173036122

此时我们的构建包中就会有这两个jar包和deploy.sh

此时构建包中的内容如下

image-20230630173524538

  • gateway
    • target/gateway-0.0.1-SNAPSHOT.jar
    • deploy.sh
  • admin-service
    • target/admin-service-0.0.1-SNAPSHOT.jar
    • deploy.sh

2.2.2 修改自定义部署脚本

脚本新增内容如下

image-20230701101301859

rm -rf /home/admin/application/gateway/
rm -rf /home/admin/application/admin-service/
echo "删除上次部署包"
kill -9 `netstat -nlp | grep :8089 | awk '{print $7}' | awk -F"/" '{ print $1 }'`
kill -9 `netstat -nlp | grep :8090 | awk '{print $7}' | awk -F"/" '{ print $1 }'`
wait
echo "已停止8089"
echo "已停止8090"
mkdir -p /home/admin/application
wait
echo "创建目录/home/admin/application"
tar zxvf /home/admin/app/package.tgz -C /home/admin/application/
wait
echo "解压至/home/admin/application/"
nohup java -jar /home/admin/application/gateway/target/gateway-0.0.1-SNAPSHOT.jar > /home/gatewayStartLog 2>&1 &
echo "部署成功"

nohup java -jar /home/admin/application/admin-service/target/admin-service-0.0.1-SNAPSHOT.jar > /home/adminServiceStartLog 2>&1 &
echo "部署成功"

rm -rf /home/admin/app/package.tgz
echo "删除本次构建包"

执行成功后查看端口是否被占用

image-20230701101015679

3. Vue项目项目流水线部署

3.1 新建Node.js流水线并添加流水线源

image-20230701111013556

3.2 Node.js构建

3.2.1 构建脚本

image-20230701111915901

3.2.2 打包

部署vue我们只需要把打好包的dist目录放入nginx即可,所以我们只需要将dist目录打包上传

image-20230701111544472

3.3 主机部署

3.3.1 部署包下载路径

如果其他流水线部署在同一个服务器记得修改一下下载路径或者文件名不然有可能被覆盖,或者使用到其他项目的构建包

image-20230701112415246

3.3.2 部署脚本

主要目的就是将我们的构建包解压到nginx的配置路径

我这里修改了nginx的路径在/home/vue-project/,你只需要修改为你的就行了

rm -rf /home/vue-project/
mkdir /home/vue-project
#解压构建的dist压缩包到指定目录
tar zxvf /home/admin/vue/package.tgz -C /home/vue-project/
#删除dist压缩包
rm -rf /home/admin/vue/package.tgz
  • 3
    点赞
  • 18
    收藏
    觉得还不错? 一键收藏
  • 8
    评论
### 回答1: VueSpringCloud是两个独立的技术,分别用于前端和后端开发。在一个电商项目中,Vue通常用于构建前端界面和实现交互逻辑,而SpringCloud用于实现后端的业务逻辑和系统架构。 Vue是一个前端框架,它的特点是轻量级、灵活和易学习,非常适合开发单页面应用。Vue使用组件化的思想,将一个页面分解为多个独立的组件,每个组件负责不同的功能,从而实现页面的高复用性和可维护性。在电商项目中,可以使用Vue来实现商品列表、购物车、订单管理等功能页面。 SpringCloud是一个微服务框架,它提供了一系列的服务组件和工具,用于快速开发、部署和管理分布式系统。SpringCloud基于Spring Boot,可以轻松地与其他Spring组件集成,如Spring MVC、Spring Data等。在电商项目中,可以使用SpringCloud来实现用户管理、商品管理、订单管理等后端服务。 关于电商项目的源码,一般来说,前端和后端的源码是分开的。前端的源码主要是基于Vue进行开发,通常包含HTML、CSS、JavaScript等文件。而后端的源码主要是基于SpringCloud进行开发,通常包含Java代码、配置文件等。 前端的源码主要用于构建用户界面和实现页面交互逻辑。它通过调用后端的接口获取数据,并将数据展示给用户。用户在前端界面上的操作会触发相应的事件,前端通过调用后端的接口来处理这些事件。 后端的源码主要用于实现业务逻辑和系统架构。它通过定义接口、编写业务逻辑和调用后台数据库等方式来处理请求。这些请求可以来自前端,也可以来自其他后端服务。 总之,VueSpringCloud是电商项目中常用的技术,用于实现前端和后端的功能。电商项目的源码通常分为前端和后端两部分,前端主要基于Vue开发,后端主要基于SpringCloud开发。 ### 回答2: Vue springcloud 电商项目源码是一个基于 Vue.jsSpring Cloud 架构开发的电商项目的代码,它提供了一个完整的电商平台的功能。 Vue.js 是一个流行的前端框架,通过使用它,开发人员可以轻松地构建用户界面。Vue.js 对数据的双向绑定和组件化的开发方式,使得开发人员能够高效地开发出动态和可交互的用户界面。 Spring Cloud 是一个微服务架构的解决方案,它提供了一套完整的解决方案来构建分布式系统。通过使用 Spring Cloud,开发人员可以轻松实现服务注册与发现、负载均衡、熔断器等功能,从而简化了分布式系统的开发和部署。 这个电商项目源码结合了 Vue.jsSpring Cloud 的优点,提供了一个高可扩展性、易于维护的电商平台。它包含了用户注册、登录、商品浏览、购物车管理、订单管理、支付等常见的电商功能。开发者可以根据实际需求对其进行定制和扩展。 该项目源码还提供了一套完整的开发文档和示例,开发人员可以根据文档来了解项目的整体架构和各个模块的功能实现细节,从而快速上手并进行二次开发。 总之,Vue springcloud 电商项目源码是一个基于 Vue.jsSpring Cloud 架构开发的电商项目的代码,提供了一个完整的电商平台的功能,并附带了详细的开发文档和示例,方便开发人员进行二次开发和定制。
评论 8
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值