CI/CD a cikin Ayyukan Github don aikin Flask+Angular

CI/CD a cikin Ayyukan Github don aikin Flask+Angular
A cikin wannan labarin, zan raba gwaninta na kafa CI/CD ta amfani da Plesk Control Panel da Github Actions. A yau za mu koyi yadda za a tura wani aiki mai sauƙi tare da sunan marar rikitarwa "Helloworld". An rubuta shi a cikin tsarin Flask Python, tare da ma'aikatan Celery da Angular 8 gaba.

Hanyoyin haɗi zuwa wuraren ajiya: baya, gaba.

A kashi na farko na labarin, za mu dubi aikinmu da sassansa. A cikin na biyu, za mu gano yadda ake saita Plesk da shigar da kari da abubuwan da ake buƙata (DB, RabbitMQ, Redis, Docker, da sauransu).

A kashi na uku, a ƙarshe za mu gano yadda za a kafa bututun mai don tura aikin mu zuwa uwar garke a cikin yanayin dev da prod. Sannan za mu kaddamar da shafin akan uwar garken.

Kuma eh, na manta gabatar da kaina. Sunana Oleg Borzov, Ni cikakken mai haɓakawa ne a cikin ƙungiyar CRM don manajojin jinginar gida a Domclick.

Bayanin aikin

Da farko, bari mu kalli wuraren ajiyar ayyukan guda biyu - baya da gaba - sannan mu wuce lambar.

Bayani: Flask+Celery

Don ɓangaren baya, na ɗauki gungu wanda ya shahara tsakanin masu haɓaka Python: tsarin Flask (na API) da Celery (don layin ɗawainiya). Ana amfani da SQLAchemy azaman ORM. Ana amfani da Alembic don ƙaura. Don ingantaccen JSON a cikin hannaye - Marshmallow.

В wuraren ajiya akwai fayil ɗin Readme.md tare da cikakken bayanin tsari da umarnin gudanar da aikin.

Sashen Yanar Gizo API wanda ba shi da wahala sosai, ya ƙunshi alƙalami guda 6:

  • /ping - don duba samuwa;
  • rike don rajista, izini, izni da samun izini mai amfani;
  • hannun imel wanda ke sanya ɗawainiya a cikin jerin gwanon Celery.

Seleri part ko da sauki, akwai matsala daya kawai send_mail_task.

A babban fayil /conf akwai manyan manyan fayiloli guda biyu:

  • docker tare da Dockerfiles guda biyu (base.dockerfile don gina hoton tushe da ba kasafai ke canzawa ba kuma Dockerfile don manyan majalisu);
  • .env_files - tare da fayiloli tare da masu canjin yanayi don mahalli daban-daban.

Akwai fayilolin docker guda huɗu a tushen aikin:

  • docker-compose.local.db.yml don tayar da bayanan gida don ci gaba;
  • docker-compose.local.workers.yml don haɓaka gida na ma'aikaci, bayanai, Redis da RabbitMQ;
  • docker-compose.test.yml don gudanar da gwaje-gwaje yayin turawa;
  • docker-compose.yml domin turawa.

Kuma babban fayil ɗin da muke sha'awar - .ci-cd. Ya ƙunshi rubutun harsashi don turawa:

  • deploy.sh - ƙaddamar da ƙaura da turawa. Yana gudana akan sabar bayan ginawa da gwaje-gwaje masu gudana a Github Actions;
  • rollback.sh - jujjuya kwantena zuwa sigar da ta gabata ta taron;
  • curl_tg.sh - aika sanarwar turawa zuwa Telegram.

Gaba akan Angular

Wurin ajiya tare da gaba yafi sauki fiye da na Beck. Gaban ya ƙunshi shafuka uku:

  • Babban shafi tare da fom don aika imel da maɓallin fita.
  • Shafin shiga.
  • Shafin rajista.

Babban shafin yana kallon ascetic:

CI/CD a cikin Ayyukan Github don aikin Flask+Angular
Akwai fayiloli guda biyu a tushen Dockerfile и docker-compose.yml, da kuma babban fayil ɗin da aka saba .ci-cd tare da ƙananan rubutun fiye da na baya (cire rubutun don gwaje-gwaje masu gudana).

