Γωνιακή - Πώς να διαβάσετε πληροφορίες περιβάλλοντος κατά τη διάρκεια εκτέλεσης για CI / CD

Εάν χρησιμοποιείτε το NGINX ως διακομιστή ιστού και Kubernetes για την ανάπτυξη

Φωτογραφία από τον Tim Gouw στο Unsplash

Το Angular παρέχει επιλογές διαμόρφωσης κατά τη διάρκεια της κατασκευής, πράγμα που σημαίνει ότι πρέπει να ορίσετε διαφορετικά αρχεία περιβάλλοντος για κάθε περιβάλλον και το Angular λαμβάνει τις κατάλληλες ρυθμίσεις κατά την κατασκευή του έργου, παρέχοντας τη σημαία - διαμόρφωσης στο build ng. Μπορείτε να δείτε αυτό το άρθρο σχετικά με την ανάγνωση των πληροφοριών περιβάλλοντος κατά τη διάρκεια της κατασκευής.

Όμως, η μεθοδολογία δώδεκα παραγόντων και οι στρατηγικές DevOps του σήμερα υποδηλώνουν ότι πρέπει να χτίσουμε μία φορά και να τρέξουμε παντού, πράγμα που σημαίνει ότι θα έχετε μόνο μία ευκαιρία να παράσχετε αρχείο ρυθμίσεων. Οι επιλογές γωνιακής διαμόρφωσης δεν επαρκούν. Πρέπει να παρέχετε πληροφορίες διαμόρφωσης ή περιβάλλοντος κατά το χρόνο εκτέλεσης. Σε αυτήν την ανάρτηση, θα δούμε πώς μπορούμε να το επιτύχουμε και να διαβάσουμε τις ρυθμίσεις διαμόρφωσης ή πληροφορίες περιβάλλοντος κατά το χρόνο εκτέλεσης.

  • Παράδειγμα έργου
  • Το πρόβλημα που αντιμετωπίζουμε
  • Λύση
  • Εκτέλεση
  • Πώς να Debug
  • Περίληψη
  • συμπέρασμα

Παράδειγμα έργου

Ακολουθεί ένα παράδειγμα έργου για την επίδειξη. Μπορείτε να το κλωνοποιήσετε και να το εκτελέσετε στο μηχάνημά σας.

// κλωνοποιήστε τον κλώνο του έργου git https://github.com/bbachi/angular-envread-runtime.git
// για τοπική ανάπτυξη npm install npm start

Πρόκειται για ένα απλό γωνιακό έργο το οποίο φορτώνει το αρχείο διαμόρφωσης app.config.json από το φάκελο / assets.

Χρησιμοποιούμε το APP_INITIALIZER για να φορτώσετε αυτό το αρχείο app.config.json πριν από την εκκίνηση και να χρησιμοποιήσετε αυτές τις ρυθμίσεις. Ακολουθούν τα αρχεία app.module.ts και app.service.ts.

Μόλις φορτώσετε τις ρυθμίσεις και μπορείτε να διαβάσετε αυτές τις ρυθμίσεις στο app.component.ts όπως παρακάτω.

Με βάση τη διαμόρφωση, μπορείτε να δείτε το χρώμα κεφαλίδας, την επικεφαλίδα και τον πίνακα. Για παράδειγμα, εάν πρόκειται για περιβάλλον ανάπτυξης, το χρώμα κεφαλίδας είναι μαύρο και η επικεφαλίδα είναι ανάπτυξη. Μπορείτε να δείτε μια παρόμοια οθόνη όπως παρακάτω.

ανάπτυξης

Εάν αλλάξετε το χρώμα φόντου και την επικεφαλίδα στο κόκκινο και την παραγωγή αντίστοιχα. Μπορείτε να δείτε μια οθόνη όπως παρακάτω.

οθόνη παραγωγής

Το πρόβλημα που αντιμετωπίζουμε

Η μεθοδολογία των δώδεκα παραγόντων υποδεικνύει ότι πρέπει να χτίσουμε μια φορά να τρέξουμε οπουδήποτε, αλλά σε αυτή την περίπτωση, χτίζουμε για κάθε περιβάλλον. Για απλότητα, εξετάζουμε μόνο δύο περιβάλλοντα ανάπτυξης και παραγωγής. Δεδομένου ότι εξυπηρετούμε την εφαρμογή Γωνιακή με το NGINX και μπορούμε να προσφέρουμε μόνο διαμόρφωση σε χρόνο κατασκευής παρά σε χρόνο εκτέλεσης. Δεν μπορούμε ακόμη να παρέχουμε μεταβλητές περιβάλλοντος στην έκδοση, αφού το πρόγραμμα περιήγησης δεν διαβάζει ούτε αυτές τις μεταβλητές περιβάλλοντος.

Πέρασμα διαμόρφωσης κατά την κατασκευή χρόνου

