ЦИ/ЦД у Гитхуб акцијама за пројекат Фласк+Ангулар

ЦИ/ЦД у Гитхуб акцијама за пројекат Фласк+Ангулар
У овом чланку ћу поделити своје искуство постављања ЦИ/ЦД-а помоћу Плеск Цонтрол Панела и Гитхуб Ацтионс. Данас ћемо научити како да применимо једноставан пројекат са једноставним именом "Хелловорлд". Написан је у Фласк Питхон оквиру, са Целери радницима и Ангулар 8 фронтендом.

Везе ка репозиторијумима: бацкенд, предњи крај.

У првом делу чланка ћемо погледати наш пројекат и његове делове. У другом ћемо схватити како да подесимо Плеск и инсталирамо неопходна проширења и компоненте (ДБ, РаббитМК, Редис, Доцкер, итд.).

У трећем делу ћемо коначно схватити како да поставимо цевовод за постављање нашег пројекта на сервер у дев и прод окружењу. А онда ћемо покренути сајт на серверу.

И да, заборавио сам да се представим. Моје име је Олег Борзов, ја сам фуллстацк програмер у ЦРМ тиму за менаџере хипотека у Домцлицк-у.

Преглед пројекта

Прво, погледајмо два спремишта пројекта – позадинско и предње – и пређимо преко кода.

Позадина: Фласк+Целери

За задњи део, узео сам гомилу која је прилично популарна међу Питхон програмерима: Фласк фрамеворк (за АПИ) и Целери (за ред задатака). СКЛАцхеми се користи као ОРМ. Алембик се користи за миграције. За ЈСОН валидацију у ручкама - Марсхмаллов.

В спремишта постоји датотека Реадме.мд са детаљним описом структуре и упутствима за покретање пројекта.

АПИ за веб део прилично некомпликовано, састоји се од 6 оловака:

  • /ping - да провери доступност;
  • ручке за регистрацију, ауторизацију, деауторизацију и добијање овлашћеног корисника;
  • рукохват е-поште који ставља задатак у ред чекања.

Део целера још лакше, постоји само један проблем send_mail_task.

У фасцикли /цонф постоје два подфолдера:

  • docker са два Доцкер фајла (base.dockerfile изградити основну слику која се ретко мења и Dockerfile за главне скупштине);
  • .env_files - са датотекама са променљивим окружења за различита окружења.

Постоје четири доцкер-цомпосе датотеке у корену пројекта:

  • docker-compose.local.db.yml подизање локалне базе података за развој;
  • docker-compose.local.workers.yml за локално подизање радника, база података, Редис и РаббитМК;
  • docker-compose.test.yml за покретање тестова током примене;
  • docker-compose.yml за распоређивање.

И последња фасцикла која нас занима - .ци-цд. Садржи схелл скрипте за примену:

  • deploy.sh — покретање миграције и распоређивање. Покреће се на серверу након изградње и покретања тестова у Гитхуб Ацтионс;
  • rollback.sh - враћање контејнера на претходну верзију склопа;
  • curl_tg.sh - слање обавештења о примени у Телеграм.

Фронтенд на Ангулар

Репозиторијум са предњом страном много једноставнији од Бековог. Предњи део се састоји од три странице:

  • Главна страница са формом за слање е-поште и дугметом за излаз.
  • Страница за пријаву.
  • Страница за регистрацију.

Главна страница изгледа аскетски:

ЦИ/ЦД у Гитхуб акцијама за пројекат Фласк+Ангулар
Постоје две датотеке у корену Dockerfile и docker-compose.yml, као и познати фолдер .ci-cd са нешто мање скрипти него у задњем спремишту (уклоњене скрипте за покретање тестова).

Започињање пројекта у Плеску

Почнимо тако што ћемо подесити Плеск и креирати претплату за наш сајт.

Инсталирање екстензија

У Плеску су нам потребна четири проширења:

  • Docker да управља и визуелно приказује статус контејнера у Плеск админ панелу;
  • Git да конфигуришете корак имплементације на серверу;
  • Let's Encrypt да генерише (и аутоматски обнови) бесплатне ТЛС сертификате;
  • Firewall да конфигуришете филтрирање долазног саобраћаја.

Можете их инсталирати преко Плеск административног панела у одељку Екстензије:

ЦИ/ЦД у Гитхуб акцијама за пројекат Фласк+Ангулар
Нећемо разматрати детаљна подешавања за екстензије, подразумевана подешавања ће послужити за наше демо сврхе.