Fara aiki a Plesk

Bari mu fara da kafa Plesk da ƙirƙirar biyan kuɗi don rukunin yanar gizon mu.

Shigar da kari

A cikin Plesk, muna buƙatar kari huɗu:

  • Docker don sarrafawa da kuma gani na gani matsayi na kwantena a cikin Plesk admin panel;
  • Git don saita matakin turawa akan sabar;
  • Let's Encrypt don ƙirƙirar (da sabuntawa ta atomatik) takaddun shaida na TLS kyauta;
  • Firewall don saita tace zirga-zirga masu shigowa.

Kuna iya shigar da su ta hanyar Plesk admin panel a cikin sashin Extensions:

CI/CD a cikin Ayyukan Github don aikin Flask+Angular
Ba za mu yi la'akari da cikakken saitunan don kari ba, saitunan tsoho za su yi don dalilai na demo.

Ƙirƙiri biyan kuɗi da rukunin yanar gizo

Na gaba, muna buƙatar ƙirƙirar biyan kuɗi don gidan yanar gizon mu na helloworld.ru kuma ƙara ƙaramin yanki na dev.helloworld.ru a can.

  1. Ƙirƙiri biyan kuɗi don yankin helloworld.ru kuma saka kalmar shiga-kalmar shiga don mai amfani da tsarin:

    CI/CD a cikin Ayyukan Github don aikin Flask+Angular
    Duba akwatin da ke ƙasan shafin Aminta yankin tare da Bari Mu Encryptidan muna son saita HTTPS don rukunin yanar gizon:

    CI/CD a cikin Ayyukan Github don aikin Flask+Angular

  2. Na gaba, a cikin wannan biyan kuɗi, ƙirƙiri reshen yanki dev.helloworld.ru (wanda kuma zaku iya ba da takardar shaidar TLS kyauta):

    CI/CD a cikin Ayyukan Github don aikin Flask+Angular

Shigar da Abubuwan Sabar

Muna da uwar garken tare da OS Debian Stretch 9.12 da kuma shigar da kula da panel Plesk Obsidian 18.0.27.

Muna buƙatar girka da daidaita aikin mu:

  • PostgreSQL (a cikin yanayinmu, za a sami sabar guda ɗaya tare da bayanan bayanai guda biyu don yanayin dev da prod).
  • RabbitMQ (daidai, misali guda tare da vhosts daban-daban don mahalli).
  • Misalai na Redis guda biyu (don mahallin dev da prod).
  • Docker Registry (don ajiyar gida na ginanniyar hotunan Docker).
  • UI don rajistar Docker.

PostgreSQL

Plesk ya riga ya zo tare da PostgreSQL DBMS, amma ba sabon sigar ba (a lokacin rubuta Plesk Obsidian goyon baya Sigar Postgres 8.4-10.8). Muna son sabon sigar aikace-aikacen mu (12.3 a lokacin wannan rubutun), don haka za mu shigar da shi da hannu.

Akwai cikakkun bayanai da yawa don shigar da Postgres akan Debian akan yanar gizo (misali), don haka ba zan kwatanta su dalla-dalla ba, zan ba da umarni kawai:

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

Yin la'akari da cewa PostgreSQL yana da saitunan tsoho na tsaka-tsaki, ya zama dole a gyara saitin. Wannan zai taimake mu kalkuleta: kuna buƙatar tuƙi a cikin sigogin uwar garken ku kuma maye gurbin saituna a cikin fayil ɗin /etc/postgresql/12/main/postgresql.confga wadanda aka bayar. Ya kamata a lura a nan cewa irin waɗannan ƙididdiga ba harsashi ne na sihiri ba, kuma ya kamata a daidaita tushen tushe daidai, dangane da kayan aikinku, aikace-aikacenku, da ƙwarewar tambaya. Amma wannan ya isa farawa.

Baya ga saitunan da kalkuleta ya gabatar, muna kuma canzawa postgresql.conftsohuwar tashar jiragen ruwa 5432 zuwa wani (a cikin misalinmu - 53983).

