前端搭建CI/CD

358 阅读2分钟

用Docker-compose 安装gitlab、gitlab-runner

源码地址 如果您觉得有用请STAR

安装docker

如果有已安装旧版docker需要先卸载

 sudo yum remove docker \
                  docker-client \
                  docker-client-latest \
                  docker-common \
                  docker-latest \
                  docker-latest-logrotate \
                  docker-logrotate \
                  docker-engine

安装

yum install docker  #安装docker
systemctl start docker  #启动docker
systemctl enable docker  #开启启动

若是启动报错,需要重新安装:

启动报错,错误如下:
Failed to start docker.service: Unit docker.service not found.

错误分析:CentOS 8 中安装 docker 和 Podman 冲突

解决方式:

1.查看是否安装 Podman 
rpm -q podman

2.删除podman(输入yes,然后等待...)
dnf remove podman 

3.重装docker(分别执行如下命令)

yum install -y yum-utils  device-mapper-persistent-data  lvm2

yum-config-manager  --add-repo   https://download.docker.com/linux/centos/docker-ce.repo

yum install docker-ce docker-ce-cli containerd.io

yum install docker-ce docker-ce-cli docker-compose-plugin 

docker-compose-plugin 貌似就是docker-compose,这样也许不用单独安装python3了,也是在其他机器装docker时才发现。感兴趣的可以试试。

安装Python3(docker-compose需要python3)

wget https://www.python.org/ftp/python/3.7.0/Python-3.7.0.tgz
tar -zxvf Python-3.7.0.tgz
cd Python3.7.0 
./configure --prefix=/usr/local/python3 
make && make install

#添加环境变量
echo PATH='/usr/local/python/bin:$PATH' >> /etc/profile  # 将python安装路径追加到配置文件中
source /etc/profile  # 让配置文件重载生效

# 修改原有的python软连接名称
mv /usr/bin/python /usr/bin/python2.7.5
# 建立python3的软连接
ln -s /usr/local/python/bin/python3.7 /usr/bin/python

遇到的问题

在安装python3.xx版本后,通过yum去安装软件会出现问题

 yum install -y epel-release
  File "/usr/bin/yum", line 30
    except KeyboardInterrupt, e:
                            ^
SyntaxError: invalid syntax

解决方式:

# vi /usr/bin/yum  
将第一行"#!/usr/bin/python" 改为 "#!/usr/bin/python2"

另一个问题:

File "/usr/libexec/urlgrabber-ext-down", line 28
    except OSError, e:
                  ^
SyntaxError: invalid syntax

解决方式:

vi /usr/libexec/urlgrabber-ext-down  
将第一行"#!/usr/bin/python" 改为 "#!/usr/bin/python2"

安装Docker-compose

sudo yum install epel-release  #安装依赖
pip install --upgrade --force pip #更新一下pip,避免版本不对报错
sudo pip install docker-compose  #安装compose
docker-compose version  #查看版本信息

安装时,会有waring,说是在root用户下安装会导致包管理混乱,查了一下解决方式:通过安装Python3虚拟环境处理,解决过程中会有一系列依赖包报错。但想想安装虚拟环境,似乎就要在虚拟环境中装Docker-compose,有点不太对,于是直接忽略了警告信息,继续安装:

image.png

安装gitlab、gitlab-runner容器

在 /user/local/ 下新建目录 dockerCompse mkdir dockerCompse vim docker-compose.yml //新建文件

version: "3"
services:
    gitlab:
      image: 'gitlab/gitlab-ce:latest'
      container_name: GitLab
      restart: always
      environment:
        GITLAB_OMNIBUS_CONFIG: |
          external_url 'http://47.97.97.114:3143'
          gitlab_rails['gitlab_shell_ssh_port'] = 3122
          nginx['listen_port'] = 443
          nginx['redirect_http_to_https'] = true
          nginx['ssl_certificate'] = "/etc/ssl/certs/gitlab/server-cert.pem"
          nginx['ssl_certificate_key'] = "/etc/ssl/certs/gitlab/server-key.pem"
          registry_external_url 'http://47.97.97.114:4567'
          registry_nginx['enable'] = true
          registry_nginx['ssl_certificate'] = "/etc/ssl/certs/gitlab/server-cert.pem"
          registry_nginx['ssl_certificate_key'] = "/etc/ssl/certs/gitlab/server-key.pem"
          gitlab_rails['backup_keep_time'] = 172800
      ports:
        - '4567:4567'
        - '3143:443'
        - '3122:22'
      volumes:
        - '/srv/gitlab/config:/etc/gitlab'
        - '/srv/gitlab/logs:/var/log/gitlab'
        - '/srv/gitlab/ssl:/etc/ssl/certs/gitlab'
        - '/srv/gitlab/data:/var/opt/gitlab'
      networks:
        dev-net:
          aliases:
            - my.gitlab
    runner:
      image: 'gitlab/gitlab-runner:latest'
      container_name: gitlab-runner
      restart: always
      volumes:
        - '/srv/gitlab-runner:/etc/gitlab-runner'
        - '/var/run/docker.sock:/var/run/docker.sock'
      networks:
        - dev-net
