CI für Frontend: Gitlab, Traefik, Docker

An jedem Projekt mit Selbstachtung müssen QS-Ingenieure teilnehmen. Jeden Tag stehen sie vor der Aufgabe, die Erfüllung von Aufgaben in getrennten Zweigen zu überprüfen. Sehr oft nimmt der Wechsel zum gewünschten Zweig, zur Montage und zum Testen viel Zeit in Anspruch, und außerdem ist es lokal nicht immer möglich, die identischste Kampfumgebung vollständig wiederherzustellen.

Der Zweck dieses Artikels ist es, eine einfache Technik zum Aufstellen eines Standes auf mehreren Zweigen zu zeigen. Dieser Artikel wurde von Entwicklern des Entwicklers verfasst, daher ist es unwahrscheinlich, dass er für professionelle DevOps-Ingenieure von erheblichem Interesse ist.

Anforderungen:

  • Gitlab (Bare Metal / Cloud)
  • Dedizierter Server
  • Kostenlose Domain

Erster Schritt: Konfigurieren Sie Gitlab


  1. Installieren Sie Gitlab Runner auf Ihrem dedizierten Server
  2. Erstellen Sie einen Worker, der Docker-Image-Builds unterstützt
  3. Containerregistrierung aktivieren

Schritt zwei: Server-Setup


  1. Installieren Sie Docker
  2. Installieren Sie Compose
  3. Erstellen Sie einen Benutzer:

    #     ,      $ sudo adduser deployer $ sudo groupadd docker $ sudo usermod -aG docker deployer #  ssh  $ su deployer $ ssh-keygen -t rsa (when asked for a passphrase, enter no passphrase) #          $ cp ~/.ssh/id_rsa.pub ~/.ssh/authorized_keys 

  4. Richten Sie traefik ein (ein Server, der Anforderungen an Docker-Container basierend auf deren Labels (Labels) weiterleitet):

     $ sudo mkdir -p /opt/traefik $ docker network create web #   docker-compose & traefik         

    /opt/traefik/docker-compose.yml

     version: '2' services: traefik: image: traefik:1.4.6 restart: always ports: - 80:80 networks: - web volumes: - /var/run/docker.sock:/var/run/docker.sock - ./traefik.toml:/traefik.toml container_name: traefik networks: web: external: true 

    /opt/traefik/traefik.toml

    Ersetzen Sie DOMAIN.COM durch Ihre Domain.

     debug = true checkNewVersion = true logLevel = "ERROR" defaultEntryPoints = ["http"] [entryPoints] [entryPoints.http] address = ":80" [retry] [docker] endpoint = "unix:///var/run/docker.sock" domain = "DOMAIN.COM" watch = true exposedbydefault = false 

  5. Führen Sie traefik aus:

     cd /opt/traefik && docker-compose up -d 

  6. Fügen Sie einen Datensatz für DOMAIN.COM in der Form '*' - IP des dedizierten Servers hinzu.