Bayan canza fayil ɗin sanyi, sake farawa postgresql-uwar garken tare da umarnin:

service postgresql restart

Mun shigar kuma mun saita PostgreSQL. Yanzu bari mu ƙirƙiri bayanan bayanai, masu amfani don mahallin dev da prod, kuma mu ba masu amfani haƙƙoƙin sarrafa bayanan:

$ 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

Bari mu matsa zuwa shigar RabbitMQ, dillalin saƙo don Celery. Shigar da shi akan Debian abu ne mai sauƙi:

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

Bayan shigarwa, muna buƙatar ƙirƙirar vhosts, masu amfani da ba da haƙƙoƙin da suka dace:

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

Yanzu bari mu girka kuma saita sashin ƙarshe don aikace-aikacen mu - Redis. Za a yi amfani da shi azaman baya don adana sakamakon ayyukan Celery.

Za mu ɗaga kwantena Docker guda biyu tare da Redis don mahallin dev da prod ta amfani da tsawo Docker don Plesk.

  1. Mun je Plesk, je zuwa sashin Extensions, nemo tsawo na Docker kuma shigar da shi (muna buƙatar sigar kyauta):

    CI/CD a cikin Ayyukan Github don aikin Flask+Angular

  2. Je zuwa tsawo da aka shigar, nemo hoton ta hanyar bincike redis bitnami kuma shigar da sabon sigar:

    CI/CD a cikin Ayyukan Github don aikin Flask+Angular

  3. Muna shiga cikin kwandon da aka zazzage kuma mu daidaita tsarin: saka tashar jiragen ruwa, matsakaicin girman RAM da aka keɓe, kalmar sirri a cikin masu canjin yanayi, kuma mu hau ƙarar:

    CI/CD a cikin Ayyukan Github don aikin Flask+Angular

  4. Muna yin matakai 2-3 don akwati na samfur, a cikin saitunan kawai muna canza sigogi: tashar jiragen ruwa, kalmar sirri, girman RAM da hanyar zuwa babban fayil ɗin girma akan sabar:

    CI/CD a cikin Ayyukan Github don aikin Flask+Angular

Docker Registry

Baya ga ayyuka na asali, zai yi kyau a saka ma'ajiyar hoton Docker naku akan sabar. Abin farin ciki, sararin uwar garken yanzu yana da arha (hakika mai rahusa fiye da biyan kuɗin DockerHub), kuma tsarin kafa ma'ajiyar sirri yana da sauƙi.

Muna son samun:

Don yin wannan:

  1. Bari mu ƙirƙiri yanki guda biyu a cikin Plesk a cikin biyan kuɗinmu: docker.helloworld.ru da docker-ui.helloworld.ru, kuma saita Mu Encrypt takaddun shaida gare su.
  2. Ƙara fayil ɗin zuwa babban fayil ɗin yanki na docker.helloworld.ru docker-compose.yml da abun ciki kamar haka:
    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. A ƙarƙashin SSH, za mu samar da fayil ɗin .htpasswd don Izini na asali a cikin ma'ajiyar Docker:
    htpasswd -bBc .htpasswd hw_docker_admin hw_docker_password
  4. Tattara da ɗaga kwantena:
    docker-compose up -d
  5. Kuma muna buƙatar tura Nginx zuwa kwantenanmu. Ana iya yin hakan ta hanyar Plesk.

Ana buƙatar aiwatar da matakai masu zuwa don docker.helloworld.ru da docker-ui.helloworld.ru subdomains:

sashe Kayayyakin Dev shafin mu je zuwa Docker Proxy Docker:

CI/CD a cikin Ayyukan Github don aikin Flask+Angular
Kuma ƙara ƙa'ida zuwa hanyar zirga-zirgar wakili mai shigowa cikin kwandon mu:

