Der Next.js-Server in der Google-Cloud

Um den Welcome-to-Next.js-Server in der Cloud anzulegen, starten wir mit VS Code eine Remote-Sitzung in einem beliebiges Unterverzeichnis der virtuellen Google-Maschine. (Im Beispiel /home/..benutzename../testWeb). Das Verzeichnis sollte, bis auf die package.json-Datei und das Verzeichnis node_modules leer sein. Falls notwendig, legen Sie mit den Kommandos

npm init -y
npm install react react-dom next

eine package.json-Datei an, und installieren die drei Pakete next, react, react-domDenken Sie auch daran das scripts-Objekt anzupassen.

"name": "testweb",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "dev": "node server.js",
    "build": "next build",
    "start": "NODE_ENV=production node server.js"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "dependencies": {
    "next": "^10.0.4",
    "react": "^17.0.1",
    "react-dom": "^17.0.1"
  },
  "devDependencies": {}
}

Nun müssen nur noch die Dateien ./pages/index.js- und ./server.js, die wir am Ende des letzten Kapitels erstellt haben, in die entsprechenden Verzeichnisse der VM kopiert werden. Die Konstante portHttp ändern wir wieder auf 3000 und bei console.log die Adresse localhost in die externe IP-Adresse der virtuellen Maschine (bei mir http://35.192.166.139/).

erster Start Next.js-Server in der Cloud

Wenn wir jetzt im Browser die Website, mitsamt der Portnummer, aufrufen passiert ---- nichts. Es kommt nur die Fehlermeldung Die Website ist nicht erreichbar. Ursache hierfür sind die Einstellungen der Firewall. Wir hatten dort, es ist schon lange her, nur die Ports 80 und 443 für den Server freigegeben. Um das zu ändern rufen wir in der GC-Konsole unter dem Menupunkt VPC-Netzwerk das Untermenu Firewall auf und klicken auf den Namen default-allow-http.

Es öffnet sich ein neues Fenster, wir klicken oben auf BEARBEITEN und ändern, ziemlich unten, bei Protokolle und Ports die Zeile tcp, indem wir die 80 in 80, 3000 ergänzen und speichern das Ganze wieder ab.

Rufen wir jetzt die Seite mit der Portnummer im Browser auf, erscheint, wie erwartet, die Willkommensmeldung der Maschine. Was für ein langer Weg bis zu diesem Ergebnis. Und wir sind längst nicht fertig.

Wir wollen irgendwann das Terminal, mit dem wir die Maschine gestartet wurde, wieder schließen. Dann läuft der Webserver aber nicht mehr. Was tun? Es gibt mehrere Möglichkeiten. Ich habe mich entschieden., ein Start-Script beim jedem Reboot der Maschine über dieCrontab starten zu lassen.

Das Script sieht so aus. Sie müssen aber ihren GC-Benutzernamen eintragen. Falls sie den nicht mehr wissen, starten Sie einfach in der GC-Konsole eine SSH-Sitzung und geben das Kommando pwd ein. Es wird er aktuelle Pfad des Home-Verzeichnisses, der den Benutzernamen enthält, angezeigt.

#!/bin/bash
cd /home/GC-Benutzername/testWeb
sudo npm run start &> start-start.log

Die Script-Datei heißt bei mir start-start.sh und muss sich im Basisverzeichnis desjenigen Web-Servers befinden, der gestartet werden soll.

Wir starten in einem SSH-Fenster folgende Kommandofolge, um die Datei zu testen:

# wir wechseln in das Basisverzeichnis des betroffenen Web-Servers
~/$ cd testWeb
# Information zur Datei start-start.sh abrufen
~/testWeb$ ls -l start-start.sh
-rw-r--r-- 1 anton_beton anton_beton 78 Dec 29 15:10 start-start.sh
# Zugriffsrechte für die Datei start-start.sh ändern
~/testWeb$ chmod 755 start-start-sh
# Information zur Datei start-start.sh abrufen
~/testWeb$ ls -l start-start.sh
-rwxr-xr-x 1 anton_beton anton_beton 78 Dec 29 15:10 start-start.sh
# Erstelle eine neue Anwendung im /.next - Verzeichnis
npm run build
# Starte die Script-Datei start-start.sh
./start-start.sh

Jetzt sollte das Script dauerhaft ausgeführt werden und damit der Web-Server unter seiner externen IP-Adresse am Port 3000 erreichbar sein. Zudem wird im Basisverzeichnis die Datei start-start.log angelegt, die ein Kurzprotokoll des Starts enthält. Bleibt noch, das Script bei jedem Reboot durch die Crontab starten zu lassen. Mit `CTRL-c` beenden wir die Scriptausführung und geben das Kommando

crontab -e

ein. Beim ersten Mal öffnet sich eine Browserauswahl, ich entscheide mich für den Nano. Dann öffnet sich der gewählte Editor, und zeigt die aktuelle crontab. Die enthält nur Kommentare.

Am Ende dieser Kommentare, in eine neue Zeile, fügen wir das Kommando

@reboot sudo /home/ ..benutzername.. /myweb/start-start.sh

ein. Wie gehabt, muss der Benutzername angepasst werden. Wenn Sie ein anderes Verzeichnis als testWeb gewählt haben, dann dieses auch. Im Nano wird mit `CRTL-o` abgespeichert. Nano schlägt erst den Dateinamen vor, wir bestätigen mit ⏎ und beenden ihn mit `CTRL-x`.

Bleibt noch der Test: Auf der Seite der Compute Engine der GC-Konsole wird ganz oben der Button Zurücksetzen (der Dreiviertelkreis mit dem senkrechten Strich) angezeigt. Wir machen einen Haken bei unserer virtuellen Maschine und klicken auf das Zurücksetzen-Symbol. Wenn alles geklappt hat sollte der Web-server unter seiner externen Adresse nach etwa einer halben Minute wieder erreichbar sein.