ProHoster > Bloc > Administració > Accions de GitHub com a CI/CD per a un lloc en un generador estàtic i pàgines de GitHub

Accions de GitHub com a CI/CD per a un lloc en un generador estàtic i pàgines de GitHub

Accions de GitHub com a CI/CD per a un lloc en un generador estàtic i pàgines de GitHub

Després d'haver buscat una mica Habr, em va sorprendre que s'hagin publicat molt pocs articles sobre el tema de la funció (beta) de GitHub: Accions.

Sembla que aquesta subestimació es pot explicar pel fet que la funcionalitat encara està en prova, encara que sigui "beta". Però és una característica útil de la beta que permet utilitzar aquesta eina en repositoris privats. Es tracta de treballar amb aquesta tecnologia de la qual parlaré en aquest article.

Prehistòria

Si comencem per ordre, probablement val la pena esmentar que en el procés de cerca d'una opció ràpida, còmoda, fàcil i gratuïta per emmagatzemar un lloc web personal "Sobre mi", vaig haver de passar diverses nits i revisar molts articles.

Algunes persones trien l'allotjament, d'altres un servidor al núvol, i els que no volen entendre el treball, la interacció i el pagament de tot això, com ara penjar llocs estàtics a un repositori, ja que ara es pot fer tant a GitHub com a GitLab.

Per descomptat, aquesta és una elecció personal de cadascú.

La meva opció final va ser GitHub Pages.

Sobre les pàgines

Qui no ho sap gh-pages - Es tracta d'una opció per emmagatzemar documentació en forma de web i s'ofereix de manera gratuïta i, a més de documentació, també es proposa emmagatzemar webs personals. Aquesta funcionalitat la proporciona GitHub a tots els usuaris i està disponible a la configuració del repositori.

El repositori del projecte utilitza una branca gh-pages, per a un lloc d'usuari: un repositori independent amb el nom username.github.io amb fonts del lloc a master branca.

Podeu veure més detalls en la documentació, però permeteu-me assenyalar que GitHub és sorprenentment generós a l'hora de permetre a qualsevol enllaçar el seu propi domini a un lloc així simplement afegint un fitxer CNAME amb el nom de domini i configurant el DNS del vostre proveïdor de domini als servidors de GitHub.

Estic segur que hi ha molts articles aquí sobre com desenvolupar aquest lloc, així que no és del que parlaré més endavant.

Problema sorgit

El problema era que quan s'utilitzava un generador estàtic, calia escriure scripts addicionals i utilitzar biblioteques per simplificar el procés de generació de pàgines i carregar-les al repositori. Simplement, si emmagatzemeu les fonts en un dipòsit privat separat, cada vegada que hi ha cap canvi al lloc, calia desplegar l'entorn local per a la generació posterior de pàgines estàtiques i la publicació al dipòsit principal del lloc.

Hi ha abundància generadors estàtics i tots tenen el mateix problema. Aquestes accions requereixen massa temps i esforç i, en última instància, frenen el treball al lloc, especialment després de diverses migracions del sistema operatiu al sistema operatiu o incidents amb pèrdua de dades en discs durs. (aquest va ser el cas en el meu cas).

Fa poc, ja sigui en una notificació emergent al lloc web o en un butlletí de GitHub, es va notar un CI/CD de nova creació, que va permetre dur a terme aquestes accions amb el mínim esforç.

Sobre els generadors de pàgines estàtiques

No centraré especial atenció en aquest subelement, però compartiré un parell de tesis a les quals vaig arribar durant la selecció i l'ús dels següents:

1) trieu un generador que s'adapti al vostre llenguatge de programació, o un que sigui el més clar possible. Vaig arribar a aquesta idea en un moment en què jo mateix havia d'afegir alguna funcionalitat perquè el lloc funcionés, afegir crosses per a la seva major estabilitat i automatització. A més, aquesta és una bona raó per escriure una funcionalitat addicional en forma de connectors;

2) quin generador triar és una elecció personal, però val la pena tenir en compte que per a la immersió inicial en el treball de la funcionalitat de les pàgines de GitHub, primer cal instal·lar Jekyll. Afortunadament, us permet generar un lloc web a partir de fonts directament al repositori (Repetiré això amb la meva elecció).

La meva elecció del generador es basa en el primer punt. pelicà que està escrit en Python va substituir fàcilment Jekyll, que em resulta estrany (el vaig fer servir durant gairebé un any). Com a resultat, fins i tot crear i editar articles i treballar en un lloc web ofereix experiència addicional en un idioma que m'interessa.

__

Declaració de problemes

La tasca principal serà escriure un script (en realitat un fitxer de configuració) que generi automàticament pàgines estàtiques des d'un dipòsit privat. La solució implicarà la funcionalitat d'un entorn virtual. El propi script afegirà pàgines ja fetes al repositori públic.