Направите претплату и сајт

Затим морамо да креирамо претплату за нашу веб локацију хелловорлд.ру и да тамо додамо поддомен дев.хелловорлд.ру.

  1. Направите претплату за домен хелловорлд.ру и наведите лозинку за пријављивање за корисника система:

    ЦИ/ЦД у Гитхуб акцијама за пројекат Фласк+Ангулар
    Означите поље за потврду на дну странице Осигурајте домен помоћу Лет'с Енцриптако желимо да подесимо ХТТПС за сајт:

    ЦИ/ЦД у Гитхуб акцијама за пројекат Фласк+Ангулар

  2. Затим, у овој претплати, креирајте поддомен дев.хелловорлд.ру (за који такође можете издати бесплатан ТЛС сертификат):

    ЦИ/ЦД у Гитхуб акцијама за пројекат Фласк+Ангулар

Инсталирање компоненти сервера

Имамо сервер са OS Debian Istezanje 9.12 и инсталиран контролни панел Плеск Обсидиан 18.0.27.

Морамо да инсталирамо и конфигуришемо за наш пројекат:

  • ПостгреСКЛ (у нашем случају, постојаће један сервер са две базе података за дев и прод окружења).
  • РаббитМК (иста, иста инстанца са различитим вхостовима за окружења).
  • Две Редис инстанце (за дев и прод окружења).
  • Доцкер регистар (за локално складиштење изграђених Доцкер слика).
  • УИ за Доцкер регистар.

ПостгреСКЛ

Плеск већ долази са ПостгреСКЛ ДБМС, али не и најновијом верзијом (у време писања Плеск Обсидиан-а подржана Постгрес верзије 8.4–10.8). Желимо најновију верзију за нашу апликацију (12.3 у време писања овог текста), тако да ћемо је инсталирати ручно.

Детаљна упутства за инсталирање Postgres-а на Debian Има тога доста на интернету (пример), тако да их нећу детаљно описивати, само ћу дати команде:

wget -q https://www.postgresql.org/media/keys/ACCC4CF8.asc -O - | sudo apt-key add -
sudo sh -c 'echo "deb http://apt.postgresql.org/pub/repos/apt/ stretch-pgdg main" >> /etc/apt/sources.list.d/pgdg.list'

sudo apt-get update
sudo apt-get install postgresql postgresql-contrib

С обзиром да ПостгреСКЛ има прилично осредње подразумеване поставке, потребно је исправити конфигурацију. Ово ће нам помоћи Калкулатор: потребно је да унесете параметре вашег сервера и замените подешавања у датотеци /etc/postgresql/12/main/postgresql.confонима који се нуде. Овде треба напоменути да такви калкулатори нису магични метак, а базу треба прецизније подесити, на основу вашег хардвера, апликације и сложености упита. Али ово је довољно за почетак.

Поред подешавања које је предложио калкулатор, такође се мењамо postgresql.confподразумевани порт 5432 на други (у нашем примеру - 53983).

Након промене конфигурационе датотеке, поново покрените постгрескл-сервер командом:

service postgresql restart

Инсталирали смо и конфигурисали ПостгреСКЛ. Сада направимо базу података, кориснике за дев и прод окружења и дамо корисницима права да управљају базом података:

$ su - postgres
postgres:~$ create database hw_dev_db_name;
CREATE DATABASE
postgres:~$ create user hw_dev_db_user with password 'hw_dev_db_password';
CREATE ROLE
postgres:~$ grant ALL privileges ON database hw_dev_db_name to hw_dev_db_user;
GRANT
postgres:~$ create database hw_prod_db_name;
CREATE DATABASE
postgres:~$ create user hw_prod_db_user with password 'hw_prod_db_password';
CREATE ROLE
postgres:~$ grant ALL privileges ON database hw_prod_db_name to hw_prod_db_user;
GRANT

РаббитМК

Пређимо на инсталирање RabbitMQ-а, брокера порука за Celery. Инсталиран је на Debian Сасвим је једноставно:

wget https://packages.erlang-solutions.com/erlang-solutions_1.0_all.deb
sudo dpkg -i erlang-solutions_1.0_all.deb

sudo apt-get update
sudo apt-get install erlang erlang-nox

sudo add-apt-repository 'deb http://www.rabbitmq.com/debian/ testing main'
wget -O- https://www.rabbitmq.com/rabbitmq-release-signing-key.asc | sudo apt-key add -

