Automatisoi mukautetun sisäänkirjautumisen käyttöliittymän käyttöönotto GitHub Actions -työnkulussa

Taustaa#

Logto on parempi valinta Customer Identity and Access Management (CIAM) -ratkaisuksi. Äskettäin lanseerasimme "Tuo oma käyttöliittymäsi" -ominaisuuden Logto Cloudissa, joka mahdollistaa kehittäjille sisäänkirjautumisen käyttöliittymän täydellisen mukauttamisen.

Aiemmassa blogikirjoituksessa annoimme myös vaihe vaiheelta oppaan oman sisäänkirjautumisen käyttöliittymän luomiseen, joka sisältää:

• Mukautetun sisäänkirjautumissivun kehittämisen koodinäytteillä
• @logto/tunnel CLI-työkalun asennuksen paikallista virheenkorjausta varten
• Mukautettujen käyttöliittymäresurssien rakentamisen ja pakkaamisen zip-tiedostoon
• Zip-paketin lataamisen ja käyttöönoton Logto Cloudissa Konsolin käyttöliittymän kautta

Kuitenkin DevOps-ajattelutavan omaavana sovelluskehittäjänä saatat pitää tätä prosessia työläänä tehdessäsi muutoksia mukautettuun sisäänkirjautumissivuun. Onko tapaa automatisoida koko prosessi?

Olemme kuunnelleet palautettanne ja olemme innoissamme voidessamme esitellä uuden deploy CLI-komennon @logto/tunnel -työkalussa. Tämä komento mahdollistaa käyttöönoton automatisoinnin suorittamalla komennon terminaalissa tai integroimalla se GitHub Actions -työnkulkuun, mikä on erityisen hyödyllistä CI/CD-putken rakentamisessa. Sukelletaanpa yksityiskohtiin!

Esivaatimukset#

Ennen kuin sukellamme asennukseen, varmista, että sinulla on seuraavat:

1. Logto Cloud -tili, johon on tilauspaketti.
2. Koneiden välinen sovellus Hallinnan API-oikeuksilla Logto-tenantissanne.
3. Projektisi lähdekoodi tulee olla GitHubissa.
4. Asenna @logto/tunnel CLI-työkalu projektisi kehitysriippuvuutena.

Vaihe 1: Luo GitHub Actions -työnkulku#

GitHub-repositoriossasi, luo uusi työnkulkutiedosto. Tämä voidaan tehdä navigoimalla .github/workflows/ ja luomalla tiedosto nimeltä deploy.yml.

Selitys GitHub Actions -työnkulusta#

• Laukaisin: Työnkulku laukaistaan jokaisella päähaaraan työntämisellä.
• Työt: Käyttöönotto-työ ajetaan uusimmassa Ubuntu-käyttöympäristössä, ja se suorittaa seuraavat vaiheet.
• Vaiheet:
  • Checkout code: Tämä vaihe haarukoittaa projektin koodin.
  • Set up Node.js: Tämä vaihe asettaa Node.js-ympäristön.
  • Install dependencies: Tämä vaihe asentaa projektisi riippuvuudet.
  • Build: Tämä vaihe rakentaa projektisi lähdekoodin html-tiedostoiksi. Oletetaan, että ulostulokansio on nimeltään dist juurihakemistossa.
  • Deploy to Logto Cloud: Tämä vaihe suorittaa Tunnel CLI -komennon, joka ottaa html-resurssit käyttöön ./dist-kansiosta Logto Cloud -tenantissasi. Se käyttää ympäristömuuttujia herkille tiedoille.

Lisätietoja GitHub Actionsista, tutustu GitHub Actions Documentation.

Vaihe 2: Määritä toiminnan salaisuudet GitHubissa#

Pidät tunnuksesi turvassa tallentamalla ne salaisuuksina GitHub-repositorioon:

1. Siirry GitHub-repositorioon.
2. Klikkaa "Settings".
3. Siirry kohtaan "Secrets and variables > Actions"
4. Klikkaa "New repository secret" ja lisää seuraavat salaisuudet:

• LOGTO_AUTH: Logto-koneiden välisten sovellusten tunnukset muodossa <m2m-app-id>:<m2m-app-secret>.
• LOGTO_ENDPOINT: Logto Cloud -päätepiste URI.
• LOGTO_RESOURCE: Logto-hallinnan API-resurssi-ilmaisin. Löytyy kohdasta "API resources -> Logto Management API". Tarvitaan, jos mukautettu verkkotunnus on käytössä Logto Cloud -tenantissasi.

Vaihe 3: Testaa työnkulkuasi#

Kun olet määrittänyt työnkulun ja konfiguroinut salaisuudet, voit testata sitä yhdistämällä PR:n päähaaraan. GitHub Actions -työnkulku laukeaa automaattisesti, ja mukautettu sisäänkirjautumiskäyttöliittymäsi otetaan käyttöön Logto Cloudissa.

Johtopäätös#

Integroimalla @logto/tunnel CLI-komento GitHub Actions -työnkulkuun voit virtaviivaistaa mukautetun sisäänkirjautumisen käyttöliittymän käyttöönottoa Logto Cloudiin. Tämä automatisointi mahdollistaa keskittymisen kehitystyöhön varmistamalla samalla, että muutokset testataan jatkuvasti elävässä ympäristössä.

Hyvää koodausta!