Eines per a la solució

Eines que utilitzarem per resoldre el problema:

  • Accions de GitHub;
  • Python3.7;
  • Pelicà;
  • Git;
  • Pàgines de GitHub.

La solució

Així, després de familiaritzar-se una mica amb la documentació i entendre com s'escriuen els scripts d'Accions, va quedar clar que aquest mecanisme resoldrà completament el problema que s'ha plantejat. En el moment d'escriure, us heu de subscriure per utilitzar aquesta funcionalitat. per a proves beta!

Accions de GitHub com a CI/CD per a un lloc en un generador estàtic i pàgines de GitHub
Descripció de la nova funcionalitat per part del mateix Github

L'escriptura d'un script d'Accions comença creant un fitxer amb nom en una carpeta .github i la seva subcarpeta workflows. Això es pot fer manualment o des de l'editor a la pestanya Accions de la pàgina del repositori.

Accions de GitHub com a CI/CD per a un lloc en un generador estàtic i pàgines de GitHub
Exemple de formulari de guió en blanc

Comentaré breument el formulari

name: CI    # название скрипта: будет отображаться во вкладке Actions

on: [push]  # действие, по которому запускается данный скрипт

jobs:       # роботы, которые будут выполняться
  build:    # сборка, которая..

    runs-on: ubuntu-latest      # ..будет запущена на основе этого образа

    steps:              # шаги которые будут проделаны после запуска образа
    - uses: actions/checkout@v1     # переход в самую актуальную ветку
    - name: Run a one-line script   # имя работы номер 1
      run: echo Hello, world!       # суть работы номер 1 (bash-команда записана в одну строку)
    - name: Run a multi-line script   # имя работы номер 2
      run: |                    # суть работы номер 2 (многострочная)
        echo Add other actions to build,
        echo test, and deploy your project.

Escrivim el nostre a partir de la plantilla:

0) També podeu deixar el nom "CI". És qüestió de gustos.

1) A continuació, heu de seleccionar l'acció/activador que llançarà l'script, en el nostre cas aquesta és l'empenta habitual d'una nova confirmació al repositori.

on:
  push

2) També deixarem la imatge sobre la base de la qual es llançarà l'script com a exemple, ja que Ubuntu està bastant satisfet amb la funcionalitat necessària. Mirant a eines disponibles queda clar que pot ser qualsevol imatge necessària o senzillament convenient (o un contenidor Docker basat en ella).

  build:
    runs-on: ubuntu-latest

3) En els passos, primer configurarem l'entorn per preparar-nos per al treball principal.

3.1) aneu a la branca que necessitem (pas estàndard checkout):

- uses: actions/checkout@v1

3.2) instal·leu Python:

    - name: Set up Python
      uses: actions/setup-python@v1
      with:
        python-version: 3.7

3.3) instal·lar les dependències del nostre generador:

    - name: Install dependencies
      run: |
          python -m pip install --upgrade pip
          pip install -r requirements.txt

3.4) crear un directori en el qual es generaran les pàgines del lloc:

   - name: Make output folder
      run: mkdir output

4) Per tal que el treball al lloc sigui coherent, és a dir, no esborrar canvis anteriors i poder afegir canvis al dipòsit del lloc sense conflictes, el següent pas serà clonar el dipòsit del lloc cada vegada:

   - name: Clone master branch
      run: git clone "https://${{ secrets.ACCESS_TOKEN }}@github.com/${GITHUB_ACTOR}/${GITHUB_ACTOR}.github.io.git" --branch master --single-branch ./output

Aquest pas crida variables del sistema:

  • variable GITHUB_ACTOR GitHub s'instal·la, i aquest és el nom d'usuari per culpa del qual es va llançar aquest script;
  • variable secrets.ACCESS_TOKEN això es genera testimoni per gestionar Github, podem passar-lo com a variable d'entorn configurant-lo a la pestanya Secrets la configuració del nostre repositori. Tingueu en compte que durant la generació el testimoni se'ns proporcionarà una vegada i no hi haurà més accés. Així com els valors dels articles Secrets.

5) Passem a generar les nostres pàgines:

   - name: Generate static pages
      run: pelican content -o output -s publishconf.py

Els paràmetres passats al generador són responsables del directori on s'enviaran els fitxers generats (-o output) i el fitxer de configuració que fem servir per generar (-s publishconf.py; Podeu llegir sobre l'enfocament per separar la configuració local i la configuració per a la publicació a la documentació de Pelican).

Permeteu-me que us recordi què hi ha a la nostra carpeta output El repositori del lloc ja s'ha clonat.

6) Configurem git i indexem els nostres fitxers modificats:

    - name: Set git config and add changes
      run: |
          git config --global user.email "${GITHUB_ACTOR}@https://users.noreply.github.com/"
          git config --global user.name "${GITHUB_ACTOR}"
          git add --all
      working-directory: ./output