CI/CD a cikin Ayyukan Github don aikin Flask+Angular

  1. Mun duba cewa za mu iya shiga cikin kwandon mu daga injin gida:
    $ 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. Bari kuma mu duba aikin reshen yanki na docker-ui.helloworld.ru:

    CI/CD a cikin Ayyukan Github don aikin Flask+Angular
    Lokacin da ka danna Ma'ajiyar Bincike, mai lilo zai nuna taga izini inda za ka buƙaci shigar da sunan mai amfani da kalmar wucewa don ma'ajiyar. Bayan haka, za a tura mu zuwa wani shafi mai jerin ma'ajiyar ajiya (a yanzu, zai zama fanko a gare ku):

    CI/CD a cikin Ayyukan Github don aikin Flask+Angular

Buɗe tashoshin jiragen ruwa a cikin Plesk Firewall

Bayan shigarwa da daidaita abubuwan da aka gyara, muna buƙatar buɗe tashoshin jiragen ruwa don abubuwan da aka haɗa su sami damar daga kwantena Docker da cibiyar sadarwar waje.

Bari mu ga yadda ake yin wannan ta amfani da tsawo na Firewall don Plesk da muka shigar a baya.

  1. Je zuwa Kayan aiki & Saituna > Saituna > Firewall:
    CI/CD a cikin Ayyukan Github don aikin Flask+Angular
  2. Je zuwa Gyara Dokokin Gidan Wuta na Plesk > Ƙara Dokokin Al'ada kuma buɗe tashoshin TCP masu zuwa don tashar Docker subnet (172.0.0.0 / 8):
    RabbitMQ: 1883, 4369, 5671-5672, 25672, 61613-61614
    Saukewa: 32785

    CI/CD a cikin Ayyukan Github don aikin Flask+Angular

  3. Hakanan za mu ƙara ƙa'idar da za ta buɗe tashoshin jiragen ruwa na PostgreSQL da bangarorin gudanarwa na RabbitMQ zuwa duniyar waje:

    CI/CD a cikin Ayyukan Github don aikin Flask+Angular

  4. Aiwatar da dokokin ta amfani da maɓallin Canje-canje:

    CI/CD a cikin Ayyukan Github don aikin Flask+Angular

Saita CI/CD a cikin Ayyukan Github

Bari mu gangara zuwa mafi ban sha'awa sashi - kafa bututun haɗin kai mai ci gaba da isar da aikin mu ga uwar garken.

Wannan bututun zai ƙunshi sassa biyu:

  • gina hoto da gwaje-gwaje masu gudana (na baya) - a gefen Github;
  • Gudun ƙaura (na baya) da jigilar kwantena - akan sabar.

Aika zuwa Plesk

Mu fara magana da batu na biyu (saboda na farko ya dogara da shi).

Za mu saita tsarin turawa ta amfani da tsawo na Git don Plesk.

Yi la'akari da misali tare da yanayin Prod don wurin ajiyar baya.

  1. Muna zuwa biyan kuɗin gidan yanar gizon mu na Helloworld kuma je zuwa sashin Git:

    CI/CD a cikin Ayyukan Github don aikin Flask+Angular

  2. Saka hanyar haɗi zuwa ma'ajiyar mu ta Github cikin filin "Remote Git repository" kuma canza babban fayil ɗin tsoho. httpdocs ga wani (misali. /httpdocs/hw_back):

    CI/CD a cikin Ayyukan Github don aikin Flask+Angular

  3. Kwafi maɓallin Jama'a na SSH daga mataki na baya kuma kara yana cikin saitunan Github.
  4. Danna Ok akan allo a mataki na 2, bayan haka za a tura mu zuwa shafin ma'adana a Plesk. Yanzu muna buƙatar saita ma'ajiyar da za a sabunta akan sadaukarwa ga reshen babban. Don yin wannan, je zuwa Saitunan ajiya kuma ajiye darajar Webhook URL (za mu buƙaci shi daga baya lokacin kafa Ayyukan Github):

    CI/CD a cikin Ayyukan Github don aikin Flask+Angular

  5. A cikin filin Ayyuka akan allon daga sakin layi na baya, shigar da rubutun don ƙaddamar da turawa:
    cd {REPOSITORY_ABSOLUTE_PATH}
    .ci-cd/deploy.sh {ENV} {DOCKER_REGISTRY_HOST} {DOCKER_USER} {DOCKER_PASSWORD} {TG_BOT_TOKEN} {TG_CHAT_ID} 

    inda:

    {REPOSITORY_ABSOLUTE_PATH} - hanya zuwa babban fayil na prod na ajiyar baya akan sabar;
    {ENV} - muhalli (dev / prod), a cikin yanayinmu prod;
    {DOCKER_REGISTRY_HOST} - rundunar ma'ajiyar docker namu
    {TG_BOT_TOKEN} - Alamar bot ta Telegram;
    {TG_CHAT_ID} - ID na taɗi/tashar don aika sanarwa.

    Misalin rubutun:

    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. Ƙara mai amfani daga biyan kuɗin mu zuwa ƙungiyar Docker (don su iya sarrafa kwantena):
    sudo usermod -aG docker helloworld_admin

