作者Gitee地址 https://gitee.com/thciweicloud
作者项目 面包博客，一个微服务架构的前后端分离博客系统。

CI/CD目前有Gitee go、Gitlab私库+jekins、K8s、GithubAction等主流方案，鉴于是面包博客是个人项目且前三个需要的服务器资源比较多或付费的问题，还是选择了GithubAction(毕竟免费的2核7G资源)

我的笔记

流程

整体流程是Git将代码上传到Github仓库，由于编写了workflow文件，Action会自动感知，通过在服务器中执行工作流指令，读取项目中的dockerfile文件对每个项目模块进行打包、打包成镜像，最后推送到DockerHub。使用DockerCompose对容器进行编排，拉取镜像最后部署到个人服务器上，由portainer进行监控。

这里使用面包博客作为演示

前后端打包

后端打包

先使用idea将java代码打jar包

编写Dockerfile，放在resource中，由于javaJDK通常比较庞大，为了节省空间，使用java:alpine这个简化版JDK镜像，同时设置占用内存大小(多个容器对资源消耗是比较大的)

FROM java:alpine
VOLUME /tmp
ADD loafblog-blog-0.0.1-SNAPSHOT.jar app.jar
ENTRYPOINT ["java","-Xms100m","-Xmx100m","-jar","/app.jar"]

前端打包

npm run build将vue项目打包，注意像renren-fast这类gulp自动打包，使用gulp build

编写Dockerfile文件，放置于根目录下，在dev环境中，我们常常会被跨域的问题所困扰(dev的跨域并不是真正意义上的跨域)，生产环境我们通过nginx作为转发代理就能解决这一问题

FROM nginx
ADD ./dist /usr/share/nginx/html/
RUN rm /etc/nginx/conf.d/default.conf
ADD default.conf /etc/nginx/conf.d/
CMD ["nginx", "-g", "daemon off;"]

nginx配置文件，每个nginx配置文件不同，将监听端口改为你服务的端口

server {
    listen       8001;
    server_name  localhost;

    #charset koi8-r;
    #access_log  /var/log/nginx/log/host.access.log  main;

    location / {
        root   /usr/share/nginx/html;
        index  index.html index.htm;
    }

    #error_page  404              /404.html;

    # redirect server error pages to the static page /50x.html
    #
    error_page   500 502 503 504  /50x.html;
    location = /50x.html {
        root   /usr/share/nginx/html;
    }

    # proxy the PHP scripts to Apache listening on 127.0.0.1:80
    #
    #location ~ \.php$ {
    #    proxy_pass   http://127.0.0.1;
    #}

    # pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000
    #
    #location ~ \.php$ {
    #    root           html;
    #    fastcgi_pass   127.0.0.1:9000;
    #    fastcgi_index  index.php;
    #    fastcgi_param  SCRIPT_FILENAME  /scripts$fastcgi_script_name;
    #    include        fastcgi_params;
    #}

    # deny access to .htaccess files, if Apache's document root
    # concurs with nginx's one
    #
    #location ~ /\.ht {
    #    deny  all;
    #}
}

GithubAction

GithubAction是一种工作流，在CI/CD中你可以看作流水线，根据jobs的顺序执行指令，最后实现项目的打包、部署等等

由于我们的工作流文件是所有人可见的，在一些填写密码的部分是不安全的（比如登录DockerHub），我们可以使用Github的secrets功能，在settings中创建一个环境存放我们的账号密码

  - name: Login to DockerHub
    uses: docker/login-action@v1
    with:
      username: ${{ secrets.DOCKERHUB_USERNAME }}
      password: ${{ secrets.DOCKERHUB_TOKEN }}

指定环境

jobs:

  build:
    runs-on: ubuntu-latest
    environment: loafblog

完整workflow代码见最后样例

容器编排

在个人服务器中创建一个文件夹，举个例子

--/opt
  --loaf
    --docker-image.yml

在loaf文件夹中使用 docker-compose up来根据yml内容拉取镜像编排

version: "3.0"

services: 
  loafblog-gateway:
    image: thciwei/loafblog-gateway #这里是dockerhub中镜像名称
    ports:
      - "88:88" #设置端口
    networks:
      - loaf
  loafblog-blog:
    image: thciwei/loafblog-blog
    ports:
      - "7000:7000"
    networks:
      - loaf
  loafblog_vue_web:
    image: thciwei/loafblog_vue_web
    ports:
      - "8888:8888"
    networks:
      - loaf #将服务设置为同一个网络环境

networks: #定义一个网桥
  loaf:

样例

GithubAction workflow.yml

name: Master-Docker-Images

on:
  push:
    branches: master