En aquest punt, s'utilitza una variable ja coneguda i s'indica el directori de treball en el qual es llançaran les ordres d'aquest pas. L'ordre per anar al directori de treball seria semblant a - cd output.

7) Generem un missatge de confirmació, cometem els canvis i introduïm-los al repositori. Perquè la confirmació no sigui en va i, per tant, no produeixi un error a bash (el resultat de sortida no ho és 0): primer, comprovem si cal comprometre's i impulsar alguna cosa. Per fer-ho fem servir l'ordre git diff-index --quiet --cached HEAD -- que sortirà al terminal 0 si no hi ha canvis respecte a la versió anterior del lloc, i 1 hi ha aquests canvis. A continuació, processem el resultat d'aquesta comanda. Així, a la informació sobre l'execució de l'script, registrarem informació útil sobre l'estat del lloc en aquesta fase, en lloc de bloquejar-nos automàticament i enviar-nos un informe sobre l'error de l'script.

També realitzem aquestes accions al nostre directori amb pàgines ja fetes.

   - name: Push and send notification
      run: |
          COMMIT_MESSAGE="Update pages on $(date +'%Y-%m-%d %H:%M:%S')"
          git diff-index --quiet --cached HEAD -- && echo "No changes!" && exit 0 || echo $COMMIT_MESSAGE
          # Only if repo have changes
          git commit -m "${COMMIT_MESSAGE}"
          git push https://${{ secrets.ACCESS_TOKEN }}@github.com/${GITHUB_ACTOR}/${GITHUB_ACTOR}.github.io.git master
      working-directory: ./output

Resultat

Com a resultat, aquest script us permet no pensar en crear pàgines estàtiques. Afegint canvis directament a un repositori privat, ja sigui treballant amb git des de qualsevol sistema o creant un fitxer mitjançant la interfície web de GitHub, Actions ho farà tot ells mateixos. Si l'script es bloqueja de manera inesperada, s'enviarà una notificació al vostre correu electrònic.

Codi complet

Deixaré la meva versió de treball, en la qual l'últim pas afegeix enviar una notificació que s'ha enviat una confirmació al repositori principal.

S'utilitzen els secrets descrits anteriorment, on s'afegeix el testimoni del bot i l'identificador d'usuari al qual s'ha d'enviar el missatge.

name: Push content to the user's GitHub pages repository

on:
  push

jobs:
  build:
    runs-on: ubuntu-latest

    steps:
    - uses: actions/checkout@v1
    - name: Set up Python
      uses: actions/setup-python@v1
      with:
        python-version: 3.7
    - name: Install dependencies
      run: |
          python -m pip install --upgrade pip
          pip install -r requirements.txt
    - name: Make output folder
      run: mkdir output
    - name: Clone master branch
      run: git clone "https://${{ secrets.ACCESS_TOKEN }}@github.com/${GITHUB_ACTOR}/${GITHUB_ACTOR}.github.io.git" --branch master --single-branch ./output
    - name: Generate static pages
      run: pelican content -o output -s publishconf.py
    - name: Set git config and add changes
      run: |
          git config --global user.email "${GITHUB_ACTOR}@https://users.noreply.github.com/"
          git config --global user.name "${GITHUB_ACTOR}"
          git add --all
      working-directory: ./output
    - name: Push and send notification
      run: |
          COMMIT_MESSAGE="Update pages on $(date +'%Y-%m-%d %H:%M:%S')"
          git diff-index --quiet --cached HEAD -- && echo "No changes!" && exit 0 || echo $COMMIT_MESSAGE
          git commit -m "${COMMIT_MESSAGE}"
          git push https://${{ secrets.ACCESS_TOKEN }}@github.com/${GITHUB_ACTOR}/${GITHUB_ACTOR}.github.io.git master
          curl "https://api.telegram.org/bot${{ secrets.BOT_TOKEN }}/sendMessage?text=$COMMIT_MESSAGE %0ALook at ${GITHUB_ACTOR}.github.io %0ARepository%3A github.com/${GITHUB_ACTOR}/${GITHUB_ACTOR}.github.io&chat_id=${{ secrets.ADMIN_ID }}"
      working-directory: ./output

Captures de pantalla

Accions de GitHub com a CI/CD per a un lloc en un generador estàtic i pàgines de GitHub
El resultat d'una de les execucions que es mostra a la pestanya Accions del repositori d'origen

Accions de GitHub com a CI/CD per a un lloc en un generador estàtic i pàgines de GitHub
Missatge del bot sobre la finalització de l'script

links útils

Comprensió de les accions
Sintaxi de les accions
Llista de desencadenants
Opcions per a entorns virtuals
Pàgines Github
Llista de generadors estàtics

Font: www.habr.com

Afegeix comentari