CI/CD GitHub Actions projekti jaoks, mis kasutab Flaski ja Angularit

CI/CD GitHub Actions projekti jaoks, mis kasutab Flaski ja Angularit
Selles artiklis jagan oma kogemusi CI/CD seadistamisel, kasutades Pleski juhtpaneeli ja Github Actions'i. TÀna Ôpime, kuidas kÀivitada lihtsat projekti nimega "Helloworld", mis on kirjutatud Python'i raamistikus Flask, Celery töötajatega ja Angular 8 frontendiga.

Repo ĂŒhendused: tagumine osa, esimene osa.

Artikli esimeses osas vaatame meie projekti ja selle komponente. Teises osas selgitame, kuidas seadistada Pleskit ja installida vajalikud laiendused ja komponendid (andmebaas, RabbitMQ, Redis, Docker jne).

Kolmandas osas kÀsitleme lÔpuks, kuidas seadistada pipelines, et kÀivitada meie projekt serveris dev- ja prod-keskkonnas. SeejÀrel kÀivitame saidi serveris.

Ja jah, unustasin end tutvustada. Minu nimi on Oleg Borzov, olen tÀisvirna arendaja CRM meeskonnas, mis tegeleb kodulaenude halduritega Domklik'is.

Projekt vaade

Alustuseks vaatame kahte projekti hoidlat — tagumist osa ja esimest osa — ning nĂ€eme koodi ĂŒle.

Tagumine osa: Flask + Celery

TagakĂŒljeks valisin Python-arendajate seas ĂŒsna populaarse kombinatsiooni: Flask (API jaoks) ja Celery (ĂŒlesannete jĂ€rjekorra jaoks). ORM-ina kasutatakse SQLAlchemy't. Migratsioonide jaoks on kasutusel Alembic. JSONi valideerimiseks kĂ€epidemetes – Marshmallow.

V repositoriis on olemas fail Readme.md, kus on selle struktuuri ja projekti kÀivitamiseks vajalikud juhised.

Veebi API on piisavalt lihtne, koosneb 6 kÀepidemest:

  • /ping — töökindluse kontrollimiseks;
  • kĂ€epidemed registreerimiseks, autentimiseks, deautentimiseks ja autentitud kasutaja saamiseks;
  • kĂ€epide e-kirjade saatmiseks, mis paneb ĂŒlesande Celery jĂ€rjekorda.

Celery osa on veelgi lihtsam, seal on vaid ĂŒks ĂŒlesanne send_mail_task.

Kaustas /conf on kaks alamkausta:

  • docker kahe Docker-failiga (base.dockerfile harva muutuva pĂ”hikujundi jaoks ja Dockerfile peamiseks kogumis);
  • .env_files — keskkonnamuutujatefailidega erinevatele keskkondadele.

Projekti juures on neli docker-compose faili:

  • docker-compose.local.db.yml kohaliku arenduse andmebaasi kĂ€ivitamiseks;
  • docker-compose.local.workers.yml kohalike töötajate, andmebaasi, Redis'i ja RabbitMQ kĂ€ivitamiseks;
  • docker-compose.test.yml testide lĂ€biviimiseks juurutuse kĂ€igus;
  • docker-compose.yml deploomiseks.

Ja viimane huvitav kaust, millel on tĂ€htsust — .ci-cd. Siin on shell-scriptid juurutamiseks:

  • deploy.sh — migratsiooni ja juurutamise kĂ€ivitamine. KĂ€ivitatakse serveris pĂ€rast koostamist ja testide lĂ€biviimist Github Actions'is;
  • rollback.sh — konteinerite tagasiviimine eelnenud versiooni.
  • curl_tg.sh — teavituste saatmine juurutamisest Telegramisse.

Frontend Angularil

Repo front-end'iga on palju lihtsam kui back-end. Front koosneb kolmest lehelt:

  • Pealeht koos e-posti saatmise vormi ja vĂ€ljuminenuhiga.
  • Sisselogimise leht.
  • Registreerimise leht.

Pealeht nÀeb minimaalne vÀlja:

