ProHoster > Blog > uprava > CI/CD u Github radnjama za Flask+Angular projekt
CI/CD u Github radnjama za Flask+Angular projekt
U ovom ću članku podijeliti svoje iskustvo postavljanja CI/CD-a pomoću Plesk Control Panela i Github Actions. Danas ćemo naučiti kako implementirati jednostavan projekt s nekompliciranim imenom "Helloworld". Napisan je u okviru Flask Python, s Celery radnicima i Angular 8 sučeljem.
U prvom dijelu članka osvrnut ćemo se na naš projekt i njegove dijelove. U drugom ćemo smisliti kako postaviti Plesk i instalirati potrebna proširenja i komponente (DB, RabbitMQ, Redis, Docker itd.).
U trećem ćemo dijelu konačno otkriti kako postaviti cjevovod za implementaciju našeg projekta na poslužitelj u dev i prod okruženju. Zatim ćemo pokrenuti stranicu na poslužitelju.
I da, zaboravio sam se predstaviti. Moje ime je Oleg Borzov, fullstack sam programer u CRM timu za upravitelje hipotekarnih kredita u Domclicku.
Pregled projekta
Prvo, pogledajmo dva repozitorija projekta - pozadinsko i prednje - i prođimo preko koda.
Pozadina: Flask+Celery
Za stražnji dio uzeo sam hrpu koja je prilično popularna među Python programerima: okvir Flask (za API) i Celery (za red čekanja). SQLAchemy se koristi kao ORM. Alembic se koristi za migracije. Za JSON provjeru valjanosti u ručkama - Marshmallow.
В spremišta postoji datoteka Readme.md s detaljnim opisom strukture i uputama za pokretanje projekta.
API web-dijela prilično jednostavan, sastoji se od 6 olovaka:
/ping - provjeriti dostupnost;
ručke za registraciju, autorizaciju, deautorizaciju i dobivanje ovlaštenog korisnika;
rukovatelj e-poštom koji stavlja zadatak u red čekanja Celeryja.
Dio celera još lakše, postoji samo jedan problem send_mail_task.
docker s dvije Docker datoteke (base.dockerfile izgraditi rijetko promjenjivu osnovnu sliku i Dockerfile za glavne sklopove);
.env_files - s datotekama s varijablama okruženja za različita okruženja.
Postoje četiri docker-compose datoteke u korijenu projekta:
docker-compose.local.db.yml podići lokalnu bazu podataka za razvoj;
docker-compose.local.workers.yml za lokalno podizanje radnika, baza podataka, Redis i RabbitMQ;
docker-compose.test.yml za pokretanje testova tijekom implementacije;
docker-compose.yml za raspoređivanje.
I zadnja mapa koja nas zanima - .ci-cd. Sadrži skripte ljuske za implementaciju:
deploy.sh — pokretanje migracije i implementacije. Pokreće se na poslužitelju nakon izgradnje i pokretanja testova u Github Actions;
rollback.sh - vraćanje spremnika na prethodnu verziju sklopa;
curl_tg.sh - slanje obavijesti o implementaciji Telegramu.
Frontend na Angularu
Spremište s pročeljem mnogo jednostavniji od Beckovog. Prednjica se sastoji od tri stranice:
Glavna stranica s formom za slanje e-pošte i gumbom za izlaz.
Stranica za prijavu.
Stranica za registraciju.
Glavna stranica izgleda asketski:
Postoje dvije datoteke u korijenu Dockerfile и docker-compose.yml, kao i poznata mapa .ci-cd s nešto manje skripti nego u stražnjem repozitoriju (uklonjene skripte za pokretanje testova).
Pokretanje projekta u Plesku
Počnimo s postavljanjem Pleska i kreiranjem pretplate za našu stranicu.
Instaliranje proširenja
U Plesku su nam potrebna četiri proširenja:
Docker za upravljanje i vizualni prikaz statusa spremnika u Plesk administratorskoj ploči;
Git za konfiguriranje koraka postavljanja na poslužitelju;
Let's Encrypt za generiranje (i automatsko obnavljanje) besplatnih TLS certifikata;
Firewall za konfiguriranje filtriranja dolaznog prometa.
Možete ih instalirati putem administratorske ploče Plesk u odjeljku Proširenja:
Nećemo razmatrati detaljne postavke za proširenja, zadane postavke poslužit će za naše demo svrhe.
Stvorite pretplatu i stranicu
Zatim moramo kreirati pretplatu za našu web stranicu helloworld.ru i tamo dodati poddomenu dev.helloworld.ru.
Stvorite pretplatu za domenu helloworld.ru i navedite lozinku za prijavu za korisnika sustava:
Označite okvir na dnu stranice Osigurajte domenu uz Let's Encryptako želimo postaviti HTTPS za stranicu:
Zatim u ovoj pretplati kreirajte poddomenu dev.helloworld.ru (za koju također možete izdati besplatni TLS certifikat):
Instaliranje komponenti poslužitelja
Imamo server sa OS Debian Stretch 9.12 i instalirana upravljačka ploča Plesk Obsidian 18.0.27.
Moramo instalirati i konfigurirati za naš projekt:
PostgreSQL (u našem slučaju, bit će jedan poslužitelj s dvije baze podataka za dev i prod okruženja).
RabbitMQ (isto, ista instanca s različitim vhostovima za okruženja).
Dvije instance Redisa (za dev i prod okruženja).
Docker registar (za lokalnu pohranu izgrađenih Docker slika).
UI za Docker registar.
PostgreSQL
Plesk već dolazi s PostgreSQL DBMS-om, ali ne i najnovijom verzijom (u trenutku pisanja Plesk Obsidian podržan Postgres verzije 8.4–10.8). Želimo najnoviju verziju za našu aplikaciju (12.3 u vrijeme pisanja ovog teksta), pa ćemo je instalirati ručno.
Na netu ima dosta detaljnih uputa za instalaciju Postgresa na Debian (primjer), pa ih neću detaljno opisivati, samo ću dati naredbe:
S obzirom da PostgreSQL ima prilično osrednje zadane postavke, potrebno je ispraviti konfiguraciju. Ovo će nam pomoći kalkulator: trebate unijeti parametre vašeg poslužitelja i zamijeniti postavke u datoteci /etc/postgresql/12/main/postgresql.confna ponuđene. Ovdje treba napomenuti da takvi kalkulatori nisu čarobni metak, a bazu treba preciznije podesiti, na temelju vašeg hardvera, aplikacije i složenosti upita. Ali ovo je dovoljno za početak.
Osim postavki koje predlaže kalkulator, mi također mijenjamo postgresql.confzadani port 5432 na drugi (u našem primjeru - 53983).
Nakon promjene konfiguracijske datoteke ponovno pokrenite postgresql-poslužitelj naredbom:
service postgresql restart
Instalirali smo i konfigurirali PostgreSQL. Kreirajmo sada bazu podataka, korisnike za razvojna i proizvodna okruženja i dajmo korisnicima prava za upravljanje bazom podataka:
$ 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
Zec MQ
Prijeđimo na instaliranje RabbitMQ, brokera poruka za Celery. Instalacija na Debian je vrlo jednostavna:
Sada idemo instalirati i konfigurirati posljednju komponentu za našu aplikaciju - Redis. Koristit će se kao pozadina za pohranjivanje rezultata Celery zadataka.
Podići ćemo dva Docker spremnika s Redisom za dev i prod okruženja koristeći proširenje Docker za Plesk.
Idemo na Plesk, idemo na odjeljak Extensions, tražimo proširenje Docker i instaliramo ga (trebamo besplatnu verziju):
Idite na instalirano proširenje, pronađite sliku kroz pretraživanje redis bitnami i instalirajte najnoviju verziju:
Idemo u preuzeti spremnik i prilagođavamo konfiguraciju: navedite port, maksimalnu dodijeljenu veličinu RAM-a, lozinku u varijablama okruženja i montirajte volumen:
Izvodimo korake 2-3 za proizvodni spremnik, u postavkama mijenjamo samo parametre: port, lozinku, veličinu RAM-a i put do mape volumena na poslužitelju:
Docker registar
Osim osnovnih servisa, bilo bi lijepo na server postaviti vlastito spremište Docker slika. Srećom, prostor na poslužitelju sada je prilično jeftin (sigurno jeftiniji od pretplate na DockerHub), a postupak postavljanja privatnog repozitorija vrlo je jednostavan.
Kreirajmo dvije poddomene u Plesku u našoj pretplati: docker.helloworld.ru i docker-ui.helloworld.ru, i konfigurirajmo Let's Encrypt certifikate za njih.
Dodajte datoteku u mapu poddomene docker.helloworld.ru docker-compose.yml sa ovakvim sadržajem:
I moramo preusmjeriti Nginx na naše spremnike. To se može učiniti putem Pleska.
Za poddomene docker.helloworld.ru i docker-ui.helloworld.ru potrebno je napraviti sljedeće korake:
U odjeljku Dev Alati idite na našu stranicu Docker proxy pravila:
I dodajte pravilo za proxy dolazni promet u naš spremnik:
Provjeravamo možemo li se prijaviti u naš spremnik s lokalnog stroja:
$ 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
Provjerimo i rad poddomene docker-ui.helloworld.ru:
Kada kliknete na Pregledaj repozitorije, preglednik će prikazati prozor za autorizaciju u koji ćete morati unijeti korisničko ime i lozinku za repozitorij. Nakon toga bit ćemo preusmjereni na stranicu s popisom repozitorija (za sada će vam biti prazan):
Otvaranje portova u Plesk Firewallu
Nakon instaliranja i konfiguriranja komponenti, moramo otvoriti portove kako bi komponente bile dostupne iz Docker spremnika i vanjske mreže.
Pogledajmo kako to učiniti pomoću proširenja Firewall za Plesk koje smo ranije instalirali.
Ići Alati i postavke > Postavke > Vatrozid:
Ići Izmjena pravila Plesk vatrozida > Dodaj prilagođeno pravilo i otvorite sljedeće TCP portove za Docker podmrežu (172.0.0.0 / 8):
RabbitMQ: 1883, 4369, 5671-5672, 25672, 61613-61614
Redis: 32785, 32786
Također ćemo dodati pravilo koje će otvoriti PostgreSQL portove i RabbitMQ upravljačke panele vanjskom svijetu:
Primijenite pravila pomoću gumba Primijeni promjene:
Postavljanje CI/CD-a u Github radnjama
Prijeđimo na najzanimljiviji dio - postavljanje kontinuiranog integracijskog cjevovoda i isporuku našeg projekta na poslužitelj.
Ovaj cjevovod će se sastojati od dva dijela:
izrada slike i pokretanje testova (za backend) - na Github strani;
pokretanje migracija (za backend) i postavljanje spremnika - na poslužitelju.
Implementiraj u Plesk
Pozabavimo se prvo drugom točkom (jer prva ovisi o njoj).
Konfigurirat ćemo proces postavljanja pomoću Git proširenja za Plesk.
Razmotrite primjer s Prod okruženjem za Backend repozitorij.
Idemo na pretplatu naše web stranice Helloworld i idemo na pododjeljak Git:
Umetnite vezu na naše Github spremište u polje "Udaljeno Git spremište" i promijenite zadanu mapu httpdocs drugom (npr. /httpdocs/hw_back):
Kopirajte SSH javni ključ iz prethodnog koraka i dodajući nalazi se u Github postavkama.
Pritisnemo OK na ekranu u koraku 2, nakon čega smo prebačeni na stranicu repozitorija u Plesku. Sada moramo konfigurirati repozitorij da se ažurira pri predaji na glavnu granu. Da biste to učinili, idite na Postavke spremišta i spremite vrijednost Webhook URL (trebat će nam kasnije prilikom postavljanja Github akcija):
U polje Radnje na ekranu iz prethodnog odlomka unesite skriptu za pokretanje implementacije:
cd {REPOSITORY_ABSOLUTE_PATH}
.ci-cd/deploy.sh {ENV} {DOCKER_REGISTRY_HOST} {DOCKER_USER} {DOCKER_PASSWORD} {TG_BOT_TOKEN} {TG_CHAT_ID}
gdje je:
{REPOSITORY_ABSOLUTE_PATH} - put do mape prod pozadinskog repozitorija na poslužitelju; {ENV} - okruženje (dev / prod), u našem slučaju prod; {DOCKER_REGISTRY_HOST} - domaćin našeg docker repozitorija {TG_BOT_TOKEN} — Telegram bot token; {TG_CHAT_ID} — ID chata/kanala za slanje obavijesti.
Primjer skripte:
cd /var/www/vhosts/helloworld.ru/httpdocs/hw_back/
.ci-cd/deploy.sh dev docker.helloworld.ru docker_user docker_password 12345678:AAbcdEfghCH1vGbCasdfSAs0K5PALDsaw -1001234567890
Dodajte korisnika iz naše pretplate u Docker grupu (tako da mogu upravljati spremnicima):
sudo usermod -aG docker helloworld_admin
Dev okruženje za backend repozitorij i frontend postavljeni su na isti način.
Cjevovod implementacije u Github radnjama
Prijeđimo na postavljanje prvog dijela našeg CI/CD cjevovoda u Github Actions.
DEPLOY_HOST — host na kojem je dostupna administratorska ploča Plesk (primjer: helloworld.com: 8443 ili 123.4.56.78:8443);
DEPLOY_BACK_PROD_TOKEN - token za implementaciju u prod-repozitorij na poslužitelju (dobili smo ga u implementaciji u Plesku str. 4);
DEPLOY_BACK_DEV_TOKEN - token za implementaciju u dev repozitorij na poslužitelju.
Proces postavljanja je jednostavan i sastoji se od tri glavna koraka:
izrada i objavljivanje slike u našem repozitoriju;
izvođenje testova u spremniku na temelju svježe izgrađene slike;
implementacija u željeno okruženje ovisno o grani (dev/master).
Sučelje
Datoteka deploy.yml za prednje spremište malo drugačiji od Beckovog. Nedostaje mu korak s pokretanjem testova i mijenja nazive tokena za implementaciju. Tajne za prednje spremište, usput, potrebno je ispuniti zasebno.
Postavljanje web stranice
Proxy promet putem Nginxa
Eto, došli smo do kraja. Ostaje samo konfigurirati proxy dolaznog i odlaznog prometa u naš spremnik kroz Nginx. Već smo pokrili ovaj proces u 5. koraku postavljanja Docker registra. Isto treba ponoviti za stražnji i prednji dio u dev i prod okruženjima.
Dat ću snimke zaslona postavki.
Backend
Sučelje
Važnoe utočnenie. Svi URL-ovi bit će proslijeđeni u spremnik sučelja, osim onih koji počinju s /api/ - bit će proslijeđeni u stražnji spremnik (dakle u stražnjem spremniku, svi rukovatelji moraju započeti s /api/).
Rezultati
Sada bi naša stranica trebala biti dostupna na helloworld.ru i dev.helloworld.ru (prod i dev okruženja).
Sve u svemu, naučili smo kako pripremiti jednostavnu aplikaciju u Flasku i Angularu i postaviti cjevovod u Github Actions kako bismo je postavili na poslužitelj koji pokreće Plesk.
Duplicirat ću poveznice na repozitorije s kodom: pozadina, sučelje.