sudo apt-get update
sudo apt-get install rabbitmq-server

Након инсталације, морамо да креирамо вхостс, корисницима и доделити потребна права:

sudo rabbitmqctl add_user hw_dev_amqp_user hw_dev_amqp_password 
sudo rabbitmqctl set_user_tags hw_dev_amqp_user administrator
sudo rabbitmqctl add_vhost hw_dev_vhost
sudo rabbitmqctl set_permissions -p hw_dev_vhost hw_dev_amqp_user ".*" ".*" ".*"

sudo rabbitmqctl add_user hw_prod_amqp_user hw_prod_amqp_password 
sudo rabbitmqctl set_user_tags hw_prod_amqp_user administrator
sudo rabbitmqctl add_vhost hw_prod_vhost
sudo rabbitmqctl set_permissions -p hw_prod_vhost hw_prod_amqp_user ".*" ".*" ".*"

Редис

Хајде сада да инсталирамо и конфигуришемо последњу компоненту за нашу апликацију - Редис. Користиће се као бацкенд за чување резултата Целери задатака.

Подићи ћемо два Доцкер контејнера са Редис-ом за дев и прод окружења користећи екстензију Docker за Плеск.

  1. Идемо у Плеск, идемо у одељак Екстензије, тражимо Доцкер екстензију и инсталирамо га (потребна нам је бесплатна верзија):

    ЦИ/ЦД у Гитхуб акцијама за пројекат Фласк+Ангулар

  2. Идите на инсталирано проширење, пронађите слику кроз претрагу redis bitnami и инсталирајте најновију верзију:

    ЦИ/ЦД у Гитхуб акцијама за пројекат Фласк+Ангулар

  3. Улазимо у преузети контејнер и подешавамо конфигурацију: одредимо порт, максималну додељену величину РАМ-а, лозинку у променљивим окружења и монтирамо волумен:

    ЦИ/ЦД у Гитхуб акцијама за пројекат Фласк+Ангулар

  4. Изводимо кораке 2-3 за прод контејнер, у подешавањима мењамо само параметре: порт, лозинку, величину РАМ-а и путању до фолдера запремине на серверу:

    ЦИ/ЦД у Гитхуб акцијама за пројекат Фласк+Ангулар

Доцкер Регистри

Поред основних услуга, било би лепо да на сервер ставите и сопствено Доцкер спремиште слика. Срећом, простор на серверу је сада прилично јефтин (сигурно јефтинији од претплате на ДоцкерХуб), а процес постављања приватног спремишта је врло једноставан.

Желимо да имамо:

Да бисте то урадили:

  1. Хајде да направимо два поддомена у Плеску у нашој претплати: доцкер.хелловорлд.ру и доцкер-уи.хелловорлд.ру и конфигуришемо Лет'с Енцрипт сертификате за њих.
  2. Додајте датотеку у фасциклу поддомена доцкер.хелловорлд.ру docker-compose.yml са оваквим садржајем:
    version: "3"
    
    services:
      docker-registry:
        image: "registry:2"
        restart: always
        ports:
          - "53985:5000"
        environment:
          REGISTRY_AUTH: htpasswd
          REGISTRY_AUTH_HTPASSWD_REALM: basic-realm
          REGISTRY_AUTH_HTPASSWD_PATH: /auth/.htpasswd
          REGISTRY_STORAGE_FILESYSTEM_ROOTDIRECTORY: /data
        volumes:
          - ./.docker-registry.htpasswd:/auth/.htpasswd
          - ./data:/data
    
      docker-registry-ui:
        image: konradkleine/docker-registry-frontend:v2
        restart: always
        ports:
          - "53986:80"
        environment:
          VIRTUAL_HOST: '*, https://*'
          ENV_DOCKER_REGISTRY_HOST: 'docker-registry'
          ENV_DOCKER_REGISTRY_PORT: 5000
        links:
          - 'docker-registry'
    

  3. Под ССХ, генерисаћемо .хтпассвд датотеку за основну ауторизацију у Доцкер спремишту:
    htpasswd -bBc .htpasswd hw_docker_admin hw_docker_password
  4. Сакупите и подигните контејнере:
    docker-compose up -d
  5. И морамо да преусмеримо Нгинк на наше контејнере. Ово се може урадити преко Плеск-а.