networks:
  dev-net:
    external:
      name: development

按esc建,:wq, 启动docker

docker-compose up

如果提示没有development网络,按照提示执行命令即可。

注册runner

docker exec -it gitlab-runner gitlab-runner register
Please enter the gitlab-ci coordinator URL (e.g. https://gitlab.com/):`
http://47.97.97.114:3143/

Please enter the gitlab-ci token for this runner:
# 登录这个地址: http://47.97.97.114:3143/admin/runners 右上角下拉按钮可以查看

Please enter the gitlab-ci description for this runner:
[1297529a8a58]: Docker Runner
Please enter the gitlab-ci tags for this runner (comma separated):
docker
Registering runner... succeeded                     runner=RQ-XuZwP
Please enter the executor: docker-ssh, virtualbox, docker+machine, docker-ssh+machine, docker, parallels, shell, ssh, kubernetes:
docker
Please enter the default Docker image (e.g. ruby:2.1):
docker:stable
Runner registered successfully. Feel free to start it, but if it's running already the config should be automatically reloaded! 

浏览器重新访问gitlab地址,应该可以看到runner已经注册,如果地址访问不成功,重启docker-compose

docker-compose down
docker-compose up

打包前端镜像

安装 registry

此时修改docker-compose.yml

services:
    # 增加registry
    registry:
      image: 'registry'
      container_name: registry
      restart: always
      ports:
        - '4567:5000'
      volumes:
        - './registry:/var/lib/registry'

    gitlab:
      image: 'gitlab/gitlab-ce:latest'
      container_name: GitLab
      restart: always
      environment:
        GITLAB_OMNIBUS_CONFIG: |
          external_url 'http://47.97.97.114:3143'
          gitlab_rails['gitlab_shell_ssh_port'] = 3122
          nginx['listen_port'] = 443
          nginx['redirect_http_to_https'] = false
          registry_external_url 'http://47.97.97.114:4567'
          registry_nginx['enable'] = false
          gitlab_rails['registry_api_url'] = "http://47.97.97.114:4567"
          gitlab_rails['registry_enabled'] = true

          gitlab_rails['backup_keep_time'] = 172800
      ports:
        - '3143:443'
        - '3122:22'
      volumes:
        - '/srv/gitlab/config:/etc/gitlab'
        - '/srv/gitlab/logs:/var/log/gitlab'
        - '/srv/gitlab/ssl:/etc/ssl/certs/gitlab'
        - '/srv/gitlab/data:/var/opt/gitlab'
                                                                                                                               23,1           5%

这里删掉了一部分https的配置,让配置文件简洁一些,删除了原有gitlab镜像中的端口'4567:4567', 重启docker-compos

docker-compose down 
docker-compose up

访问该地址:http://47.97.97.114:4567/v2/, 返回

image.png

说明registry启动成功,

配置socket binding , 让gitlab-runner 可以使用host主机的docker命令,构建镜像

vim /srv/gitlab-runner/config.toml

image.png

重启docker-compose

docker-compose down 
docker-compose up

在gitlab上增加变量Settings->CICD->Viriables:

CI_REGISTRY http://47.97.97.114:4567/

CI_REGISTRY_PASSWORD yourpassword

CI_REGISTRY_USER yourusername

这些变量可以在 gitlab-ci.yml上使用。

前端项目根目录下修改.gitlab-ci.yml,构建容器镜像并上传到gitlab的registry

image: docker:20.10.22  #注意版本是否有影响

variables:
  GIT_SSL_NO_VERIFY: "1"
stages:
  - test
  - build
before_script:
  - export PACKAGE_VERSION=$(grep '"version":' package.json | cut -d\" -f4)
  - export NODE_ENV=production


# building:
#   image: node:10    # 指定运行环境
#   stage: build          # 当前stage阶段为build
#   tags:
#     - docker
#   script:               # build阶段运行的脚本
#     - npm --registry=https://registry.npm.taobao.org install express
#     - npm i
#     - npm run  build
#   artifacts:
#     paths:
#     - dist
# cache:                  # 缓存
#   paths:                # 路径
#     - node_modules/     # 缓存node_mudules将大大提高ci运行的速度

build-docker:
  stage: build
  tags:
    - docker
  script:
    - echo $CI_REGISTRY_IMAGE
    - echo $CI_REGISTRY
    - docker login -u "$CI_REGISTRY_USER" -p "$CI_REGISTRY_PASSWORD" $CI_REGISTRY
    - echo "docker build"
    - docker build -t $CI_REGISTRY_IMAGE:$PACKAGE_VERSION .
    - docker tag $CI_REGISTRY_IMAGE:$PACKAGE_VERSION $CI_REGISTRY_IMAGE
    - docker push $CI_REGISTRY_IMAGE:$PACKAGE_VERSION
    - docker push $CI_REGISTRY_IMAGE
    - docker image rm $CI_REGISTRY_IMAGE
    - docker image rm $CI_REGISTRY_IMAGE:$PACKAGE_VERSION

  only:
    - main

CI_REGISTRY_IMAGE 是gitlab CICD内置变量,可以直接使用。

docker tag CI_REGISTRY_IMAGE:version CI_REGISTRY_IMAGE,第二个tag名只传路径会默认为latest

docker 登录时http报错解决方式:

image.png

If the daemon.json file does not exist, create it. Assuming there are no other settings in the file, it should have the following contents:

{
  "insecure-registries" : ["http://myregistrydomain.com:xxxx"]
}

然后重启docker: systemctl restart docker

打包生成镜像

前一个阶段已经可以成功使用 registry, 并且能使用docker命令打包,此时我们再来修改.gitlab-ci.yml 文件,stages增加build-docker,并且修改上一个阶段的artifacts。

image: docker:20.10.22

variables:
  GIT_SSL_NO_VERIFY: "1"
stages:
  - test
  - build
  - build-docker  #这里很重要,和下面的state保持一致,不然没法使用artifacts
before_script:
  - export PACKAGE_VERSION=$(grep '"version":' package.json | cut -d\" -f4)
  - export NODE_ENV=production


building:
  image: node:10    # 指定运行环境
  stage: build          # 当前stage阶段为build
  tags:
    - docker
  script:               # build阶段运行的脚本
    - npm --registry=https://registry.npm.taobao.org install express
    - npm i
    - npm run  build
  artifacts:
    paths:
    - dist              # 导出dist
cache:                  # 缓存
  paths:                # 路径
    - node_modules/     # 缓存node_mudules将大大提高ci运行的速度

build-docker:
  stage: build-docker
  tags:
    - docker
  script:
    - ls
    - echo $CI_REGISTRY_IMAGE
    - echo $CI_REGISTRY
    - docker login -u "$CI_REGISTRY_USER" -p "$CI_REGISTRY_PASSWORD" $CI_REGISTRY
    - echo "docker build"
    - docker build -t $CI_REGISTRY_IMAGE:$PACKAGE_VERSION .
    - docker tag $CI_REGISTRY_IMAGE:$PACKAGE_VERSION $CI_REGISTRY_IMAGE
    - docker push $CI_REGISTRY_IMAGE:$PACKAGE_VERSION
    - docker push $CI_REGISTRY_IMAGE
    - docker image rm $CI_REGISTRY_IMAGE
    - docker image rm $CI_REGISTRY_IMAGE:$PACKAGE_VERSION

  only:
    - main

再次提交到gitlab,此时应该会编译成功并且,上传镜像到gitlab

image.png

将打包镜像在onLine环境下发布

OnLine 环境只需安装docker即可,具体安装步骤和上面一样。

docker login -u "yourusername" -p "yourpassword" http://47.97.97.114:4567/  #登录registry

docker run --init -p 8000:80 -d 47.97.97.114:4567/klbest1/my-vue-app
# 运行镜像

-p 绑定端口号,-d 表示后台运行。 如果是在云上环境,需要在安全组中开放8000端口,协议为tcp.

访问发布的地址:http:yourdomain:8000, 查看前端页面是否成功。

遇到的问题
若是登录时登录地址变为https,和上面处理过程一样