Schritt drei: Vorbereiten des Repositorys


  1. Zum Stammverzeichnis des Dockerfile-Repositorys hinzufügen:

     FROM node:8.9 as build-deps WORKDIR /usr/src/app COPY package.json ./ RUN npm i COPY . ./ RUN npm run build FROM nginx:1.12-alpine COPY --from=build-deps /usr/src/app/dist /usr/share/nginx/html EXPOSE 80 CMD ["nginx", "-g", "daemon off;"] 

    Ändern

     npm run build 

    an Ihr Build-Team. Bearbeiten Sie den Pfad auf die gleiche Weise.

     /usr/src/app/dist 

    Ändern Sie dist in Ihr Build-Verzeichnis.
    Weitere Informationen zu den Struktur- und Dockerfire-Befehlen finden Sie hier .
  2. Fügen Sie die Datei .gitlab-ci.yml mit dem Abschnitt zur Bildassemblierung hinzu:

     image: docker:stable variables: DOCKER_HOST: tcp://docker:2375/ DOCKER_DRIVER: overlay2 GITLAB_DOMAIN: gitlab.com services: - docker:dind stages: - build build_staging: stage: build script: - export GITLAB_DOMAIN=gitlab.com - export CONTAINER_IMAGE=$GITLAB_DOMAIN/frontend/main/image - docker login -u gitlab-ci-token -p $CI_BUILD_TOKEN $GITLAB_DOMAIN - docker pull $CONTAINER_IMAGE:$CI_COMMIT_REF_SLUG || true - export URL="Host:${CI_COMMIT_REF_NAME}.tests.DOMAIN.COM" - docker build -t $CONTAINER_IMAGE:$CI_COMMIT_REF_SLUG . --label "traefik.backend=${CI_COMMIT_REF_NAME}" --label "traefik.frontend.rule=${URL}" - docker push $CONTAINER_IMAGE:$CI_COMMIT_REF_SLUG 
  3. Fügen Sie den privaten Schlüssel deployer@DOMAIN.COM zu den Repository-Einstellungen (Einstellungen -> CI / CD -> Variablen) als SSH_PRIVATE_KEY hinzu
  4. Bereitstellungsabschnitte hinzufügen:

     stages: - build - deploy /// .... deploy_staging: stage: deploy image: kroniak/ssh-client:3.6 script: - mkdir ~/.ssh - '[[ -f /.dockerenv ]] && echo -e "Host *\n\tStrictHostKeyChecking no\n\n" > ~/.ssh/config' - eval $(ssh-agent -s) - ssh-add <(echo "$SSH_PRIVATE_KEY") - ssh deployer@DOMAIN.COM "docker login -u gitlab-ci-token -p $CI_BUILD_TOKEN $GITLAB_DOMAIN" - ssh deployer@DOMAIN.COM "docker stop frontend_${CI_COMMIT_REF_SLUG}" || true - ssh deployer@DOMAIN.COM "docker rm frontend_${CI_COMMIT_REF_SLUG}" || true - ssh deployer@DOMAIN.COM "docker rmi GITLAB-DOMAIN.COM/frontend/main/image:${CI_COMMIT_REF_SLUG}" || true - ssh deployer@DOMAIN.COM "docker run --name frontend_${CI_COMMIT_REF_SLUG} --network=web -d $GITLAB_DOMAIN/frontend/main/image:${CI_COMMIT_REF_SLUG}" environment: name: review/$CI_COMMIT_REF_NAME url: http://${CI_COMMIT_REF_NAME}.tests.DOMAIN.COM on_stop: stop_staging stop_staging: stage: deploy image: kroniak/ssh-client:3.6 variables: GIT_STRATEGY: none script: - mkdir ~/.ssh - '[[ -f /.dockerenv ]] && echo -e "Host *\n\tStrictHostKeyChecking no\n\n" > ~/.ssh/config' - eval $(ssh-agent -s) - ssh-add <(echo "$SSH_PRIVATE_KEY") - ssh deployer@DOMAIN.COM "docker login -u gitlab-ci-token -p $CI_BUILD_TOKEN GITLAB-DOMAIN.COM" - ssh deployer@DOMAIN.COM "docker stop frontend_${CI_COMMIT_REF_SLUG}" || true - ssh deployer@DOMAIN.COM "docker rm frontend_${CI_COMMIT_REF_SLUG}" || true - ssh deployer@DOMAIN.COM "docker rmi $GITLAB_DOMAIN/frontend/main/image:${CI_COMMIT_REF_SLUG}" || true when: manual environment: name: review/$CI_COMMIT_REF_NAME action: stop 

Die obigen Schritte reichen aus, um das folgende Ergebnis zu erzielen:

  • Jedes neue Commit für einen Zweig initiiert die Zusammenstellung und Bereitstellung des neuesten aktuellen Codes unter% branch_name% .tests.DOMAIN.COM
  • Gitlab enthält einen Umgebungsmechanismus, mit dem Sie gesperrte Bilder mit wenigen Handgriffen erstellen / löschen / öffnen können

Nächste Schritte:

  • Richten Sie einen separaten Abschnitt für die Assistentenbaugruppen ein. Im Fall des Assistenten ist es sinnvoll, das Bild über COMMIT_SHA zu kennzeichnen
  • Fügen Sie im Docker Konfigurationen zu Nginx hinzu
  • Weiterleiten von Bundle-Assembly-Parametern über ARG- und ENV-Dockerfile-Mechanismen
  • Konfigurieren Sie die Cache-Verwendung aus dem Image für Assemblys

Basierend auf dem Artikel.

Source: https://habr.com/ru/post/de429824/


All Articles