CI/CD GitHub Actions projekti jaoks, mis kasutab Flaski ja Angularit
Juurtas on kaks faili Dockerfile ja docker-compose.yml, samuti tuttav meile kaust .ci-cd veidi vÀhemate skriptidega kui back-end'i repos (testide kÀivitamise skriptid on eemaldatud).

Loome projekti Pleskis

Alustame Pleski seadistamise ja tellimuse loomisega meie saidile.

Laienduste installimine

Pleskis vajame nelja laiendust:

  • Docker konteinerite haldamiseks ja nende oleku visuaalseks kuvamiseks Pleski halduses;
  • Git pakkumise seadistamiseks serveris;
  • Let's Encrypt tasuta TLS-sertifikaatide genereerimiseks (ja automaatseks uuendamiseks);
  • Firewall sissetuleva liikluse filtreerimise seadistamiseks.

Need saab installida Pleski halduses jaotises Extensions:

CI/CD GitHub Actions projekti jaoks, mis kasutab Flaski ja Angularit
Ainult pÔhiseaded sobivad meie demonstratsioonide jaoks, detailset seadistust me ei aruta.

Tellimuse ja veebisaidi loomine

Edasi peame looma tellimuse meie veebisaidile helloworld.ru ja lisama alamdomeeni dev.helloworld.ru.

  1. Loome tellimuse domeenile helloworld.ru ja mÀÀrame sĂŒsteemikasutaja kasutajanime ja parooli:

    CI/CD GitHub Actions projekti jaoks, mis kasutab Flaski ja Angularit
    Allpool lehte paneme linnukese Kinnita domeeni Let’s Encryptiga, kui soovime seadistada HTTPS-i veebisaidile:

    CI/CD GitHub Actions projekti jaoks, mis kasutab Flaski ja Angularit

  2. Edasi selles tellimuses loome alamdomeeni dev.helloworld.ru (mille jaoks saab samuti tasuta TLS-sertifikaadi vÀlja anda):

    CI/CD GitHub Actions projekti jaoks, mis kasutab Flaski ja Angularit

Serverikomponentide installimine

Meil on server, millel on OS Debian Stretch 9.12 ja paigaldatud halduspaneel Plesk Obsidian 18.0.27.

Peame installima ja seadistama meie projekti jaoks:

  • PostgreSQL (meie juhul on ĂŒks server kahe andmebaasiga dev- ja prod-keskkonna jaoks).
  • RabbitMQ (sama, ĂŒks instants erinevate vhosts vahel keskkondade jaoks).
  • Kaks Redis’i instantsi (dev- ja prod-keskkonna jaoks).
  • Docker Registry (kogutud Docker-piltide kohalikuks salvestamiseks).
  • Docker registry jaoks UI-liides.

PostgreSQL

Pleskiga tuleb juba kaasa PostgreSQL andmebaas, kuid mitte kĂ”ige uuema versiooniga (artikli kirjutamise ajal toetas Plesk Obsidian siiski versiooni Postgres versioonid 8.4–10.8). Meie soovime oma rakendusele kĂ”ige uuemat versiooni (12.3 kirjutamise ajal), seega paigaldame selle kĂ€sitsi.

Internetis on palju ĂŒksikasjalikke juhiseid Postgresi paigaldamiseks Debianile (an example), seega ei hakka ma neid ĂŒksikasjalikult kirjeldama, lihtsalt toome vĂ€lja kĂ€sud:

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

Arvestades, et PostgreSQL-i vaikeseaded on ĂŒsna keskpĂ€rased, on vajalik kindlasti konfiguratsiooni kohandamine. Meid aitab selle juures kalkulaator: tuleb sisestada oma serveri parameetrid ja asendada seaded failis /etc/postgresql/12/main/postgresql.confsoovitustega. Siinkohal tuleks mĂ€rkida, et sellised kalkulaatorid ei ole imerohtu ning andmebaasi tuleks tĂ€psemalt hÀÀlestada, lĂ€htudes teie riistvarast, rakendusest ja pĂ€ringute keerukusest. Kuid alustamiseks on see piisav.