jobs:

  build:
    runs-on: ubuntu-latest
    environment: loafblog
    steps:
      - uses: actions/checkout@v2

      - uses: actions/setup-java@v1
        with:
          java-version: 1.8

      - uses: actions/setup-node@v2
        with:
          node-version: '14'

      - uses: docker/setup-buildx-action@v1

      - name: Maven Install
        run: |
          echo '======= 开始mvn clean ======='
          mvn clean

          echo '======= 开始mvn install&&package ======='
          mvn install -DskipTests=true &&  mvn package -DskipTests=true

      - name: Build vue web
        run: |
               echo '======= 开始构建前端镜像 ======='
               echo '======= 开始构建loafblog_vue ======='

               cd ./loafblog_vue

               npm install
               gulp build
               echo '== 防止index页面无效 =='
               npm install -g http-server
               docker build -t thciwei/loafblog_vue .
               cd ..

               echo '======= 开始构建loafblog_vue_web ======='
               cd ./loafblog_vue_web
               npm install
               npm run build
               docker build -t  thciwei/loafblog_vue_web .
               cd ..

      - name: Build Server Images
        run: |
          echo '======= 开始构建后端镜像 ======='
          echo '======= 开始构建loafblog-auth-server ======='
          cd loafblog-auth-server
          mvn docker:build
          cd ..

          echo '======= 开始构建loafblog-blog ======='
          cd loafblog-blog
          mvn docker:build
          cd ..

          echo '======= 开始构建loafblog-gateway ======='
          cd loafblog-gateway
          mvn docker:build
          cd ..

          echo '======= 开始构建loafblog-mail ======='
          cd loafblog-mail
          mvn docker:build
          cd ..

          echo '======= 开始构建loafblog-picture ======='
          cd loafblog-picture
          mvn docker:build
          cd ..

          echo '======= 开始构建loafblog-search ======='
          cd loafblog-search
          mvn docker:build
          cd ..

          echo '======= 开始构建renren-fast ======='
          cd renren-fast
          mvn docker:build
          cd ..


      - name: Login to DockerHub
        uses: docker/login-action@v1
        with:
          username: ${{ secrets.DOCKERHUB_USERNAME }}
          password: ${{ secrets.DOCKERHUB_TOKEN }}



      - name: push Images to DockerHub
        run: |
          docker images
          echo '======= 开始上传镜像 ======='
          echo '======= 开始上传loafblog_vue_web ======='
          docker push thciwei/loafblog_vue_web

          echo '======= 开始上传loafblog_vue ======='
          docker push thciwei/loafblog_vue

          echo '======= 开始上传loafblog-auth-server ======='

          docker push thciwei/loafblog-auth-server

          echo '======= 开始上传loafblog-blog ======='
          docker push thciwei/loafblog-blog

          echo '======= 开始上传loafblog-gateway ======='
          docker push thciwei/loafblog-gateway

          echo '======= 开始上传loafblog-mail ======='
          docker push thciwei/loafblog-mail

          echo '======= 开始上传loafblog-picture ======='
          docker push thciwei/loafblog-picture

          echo '======= 开始上传loafblog-search ======='
          docker push thciwei/loafblog-search

          echo '======= 开始上传renren-fast ======='
          docker push thciwei/renren-fast

          echo '=====镜像上传结束====='
# java # 微服务 # docker
Logo
K8S/Kubernetes

K8S/Kubernetes社区为您提供最前沿的新闻资讯和知识内容

更多推荐

【深度】阿里巴巴万级规模 K8s 集群全局高可用体系之美

作者 |  韩堂、柘远、沉醉来源 | 阿里巴巴云原生公众号​前言台湾作家林清玄在接受记者采访的时候，如此评价自己 30 多年写作生涯：“第一个十年我才华横溢，‘贼光闪现’，令周边黯然失色；第二个十年，我终于‘宝光现形’，不再去抢风头，反而与身边的美丽相得益彰；进入第三个十年，繁华落尽见真醇，我进入了‘醇光初现’的阶段，真正体味到了境界之美”。​长夜有穷，真水无香。领略过了 K8s“身在江

avatar K8S/Kubernetes

如何基于 K8s 构建下一代 DevOps 平台？

作者 | 孙健波（天元）导读：当前云原生 DevOps 体系现状如何？面临哪些挑战？如何通过 OAM 解决云原生 DevOps 场景下的诸多问题？云原生开发应用模型 OAM(Open Application Model) 社区核心成员孙健波将为大家一一解答，并分享如何基于 OAM 和 Kubernetes 打造无限能力的下一代 DevOps 平台。什么是 DevOps？为什么基于 Kub

avatar K8S/Kubernetes

k8s 火了！

2020，上云之年，产品云端化成为一种趋势。在一线城市，很多公司都已经构建了自己的私有云环境，比如阿里云、网易云、华为云等。而Kubernetes 作为基于容器编排领域的王者，具备扩展...

avatar K8S/Kubernetes