Improve Data Flow through React Context
28.02.2024
08.04.2020
Gewusst wie: Auf Umgebungsvariabeln zugreifen in statischen Webapplikationen mittels Docker Deployment!
In einem aktuellen Szenario haben wir für einen Kunden eine Applikation erstellt, die lediglich aus JavaScript bestand. Die Auslieferung der Applikation erfolgt als Docker-Container auf Basis von nginx. Eine Anforderung war, dass keine zusätzlichen Technologien (Scripting-Sprachen/Programme) auf dem Container ausgeführt werden sollen.
Die Applikation wird jedoch in verschiedenen Umgebungen betrieben und die Software muss somit konfigurierbar sein. Docker bietet hier die Möglichkeit, Umgebungsvariablen beim Ausführen des Containers zu setzen. Diese müssen schlussendlich im JavaScript-Code verfügbar sein.
myapp.js (Auszug):
var thirdPartyAPIUrl = "{APIBASEPATH}";
var req = new XMLHttpRequest();
req.open('GET', url);
JavaScript selbst bietet keinen Zugriff auf Umgebungsvariablen an. Als Lösung erstellten wir ein Bash-Skript, das die Umgebungs-Variablen ausliest und diese im JavaScript-Code ersetzt.
Der Inhalt der Bash-Datei entrypoint.sh sieht folgendermaßen aus:
entrypoint.sh:
#!/bin/sh
sed -i "s|{APIBASEPATH}|$apiurl|g" /app/wwwroot/js/myapp.js
nginx -c /etc/nginx/nginx.conf
Dieses Skript nutzt sed, um den Platzhalter {APIBASEPATH} in myapp.js durch die Umgebungsvariable $apiurl zu ersetzen.
Die Software des Docker-Containers benötigt die entsprechenden Berechtigungen. Im Dockerfile werden zuerst die Rechte der Skriptdatei auf 755 gesetzt, damit diese ausgeführt werden kann. Danach wird der ENTRYPOINT von dem ursprünglichen nginx-Befehl auf das Skript entrypoint.sh geändert.
Dockerfile:
RUN chmod 755 entrypoint.sh
ENTRYPOINT ["/app/entrypoint.sh"]
Mit dieser Lösung wird bei jedem Neustart des Containers die URL aus der Umgebungsvariable vom Docker ins JavaScript geschrieben und das Programm nutzt die entsprechende API. Somit bleibt die Applikation trotz statischem Code weiterhin konfigurierbar.
Improve Data Flow through React Context
28.02.2024
Play with the WBS
13.09.2023
Zentralisierung von Application Logs
12.05.2023
A gentle introduction to JSON Web Tokens
30.03.2023