Lisaks kalkulaatori soovitatud seadetele muudame ka postgresql.confvaikimisi mÀÀratud sadama 5432 teiseks (meie nĂ€ites — 53983).

PÀrast konfiguratsioonifaili muutmist taaskÀivitame postgresql-serveri kÀsuga:

service postgresql restart

Me oleme installinud ja seadistanud PostgreSQL. NĂŒĂŒd loome andmebaasi, arenduse ja tootmise keskkonna kasutajad ning anname neile Ă”igused andmebaasi haldamiseks:

$ 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

Liigume edasi RabbitMQ installimise juurde — sĂ”numite vahendaja Celery jaoks. Debianis on selle paigaldamine ĂŒsna lihtne:

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

PÀrast installimist peame looma vhosts, kasutajad ja andma vajalikud Ôigused:

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 ".*" ".*" ".*"

Redis

Seame nĂŒĂŒd paika ja seadistame meie rakenduse viimase komponendi — Redis. Seda kasutatakse Celery ĂŒlesannete tulemuste salvestamise tagaplaanina.

Loome kaks Docker-konteinerit Redis' jaoks dev- ja prod-keskkondade jaoks kasutades laiendust Docker Pleskile.

  1. Logime Pleski sisse, lÀhme laienduste sektsiooni, otsime Docker laiendust ja installime selle (me vajame tasuta versiooni):

    CI/CD GitHub Actions projekti jaoks, mis kasutab Flaski ja Angularit

  2. JÔuame installitud laiendusse, otsime piltide seast redis bitnami ja paigaldame viimase versiooni:

    CI/CD GitHub Actions projekti jaoks, mis kasutab Flaski ja Angularit

  3. Siseneme allalaaditud konteinerisse ja kohandame seadistust: mÀÀrame porti, maksimaalse eraldatud RAM-i suuruse, parooli keskkonnamuutujates ning monteerime mahu:

    CI/CD GitHub Actions projekti jaoks, mis kasutab Flaski ja Angularit

  4. Korrame samme 2-3 prod-konteineri jaoks, muudame seadistustes ainult parameetreid: port, parool, RAM-i suurus ja kausta rada serveris:

    CI/CD GitHub Actions projekti jaoks, mis kasutab Flaski ja Angularit

Docker Registry