За поддомене доцкер.хелловорлд.ру и доцкер-уи.хелловорлд.ру треба урадити следеће кораке:

У секцији Дев Тоолс идите на наш сајт Доцкер проки правила:

ЦИ/ЦД у Гитхуб акцијама за пројекат Фласк+Ангулар
И додајте правило за долазни саобраћај проксија у наш контејнер:

ЦИ/ЦД у Гитхуб акцијама за пројекат Фласк+Ангулар

  1. Проверавамо да ли можемо да се пријавимо у наш контејнер са локалне машине:
    $ docker login docker.helloworld.ru -u hw_docker_admin -p hw_docker_password
    WARNING! Using --password via the CLI is insecure. Use --password-stdin.
    Login Succeeded
  2. Проверимо и рад поддомена доцкер-уи.хелловорлд.ру:

    ЦИ/ЦД у Гитхуб акцијама за пројекат Фласк+Ангулар
    Када кликнете на Прегледај спремишта, претраживач ће приказати прозор за ауторизацију у који ћете морати да унесете корисничко име и лозинку за спремиште. Након тога, бићемо пребачени на страницу са листом складишта (за сада ће вам она бити празна):

    ЦИ/ЦД у Гитхуб акцијама за пројекат Фласк+Ангулар

Отварање портова у Плеск заштитном зиду

Након инсталирања и конфигурисања компоненти, потребно је да отворимо портове како би компоненте биле доступне из Доцкер контејнера и спољне мреже.

Хајде да видимо како да то урадимо користећи проширење Фиревалл за Плеск које смо раније инсталирали.

  1. Иди на Алатке и подешавања > Подешавања > Заштитни зид:
    ЦИ/ЦД у Гитхуб акцијама за пројекат Фласк+Ангулар
  2. Иди на Измените правила Плеск заштитног зида > Додај прилагођено правило и отворите следеће ТЦП портове за Доцкер подмрежу (КСНУМКС / КСНУМКС):
    РаббитМК: 1883, 4369, 5671-5672, 25672, 61613-61614
    Редис: 32785, 32786

    ЦИ/ЦД у Гитхуб акцијама за пројекат Фласк+Ангулар

  3. Такође ћемо додати правило које ће отворити ПостгреСКЛ портове и РаббитМК панеле за управљање спољном свету:

    ЦИ/ЦД у Гитхуб акцијама за пројекат Фласк+Ангулар

  4. Примените правила помоћу дугмета Примени промене:

    ЦИ/ЦД у Гитхуб акцијама за пројекат Фласк+Ангулар

Подешавање ЦИ/ЦД-а у Гитхуб акцијама

Хајде да пређемо на најинтересантнији део - постављање континуираног цевовода интеграције и испоруку нашег пројекта на сервер.

Овај цевовод ће се састојати од два дела:

  • прављење слике и покретање тестова (за позадину) - на страни Гитхуб-а;
  • покретање миграција (за позадину) и постављање контејнера - на серверу.

Поставите у Плеск

Хајде да се прво позабавимо другом тачком (јер прва зависи од тога).

Ми ћемо конфигурисати процес имплементације користећи Гит екстензију за Плеск.

Размотрите пример са Прод окружењем за Бацкенд спремиште.

  1. Идемо на претплату наше Хелловорлд веб странице и идемо у пододељак Гит:

    ЦИ/ЦД у Гитхуб акцијама за пројекат Фласк+Ангулар

  2. Уметните везу до нашег Гитхуб спремишта у поље „Ремоте Гит репоситори“ и промените подразумевану фасциклу httpdocs другоме (нпр. /httpdocs/hw_back):

    ЦИ/ЦД у Гитхуб акцијама за пројекат Фласк+Ангулар

  3. Копирајте ССХ јавни кључ из претходног корака и додати налази се у Гитхуб подешавањима.
  4. Кликните ОК на екрану у кораку 2, након чега ћемо бити преусмерени на страницу спремишта у Плеску. Сада морамо да конфигуришемо спремиште да се ажурира приликом урезивања на главну грану. Да бисте то урадили, идите на Подешавања спремишта и сачувајте вредност Webhook URL (требаће нам касније приликом подешавања Гитхуб Ацтионс):

    ЦИ/ЦД у Гитхуб акцијама за пројекат Фласк+Ангулар

  5. У поље Акције на екрану из претходног пасуса унесите скрипту за покретање имплементације:
    cd {REPOSITORY_ABSOLUTE_PATH}
    .ci-cd/deploy.sh {ENV} {DOCKER_REGISTRY_HOST} {DOCKER_USER} {DOCKER_PASSWORD} {TG_BOT_TOKEN} {TG_CHAT_ID} 

    где је:

    {REPOSITORY_ABSOLUTE_PATH} - путања до прод фолдера позадинског спремишта на серверу;
    {ENV} - окружење (дев / прод), у нашем случају prod;
    {DOCKER_REGISTRY_HOST} - домаћин нашег доцкер репозиторија
    {TG_BOT_TOKEN} — Телеграм бот токен;
    {TG_CHAT_ID} — ИД ћаскања/канала за слање обавештења.

    Пример скрипте:

    cd /var/www/vhosts/helloworld.ru/httpdocs/hw_back/
    .ci-cd/deploy.sh dev docker.helloworld.ru docker_user docker_password 12345678:AAbcdEfghCH1vGbCasdfSAs0K5PALDsaw -1001234567890
  6. Додајте корисника из наше претплате у Доцкер групу (да би могли да управљају контејнерима):
    sudo usermod -aG docker helloworld_admin