Κτίζουμε για κάθε περιβάλλον επειδή έπρεπε να περάσουμε συγκεκριμένες περιβαλλοντικές πληροφορίες κατά την κατασκευή. Πρέπει να βρούμε έναν τρόπο με τον οποίο πρέπει να περάσουμε αυτές τις πληροφορίες στο χρόνο εκτέλεσης. Αν περάσουμε στο χρόνο εκτέλεσης, πρέπει να χτίσουμε μία φορά και να τρέξουμε οπουδήποτε, όπως βλέπουμε στο παρακάτω διάγραμμα.

Περνώντας τη διαμόρφωση κατά την εκτέλεση του χρόνου

Λύση

Ας δούμε πώς μπορούμε να λύσουμε αυτό το πρόβλημα. Ένας τρόπος για να επιλύσετε αυτό είναι να διαβάσετε τη διεύθυνση URL του προγράμματος περιήγησης με το παράθυρο location.href και να βάλετε όλες τις παραμέτρους στην εφαρμογή και να φορτώσετε κατάλληλη διαμόρφωση βασισμένη σε κάποιο συγκεκριμένο τμήμα της διεύθυνσης URL όπως dev, prod, κλπ.

Αν χρησιμοποιείτε Java ή Nodejs με την εφαρμογή Γωνιακό, μπορούμε να λάβουμε αυτή τη μορφή διαμόρφωσης από τον διακομιστή πριν από την εκκίνηση της εφαρμογής με το APP_INITIALIZER. Αλλά πώς θα το κάνουμε αυτό εάν χρησιμοποιούμε το NGINX ως τον εξυπηρετητή ιστού;

Μπορούμε να χρησιμοποιήσουμε το Kubernetes configmap για να εγχύσουμε διαμόρφωση στον τόμο Pods, ο οποίος είναι τοποθετημένος στο φάκελο / usr / share / nginx / html / assets έτσι ώστε η εφαρμογή Γωνιακό να το λάβει πριν ξεκινήσει η εφαρμογή με τη βοήθεια του APP_INITIALIZER. Ας δούμε το παρακάτω διάγραμμα για να κατανοήσουμε καλύτερα.

Ανάγνωση διαμόρφωσης κατά το χρόνο εκτέλεσης χρησιμοποιώντας το configmap

Εκτέλεση

Ας εφαρμόσουμε τη λύση με το αντικείμενο Kubernetes configMap. Το αντικείμενο ConfigMap κάνει τα κιβώτια σας φορητά αποσυνδέοντας τις ρυθμίσεις από αυτά. Ετσι δουλεύει.

Το πρώτο πράγμα που πρέπει να κάνουμε είναι να χτίσουμε την εικόνα του docker και να τον σπρώξουμε στο DockerHub. Ακολουθεί το Dockerfile πολλαπλών σταδίων, το οποίο κατασκευάζει την εφαρμογή Γλώσσας στο πρώτο στάδιο και λαμβάνει αυτά τα στατικά στοιχεία και το βάζει στον ριζικό φάκελο του NGINX.

Αυτές είναι οι οδηγίες για την κατασκευή της εικόνας Docker και την ώθηση στο DockerHub. Μπορείτε να το δείτε στο DockerHub στην παρακάτω εικόνα. Αυτή είναι μια δημόσια εικόνα που μπορείτε να την τραβήξετε απευθείας από το μητρώο.

// οικοδομήστε το build docker εικόνας -t bbachin1 / envdemo.
// προβολή εικόνων εικόνων docker
// συνδεθείτε και να το σπρώξετε στο docker κόμβος docker login bockin1 / envdemo
Docker Hub

Τώρα πρέπει να δημιουργήσουμε αντικείμενα ανάπτυξης, υπηρεσιών και configmap. θέτουμε όλα αυτά τα αντικείμενα σε ένα αρχείο που ονομάζεται manifest.yml. Δημιουργούμε πρώτα το Configmap με τον απαιτούμενο config.json. Αν κοιτάξετε το αντικείμενο ανάπτυξης το Kubernetes τραβά την παραπάνω εικόνα bbachin1 / envdemo από το Docker Hub και δημιουργεί 5 αντίγραφα. Τέλος, έχουμε ένα αντικείμενο υπηρεσίας με τον τύπο Nodeport που εκθέτει στον έξω κόσμο.

Έχουμε φορτώσει το configmap στον τόμο που είναι τοποθετημένος στο path / usr / share / nginx / html / assets / folder. Δημιουργούμε όλα αυτά τα αντικείμενα στην ανάπτυξη του χώρου ονομάτων.

Ακολουθούν οι οδηγίες για τη δημιουργία αντικειμένων και την επαλήθευση τους.

// δημιουργία αντικειμένων kubectl δημιουργία -f manifest.yml
// διαγραφή αντικειμένων kubectl delete -f manifest.yml
// να πάρει την ανάπτυξη του kubectl να αναπτυχθεί -n ανάπτυξη
// πάρτε την υπηρεσία kubectl get svc -n ανάπτυξη
// να πάρει το pods kubectl get po-n ανάπτυξη