Lisaks pĂ”hiteenustele oleks hea paigaldada serverisse ka oma Docker-piltide hoidla. Hea kĂŒll, et serverite ruum on praegu piisavalt odav (kindlasti odavam kui DockerHub'i tellimus), ja privaatse hoidla seadistamine on vĂ€ga lihtne.

Soovime, et meil oleksid paigaldatud:

Selleks:

  1. Loome Pleskis meie tellimuses kaks alamdomeeni: docker.helloworld.ru ja docker-ui.helloworld.ru, ning seadistame neile Let’s Encrypt sertifikaadid.
  2. Alandomeeni docker.helloworld.ru kausta lisame faili docker-compose.yml sellise sisuga:
    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. SSH kaudu genereerime faili .htpasswd Basic-autoriseerimise jaoks Docker-hoidlas:
    htpasswd -bBc .htpasswd hw_docker_admin hw_docker_password
  4. Kogume ja kÀivitame konteinerid:
    docker-compose up -d
  5. Ja tuleb suunata Nginx meie konteineritele. Seda saab teha Pleskis.

JĂ€rgmised toimingud tuleb teha alamdomeenide docker.helloworld.ru ja docker-ui.helloworld.ru jaoks:

Jaotises Dev Tools mine meie veebisaidile Docker Proxy Rules:

CI/CD GitHub Actions projekti jaoks, mis kasutab Flaski ja Angularit
Ja lisame reegli sissetuleva liikluse suunamiseks meie konteinerisse:

CI/CD GitHub Actions projekti jaoks, mis kasutab Flaski ja Angularit

  1. Kontrollime, kas saame meie konteinerisse siseneda kohalikult masinalt:
    $ docker login docker.helloworld.ru -u hw_docker_admin -p hw_docker_password
    HOIATUS! --password CLI kaudu kasutamine on ebaturvaline. Kasutage --password-stdin.
    Logimine Ônnestus
  2. Kontrollime ka subdomeeni docker-ui.helloworld.ru tööd:

    CI/CD GitHub Actions projekti jaoks, mis kasutab Flaski ja Angularit
    KlĂ”psates nuppu Browse repositories, kuvab brauser autoriseerimise akna, kuhu tuleb sisestada repo kasutajanimi ja parool. PĂ€rast seda suunatakse meid reposiitide nimekirja lehele (see on teil veel tĂŒhi):

    CI/CD GitHub Actions projekti jaoks, mis kasutab Flaski ja Angularit

Avame sadamad Plesk Firewallis

PÀrast komponentide installimist ja seadistamist tuleb avada sadamad, et komponendid oleksid Docker-konteineritest ja vÀlisest vÔrgust ligipÀÀsetavad.

Vaadake, kuidas seda teha, Pleskile varem installitud Firewalli laienduse nÀitel.

  1. Liigume Tools & Settings > Settings > Firewall:
    CI/CD GitHub Actions projekti jaoks, mis kasutab Flaski ja Angularit
  2. Liigume Muuda Plesk Firewalli reegleid > Lisa kohandatud reegel ja avame jÀrgmised TCP-sadamad Docker alvÔrgu jaoks (172.0.0.0/8):
    RabbitMQ: 1883, 4369, 5671-5672, 25672, 61613-61614
    Redis: 32785, 32786

    CI/CD GitHub Actions projekti jaoks, mis kasutab Flaski ja Angularit

  3. Lisame ka reegli, mis avab vÀlismaailmale PostgreSQL ja RabbitMQ halduspaneeli sadamat:

    CI/CD GitHub Actions projekti jaoks, mis kasutab Flaski ja Angularit

  4. Kohaldame reegleid nuppu Apply Changes abil:

    CI/CD GitHub Actions projekti jaoks, mis kasutab Flaski ja Angularit

CI/CD seadistamine Github Actionsis

Asume kĂ”ige huvitavama osa juurde — meie projekti pideva integreerimise ja kohaletoimetamise töövoo seadistamine serverisse.

See toru koosneb kahest osast:

  • pildi koostamine ja testide lĂ€biviimine (tagaplaanil) — Githubi poolel;
  • migreerimise kĂ€ivitamine (tagaplaanil) ja konteinerite juurutamine — serveris.

Juurutamine Pleskis

Alustame kÔigepealt teise punktiga (kuna see sÔltub esimesest).

Juurutamisprotsessi seadistame Pleski jaoks Git laienduse abil.

Vaatame nÀidet Prod keskkonnast Backend hoidla jaoks.

  1. Siseneme meie saidi Helloworld tellimusse ja liigume Git alammenĂŒĂŒsse:

    CI/CD GitHub Actions projekti jaoks, mis kasutab Flaski ja Angularit

  2. Kopeerime «Remote Git repository» vÀljale meie Githubi hoidla lingi ja muudame vaikimisi kausta httpdocs teisel (nÀiteks, /httpdocs/hw_back):

    CI/CD GitHub Actions projekti jaoks, mis kasutab Flaski ja Angularit

  3. Kopeerime SSH avaliku vÔtme eelmiselt etapilt ja lisame selle Githubi seadetes.
  4. KlĂ”psame ekraanil punkti 2 juures OK, pĂ€rast mida suunatakse meid Pleski hoidla lehele. NĂŒĂŒd peame seadistama hoidla vĂ€rskendamise, kui tehakse komiteed master harusse. Selleks liigume Repository Settings ja salvestame vÀÀrtuse Webhook URL (see lĂ€heb meil hiljem vaja Github Actions seadistamisel):

    CI/CD GitHub Actions projekti jaoks, mis kasutab Flaski ja Angularit

  5. Eelmise punkti ekraanil vÀljal Actions sisestame juurutamise skripti:
    cd {REPOSITORY_ABSOLUTE_PATH}
    .ci-cd/deploy.sh {ENV} {DOCKER_REGISTRY_HOST} {DOCKER_USER} {DOCKER_PASSWORD} {TG_BOT_TOKEN} {TG_CHAT_ID} 

    kus:

    {REPOSITORY_ABSOLUTE_PATH} — tee prod backend-repositooriumi kaustale serveris;
    {ENV} — keskkond (dev/prod), meie puhul prod;
    {DOCKER_REGISTRY_HOST} — meie docker-repositooriumi host
    {TG_BOT_TOKEN} — Telegrami boti token;
    {TG_CHAT_ID} — chati/kanaali ID teavituste saatmiseks.

    Skripti nÀide:

    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. Lisame meie tellimuse kasutaja Docker gruppi (et ta saaks konteineritega töötada):
    sudo usermod -aG docker helloworld_admin

Dev-keskkond backend-repositooriumi ja frontend'i jaoks seadistatakse sarnaselt.

Github Actioni deploy pipeline

Liigume edasi meie CI/CD-pipelai esimese osa seadistamise juurde Github Actionsis.

Backend

Pipeline on kirjas failis deploy.yml.

Kuid enne selle analĂŒĂŒsimist tĂ€idame Githubis vajalikud Secret-muutujad. Selleks liigume Seaded -> Saladused:

  • DOCKER_REGISTRY — meie Docker-repositooriumi host (docker.helloworld.ru);
  • DOCKER_LOGIN — sisse logimine Docker-repositooriumisse;
  • DOCKER_PASSWORD — parool sellele;
  • DEPLOY_HOST — host, kus on Pleski adminpaneel (nĂ€ide: helloworld.ru:8443 vĂ”i 123.4.56.78:8443);
  • DEPLOY_BACK_PROD_TOKEN — token prod-repositooriumisse serveris deployimiseks (oleme selle saanud Pleski seadistamisest p. 4);
  • DEPLOY_BACK_DEV_TOKEN — token dev-repositooriumisse serveris deployimiseks.

Deployimise protsess on lihtne ja koosneb kolmest peamisest sammust:

  • pildi kokkupanemisest ja avaldamisest meie registris;
  • testide kĂ€ivitamisest konteineris vĂ€rskelt kokkupandud pildiga;
  • töökeskkonda juurutamisest sĂ”ltuvalt harust (dev/master).

Frontend

Fail deploy.yml front-end registrile ei erine palju tagumistest. Selles puudub testide kÀivitamise etapp ning muutuvad deploy tokenite nimed. Front-end registri saladused tuleb muide eraldi tÀita.

Selle seadistamine

Liikluse suunamine Nginx'i kaudu

Noh, oleme jÔudnud lÔpuni. JÀÀnud on vaid seadistada siseneva ja vÀljuva liikluse suunamine meie konteinerisse Nginx'i kaudu. Seda protsessi oleme juba kÀsitlenud punktis 5, kus seadistasime Docker Registry. Sama tuleb teha tagumise ja front-end osa jaoks dev- ja prod-keskkondades.

Toon vÀlja seadetest ekraanipildid.

Backend

CI/CD GitHub Actions projekti jaoks, mis kasutab Flaski ja Angularit

Frontend

CI/CD GitHub Actions projekti jaoks, mis kasutab Flaski ja Angularit
Oluline tĂ€psustus. Front-end konteinerisse suunatakse kĂ”ik URL-id, vĂ€lja arvatud need, mis algavad /api/ — need suunatakse tagumise konteineri poole (seetĂ”ttu peavad tagumise konteineri kĂ”ik töötlejate nimed algama /api/).

KokkuvÔte

NĂŒĂŒd peaks meie sait olema ligipÀÀsetav aadressidel helloworld.ru ja dev.helloworld.ru (vastavalt prod- ja dev-keskkond).

Nii, me Ôppisime, kuidas valmistada ette lihtsat rakendust Flaskis ja Angularis ning seadistada GitHub Actions'is torustik selle serverisse vÀlja toimetamiseks Pleski all.

Kordan lingid koodirepositooriumidele: tagumine osa, esimene osa.

Allikas: habr.com

Osta usaldusvÀÀrne veebihosting DDoS kaitsega, VPS VDS serverid đŸ”„ Osta usaldusvÀÀrne veebihosting DDoS kaitsega, VPS VDS serverid | ProHoster