Окружење за развој за бацкенд спремиште и фронтенд су подешени на исти начин.

Цевовод за примену у Гитхуб акцијама

Хајде да пређемо на подешавање првог дела нашег ЦИ/ЦД цевовода у Гитхуб Ацтионс.

Бацкенд

Цевовод је описан у деплои.имл датотеку.

Али пре него што га рашчланимо, хајде да попунимо тајне варијабле које су нам потребне у Гитхубу. Да бисте то урадили, идите на Подешавања -> Тајне:

  • DOCKER_REGISTRY - домаћин нашег Доцкер спремишта (доцкер.хелловорлд.ру);
  • DOCKER_LOGIN - пријавите се на Доцкер спремиште;
  • DOCKER_PASSWORD - лозинка за њега;
  • DEPLOY_HOST — хост где је Плеск админ панел доступан (пример: хелловорлд.ру: 8443 ili 123.4.56.78:8443);
  • DEPLOY_BACK_PROD_TOKEN - токен за примену у прод-репозиторијум на серверу (добили смо га у Деплоимент ин Плеск стр. 4);
  • DEPLOY_BACK_DEV_TOKEN - токен за примену у дев спремиште на серверу.

Процес постављања је једноставан и састоји се од три главна корака:

  • изградња и објављивање слике у нашем спремишту;
  • покретање тестова у контејнеру на основу свеже направљене слике;
  • имплементација у жељено окружење у зависности од гране (дев/мастер).

frontend

Датотека деплои.имл за предње спремиште мало другачији од Бековог. Недостаје корак са покретањем тестова и променама имена токена за примену. Тајне за предњи репозиториј, иначе, треба попунити посебно.

Подешавање локације

Прокси саобраћај преко Нгинк-а

Па, дошли смо до краја. Остаје само да конфигуришемо прокси долазни и одлазни саобраћај у наш контејнер преко Нгинк-а. Већ смо покрили овај процес у кораку 5 подешавања Доцкер Регистри-а. Исто треба поновити за задње и предње делове у дев и прод окружењима.

Даћу снимке екрана подешавања.

Бацкенд

ЦИ/ЦД у Гитхуб акцијама за пројекат Фласк+Ангулар

frontend

ЦИ/ЦД у Гитхуб акцијама за пројекат Фласк+Ангулар
Важно појашњење. Сви УРЛ-ови ће бити послани у фронтенд контејнер, осим оних који почињу са /api/ - они ће бити послани у задњи контејнер (тако у задњем контејнеру, сви руковаоци морају почети са /api/).

Резултати

Сада би наш сајт требало да буде доступан на хелловорлд.ру и дев.хелловорлд.ру (прод- и дев-енвиронментс, респективно).

Укупно смо научили како да припремимо једноставну апликацију у Фласк-у и Ангулар-у и да подесимо цевовод у Гитхуб Ацтионс-у да бисмо је представили на серверу који користи Плеск.

Дуплицираћу везе до спремишта са кодом: бацкенд, предњи крај.

Извор: ввв.хабр.цом

Купите поуздан хостинг за сајтове са ДДоС заштитом, ВПС ВДС сервере 🔥 Купите поуздан веб хостинг са DDoS заштитом, VPS VDS сервере | ProHoster