An saita yanayin dev don ma'ajiyar baya da gaban gaba ta hanya ɗaya.

Bututun turawa a Github Actions

Mu ci gaba zuwa kafa sashin farko na bututun mu na CI/CD a Github Actions.

backend

An bayyana bututun a cikin deploy.yml fayil.

Amma kafin mu fayyace shi, bari mu cika sauye-sauyen Asirin da muke bukata a Github. Don yin wannan, je zuwa Saituna -> Asirin:

  • DOCKER_REGISTRY - mai masaukin kayan ajiyar Docker (docker.helloworld.ru);
  • DOCKER_LOGIN - shiga wurin ajiyar Docker;
  • DOCKER_PASSWORD - kalmar sirri zuwa gare shi;
  • DEPLOY_HOST - Mai watsa shiri inda Plesk admin panel ke samuwa (misali: helloworld.com: 8443o ku 123.4.56.78:8443);
  • DEPLOY_BACK_PROD_TOKEN - alama don ƙaddamarwa zuwa wurin ajiyar kayan aiki akan uwar garke (mun samo shi a cikin Ƙaddamarwa a Plesk p. 4);
  • DEPLOY_BACK_DEV_TOKEN - alama don turawa zuwa ma'ajiyar dev akan sabar.

Tsarin turawa abu ne mai sauƙi kuma ya ƙunshi manyan matakai guda uku:

  • ginawa da buga hoton a cikin ma'ajiyar mu;
  • gudanar da gwaje-gwaje a cikin akwati dangane da sabon hoton da aka gina;
  • turawa zuwa yanayin da ake so dangane da reshe (dev / master).

Frontend

Fayil na deploy.yml don ma'ajiyar gaba kadan daban da na Beck. Ba shi da mataki tare da gwaje-gwaje masu gudana kuma yana canza sunayen alamomi don turawa. Asirin don ajiya na gaba, ta hanya, yana buƙatar cika daban.

Saitin rukunin yanar gizo

Gudanar da zirga-zirga ta hanyar Nginx

To, mun zo karshe. Ya rage kawai don saita wakilcin zirga-zirgar ababen hawa da masu fita zuwa akwati ta Nginx. Mun riga mun rufe wannan tsari a mataki na 5 na saitin rajistar Docker. Ya kamata a maimaita iri ɗaya don sassa na baya da na gaba a cikin wuraren dev da prod.

Zan samar da hotunan saitunan.

backend

CI/CD a cikin Ayyukan Github don aikin Flask+Angular

Frontend

CI/CD a cikin Ayyukan Github don aikin Flask+Angular
Bayani mai mahimmanci. Duk URLs za su kasance masu alaƙa da akwati na gaba, sai waɗanda ke farawa da su /api/ - za a ba da su zuwa ga akwati na baya (so a cikin akwati na baya, duk masu sarrafa dole ne su fara da /api/).

Sakamakon

Yanzu ya kamata shafinmu ya kasance a helloworld.ru da dev.helloworld.ru (prod- da dev-environments, bi da bi).

Gabaɗaya, mun koyi yadda ake shirya aikace-aikace mai sauƙi a cikin Flask da Angular kuma mun kafa bututun a Github Actions don mirgine shi zuwa uwar garken da ke gudana Plesk.

Zan kwafi hanyoyin haɗin kai zuwa ma'ajin tare da lambar: baya, gaba.

source: www.habr.com

Add a comment