Αποκτήστε τη δημόσια διεύθυνση Kubernetes από αυτήν την εντολή kubectl cluster-info και αποκτήστε τη θύρα από το αντικείμενο της υπηρεσίας kubectl get svc -n ανάπτυξη και αποκτήστε πρόσβαση στην εφαρμογή που τρέχει στο χώρο ονομάτων ανάπτυξης με αυτή τη διεύθυνση http: // : / appui

λιμάνι υπηρεσίας και δημόσια διεύθυνση

Στην παραπάνω περίπτωση, μπορείτε να αποκτήσετε πρόσβαση στην εφαρμογή στη διεύθυνση http://192.168.64.6:31935/appui Βεβαιωθείτε ότι έχετε αλλάξει από https σε http. Παρατηρήστε ότι όλες οι ρυθμίσεις είναι φορτωμένες από το configmap, όπως BackgroundColor header, title, κλπ.

Εκτελέστε την ανάπτυξη στο Minikube

Ας δημιουργήσουμε την ανάπτυξη παραγωγής από το αρχείο manifest-prod.yml και ακολουθήστε τα παραπάνω βήματα για να εκτελέσετε την εφαρμογή στην τοπική σας συσκευή.

// δημιουργία αντικειμένων kubectl create -f manifest-prod.yml
// διαγραφή αντικειμένων kubectl delete -f manifest-prod.yml
// να πάρει την ανάπτυξη kubectl να αναπτύξει -n παραγωγή
// πάρτε την υπηρεσία kubectl get svc -n παραγωγή
// πάρτε τα κουτάκια kubectl πάρτε po -n παραγωγή

Η υπηρεσία στον χώρο ονομάτων παραγωγής εκτελείται στη θύρα 31633.

η υπηρεσία λειτουργεί στη θύρα 31633Εκτελέστε την ανάπτυξη στο Minikube

Πώς να Debug

Αυτές είναι μερικές από τις επιλογές εντοπισμού σφαλμάτων αν έχετε κάποιο πρόβλημα κατά την εφαρμογή αυτής της λύσης.

Πρώτον, πρέπει να επαληθεύσουμε ότι το configmap δημιουργείται με τον σωστό τρόπο και στο σωστό χώρο ονομάτων.

// επαληθεύει εάν δημιουργείται το configmap ή δεν είναι kubectl get cm -n ανάπτυξη
// επαληθεύστε τα δεδομένα στο configmap kubectl περιγράψτε την cm-n ανάπτυξη

Μόλις επαληθεύσετε το configmap. Στη συνέχεια, μπορείτε να ελέγξετε τον τοποθετημένο τόμο που έχει φορτωθεί με το configmap.

// πάρτε το ένα από τα pod kubectl get po-n ανάπτυξη
// exec σε ένα από τα pod kubectl exec -it / bin / sh -n ανάπτυξη # cd / usr / share / nginx / html / envapp / assets # cat app.config.json
app.config.json

Περίληψη

  • Το Angular παρέχει επιλογές διαμόρφωσης κατά τη δημιουργία χρόνου, πράγμα που σημαίνει ότι πρέπει να ορίσετε διαφορετικά αρχεία περιβάλλοντος για κάθε περιβάλλον.
  • Πρέπει να χτίσουμε μια φορά να τρέξουμε παντού είναι η συνιστώμενη στρατηγική.
  • Δεν μπορούμε να χρησιμοποιήσουμε την επιλογή γωνιακού περιβάλλοντος εάν θέλουμε να δημιουργήσουμε μία φορά και να αναπτύξουμε παντού, αφού πρέπει να παρέχουμε χωριστή διαμόρφωση για κάθε περιβάλλον.
  • Το Configmap παρέχει μια λύση για την αποσύνδεση της διαμόρφωσης από την εκτέλεση των δοχείων.
  • Εάν χρησιμοποιείτε τη γωνιακή εφαρμογή σας με το NGINX και χρειάζεστε έναν τρόπο να περάσετε τη διαμόρφωση κατά την εκτέλεση, τότε το ConfigMaps είναι η πιο εύκολη λύση.
  • Θα πρέπει να φορτώσετε το configmap στον τόμο που μπορεί να τοποθετηθεί στη διαδρομή υποδοχής και να αποκτήσετε το JSON εκείνο το μονοπάτι.
  • Μπορείτε να διαγράψετε το υπάρχον configmap και να αναδημιουργήσετε ένα και οι αλλαγές μπορούν να αντικατοπτριστούν στο τρέχον δοχείο χωρίς επανεκκίνηση των pods.

συμπέρασμα

Χρησιμοποιήστε το Configmaps αν θέλετε να αποσυνδέσετε τη διαμόρφωση από τα δοχεία σας και να κάνετε την κατάλληλη διαμόρφωση κατά τη διάρκεια εκτέλεσης.