+DE version complete
197
community-tutorials/setup-nodejs-server-EiWoMiSau/02-de.md
Normal file
|
@ -0,0 +1,197 @@
|
|||
---
|
||||
title: Node.JS Webserver mit Netcup's EiWoMiSau einrichten
|
||||
description: Lerne, wie man einen Node.JS Webserver mit dem Hosting Paket EiWoMiSau einrichtet
|
||||
updated_at: 2023-12-27
|
||||
slug: nodejs-webserver-unter-eiwomisau-einrichten
|
||||
author_name: Mike Ziebeck
|
||||
translator_url:
|
||||
translator_name: Mike Ziebeck
|
||||
author_url: https://github.com/mzaiprog
|
||||
author_image:
|
||||
author_bio:
|
||||
tags: [nodejs, webserver, eiwomisau]
|
||||
netcup_product_url: https://www.netcup.de/bestellen/produkt.php?produkt=2042
|
||||
language: de
|
||||
available_languages: [en, de]
|
||||
---
|
||||
|
||||
# Einführung
|
||||
|
||||
In diesem Tutorial erfährst Du, wie Du Deinen eigenen Node.JS Webserver aufsetzen kannst.
|
||||
Hierfür verwenden wir Netcup's Hosting Paket: [EiWoMiSau](https://www.netcup.de/bestellen/produkt.php?produkt=2042).
|
||||
|
||||
# Anforderungen
|
||||
|
||||
- Netcup Hosting Paket: [EiWoMiSau](https://www.netcup.de/bestellen/produkt.php?produkt=2042)
|
||||
- Eine bereits mit dem Hosting Paket verknüpfte eigene Domain incl. [eingerichtetem SSL-Zertifikat](https://helpcenter.netcup.com/de/wiki/webhosting/ssl-verschluesselung-webhosting) _(in unserem Beispiel `pentagame-online.de`)_
|
||||
|
||||
# Schritt 1 - Vorbereitung: Hostname
|
||||
|
||||
Um die Domain `pentagame-online.de` für verschiedene Zwecke nutzen zu können, richten wir zuerst folgende Subdomain ein: `nodejs-tutorial.pentagame-online.de`.
|
||||
|
||||
Hierfür öffnen wir die Plesk Übersicht unseres Hosting Paketes und drücken im Dialog für [Websites & Domains] den Button [Subdomain hinzufügen].
|
||||
|
||||
![Add Subdomain Button](./images_de/01-website-domains-add-subdomain-button.png)
|
||||
|
||||
Nachdem wir für den Namen der Subdomain `nodejs-tutorial` und `pentagame-online.de` festgelegt haben, stellen wir unter Dokumentstamm sicher, dass dieser mit `/nodejs-tutorial.pentagame-online.de/drop.me` genau zur Subdomain passt.
|
||||
|
||||
**Achtung:**
|
||||
- Darüber hinaus verweist das Unterverzeichnis `drop.me` auf den Ort, an dem Netcup die Standard Begrüßungsseite ablegen wird, welche wir **später aber löschen müssen**.
|
||||
- Diese Einstellung ist **nur einmal hier** festlegbar.
|
||||
|
||||
![Add Subdomain](./images_de/02-website-domains-add-subdomain-name.png)
|
||||
|
||||
Nachfolgend werden wir zur Plesk Übersicht unserer neuen Subdomain weitergeleitet.
|
||||
|
||||
# Schritt 2 - Vorbereitung: SSL-Zertifikat
|
||||
Dann fahren wir mit Klick auf [SSL/TLS-Zertifikate] fort.
|
||||
|
||||
![SSL Certificate Button](./images_de/03-nodejs-tutorial-subdomain-ssl-cert-button.png)
|
||||
|
||||
Nachfolgend gehe ich davon aus, dass für die Domain `pentagame-online.de` bereits ein [Let's Encrypt Zertifikat wie hier nach Anleitung eingerichtet worden ist.](https://helpcenter.netcup.com/de/wiki/webhosting/ssl-verschluesselung-webhosting)
|
||||
|
||||
Daher geht es sofort weiter mit [verwalten].
|
||||
|
||||
![Manage SSL Certificate Button](./images_de/04-nodejs-tutorial-subdomain-ssl-cert-manage-button.png)
|
||||
|
||||
Hier können wir mit dem Download Button am rechten Rand unser Zertifikat **temporär** im *.pem Format lokal abspeichern.
|
||||
|
||||
![Download SSL Certificate Button](./images_de/05-nodejs-tutorial-subdomain-ssl-cert-download-button.png)
|
||||
|
||||
Und machen es dann mit [PEM-Datei hochladen] für die Subdomain verfügbar.
|
||||
|
||||
![Upload SSL Certificate Button](./images_de/06-nodejs-tutorial-subdomain-ssl-cert-upload-button.png)
|
||||
|
||||
Mit dem eingestellten Zertifikat, lassen sich jetzt auch erfolgreich eingehende Anfragen [Von HTTP auf HTTPS umleiten]. Und mit Klick auf den Domainnamen kommen wir auch schnell wieder zurück zur Übersicht.
|
||||
|
||||
![Redirect HTTPS](./images_de/07-nodejs-tutorial-subdomain-ssl-cert-redirect-https.png)
|
||||
|
||||
# Schritt 3 - Einrichtung: Node.JS
|
||||
Hier fügen wir mit [Website erstellen] ...
|
||||
|
||||
![Create Website Button](./images_de/08-nodejs-tutorial-subdomain-create-website-button.png)
|
||||
|
||||
... [Node.JS] unserer Webseite hinzu.
|
||||
|
||||
![Add Node.JS](./images_de/09-nodejs-tutorial-subdomain-create-website-nodejs-button.png)
|
||||
|
||||
Um später bei Laufzeitfehlern hilfreichere Debugger Meldungen zu erhalten, stellen wir den Anwendungsmodus schon mal auf [development] und klicken dann auf [Node.js aktivieren].
|
||||
|
||||
![Activate Node.JS](./images_de/10-nodejs-tutorial-subdomain-nodejs-activate-button.png)
|
||||
|
||||
# Schritt 4 - Fehlerbehebung
|
||||
### Fehler: app.js nicht gefunden
|
||||
|
||||
Die nun kommende Fehlermeldung lautete tatsächlich auch im [production] Modus so. ;-) Unabhängig davon sagt sie uns aber, dass jetzt der Zeitpunkt gekommen ist, erst einmal eine Node.JS App zu erstellen.
|
||||
|
||||
Und hierfür öffnen wir den [Dateimanager].
|
||||
|
||||
![No App.js File Browser Button](./images_de/11-nodejs-tutorial-subdomain-nodejs-no-appjs-file-browser-button.png)
|
||||
|
||||
Dann navigieren wir zum Elternverzeichnis von `drop.me`.
|
||||
|
||||
![File Browser goto Document Root](./images_de/12-nodejs-tutorial-subdomain-nodejs-file-browser-goto-document-root.png)
|
||||
|
||||
Und erstellen dort die neue Datei `app.js`.
|
||||
|
||||
![Create New File](./images_de/13-nodejs-tutorial-subdomain-nodejs-no-appjs-create-file.png)
|
||||
![Create App.js](./images_de/14-nodejs-tutorial-subdomain-nodejs-create-file-appjs.png)
|
||||
|
||||
Wir öffnen den Code Editor für die neu erstellte Datei `app.js`.
|
||||
|
||||
![Edit App.js](./images_de/15-nodejs-tutorial-subdomain-nodejs-edit-file-appjs.png)
|
||||
|
||||
Und geben folgenden Beispiel Quellcode ein.
|
||||
```js
|
||||
const http = require('http');
|
||||
|
||||
const port = process.env.PORT || 3000;
|
||||
|
||||
http.createServer(function(request, response) {
|
||||
response.writeHead(200, {'Content-Type': 'text/plain'});
|
||||
response.end("Hello, World!\n");
|
||||
}).listen(port);
|
||||
|
||||
console.log(`App is running... (port: ${port})`);
|
||||
```
|
||||
|
||||
Inhaltlich erzeugen wir damit einen HTTP Web Server, der auf dem Port `3000` alle Browser Anfragen mit Status Code `200` (OK) und der Nachricht: `Hello, World!` vom Mime Typ: `text/plain` beantwortet. Der Port kann dabei aber frei gewählt werden, denn er wird später von NGINX automatisch für die Weiterleitung der HTTP/HTTPS Anfragen genutzt.
|
||||
|
||||
![Paste App.js Code](./images_de/16-nodejs-tutorial-subdomain-nodejs-paste-sample-code-appjs.png)
|
||||
|
||||
Zurück in den Node.js Einstellungen für unsere Subdomain probieren wir die "URL der Anwendung" mit einem Klick aus.
|
||||
|
||||
![Open URL](./images_de/17-nodejs-tutorial-subdomain-nodejs-open-url.png)
|
||||
|
||||
### Fehler: "Hier entsteht (immernoch) eine neue Webseite"
|
||||
|
||||
Aber es erscheint die Standard Willkommen Seite unseres Hosting Paketes.
|
||||
|
||||
![Default Site](./images_de/18-nodejs-tutorial-subdomain-nodejs-apache-default-site.png)
|
||||
|
||||
Was daran liegt, dass der primäre NGINX Server noch **alle** Anfragen an den Apache Webserver (der auch PHP interpretieren kann) weiterreicht. Also trennen wir als nächstes die Verbindung zwischen beiden.
|
||||
|
||||
Hierfür wechseln wir zurück zu [Websites & Domains] und auf unsere Subdomain `nodejs-tutorial.pentagame-online.de`, wo wir in den Tab [Hosting und DNS] klicken.
|
||||
|
||||
![Hosting and DNS Tab](./images_de/19-nodejs-tutorial-subdomain-hosting-dns-tab.png)
|
||||
|
||||
Dann rufen wir das Setup für [Apache und nginx] auf,
|
||||
|
||||
![Apache and nginx Button](./images_de/20-nodejs-tutorial-subdomain-hosting-dns-apache-nginx-button.png)
|
||||
|
||||
... scrollen bis zu nginx-Einstellungen,
|
||||
|
||||
![Apache and nginx Part 1](./images_de/21-nodejs-tutorial-subdomain-apache-nginx-part-1.png)
|
||||
|
||||
und deaktivieren den [Proxymodus].
|
||||
|
||||
![Apache and nginx Part 2](./images_de/22-nodejs-tutorial-subdomain-apache-nginx-no-proxy-part-2.png)
|
||||
|
||||
Zurück im Tab [Dashboard] öffnen wir mit [Dateien] den Dateimanager.
|
||||
|
||||
![Dashboard open Files](./images_de/23-nodejs-tutorial-subdomain-file-browser-button.png)
|
||||
|
||||
Dann navigieren wir erneut in das Dokument Root Verzeichnis unserer Subdomain. Und entfernen daraus, wie eingangs erwähnt, den Ordner `drop.me`.
|
||||
|
||||
![Delete drop.me](./images_de/24-nodejs-tutorial-subdomain-file-browser-delete-drop-me.png)
|
||||
|
||||
Zurück in der Plesk Übersicht unserer Subdomain können wir abermals das Ergebnis der Node.JS App [Im Browser öffnen].
|
||||
|
||||
![Reopen URL in Browser](./images_de/25-nodejs-tutorial-subdomain-test-website.png)
|
||||
|
||||
Vermutlich wird bei Dir genau wie bei mir immer noch die Standard Willkommen Seite angezeigt. Aber ein Neuladen im Browser...
|
||||
|
||||
![Refresh Default Site](./images_de/26-nodejs-tutorial-subdomain-nodejs-apache-default-site-refresh.png)
|
||||
|
||||
... liefert dann wie erwartet:
|
||||
|
||||
![Hello World](./images_de/27-nodejs-tutorial-subdomain-nodejs-hello-world.png)
|
||||
|
||||
# Fazit
|
||||
|
||||
Super! Du hast jetzt erfolgreich Deine Subdomain für den Einsatz eines eigenen Node.JS Webservers fit gemacht.
|
||||
|
||||
Am besten Du testest gleich die im Moment noch recht engen Grenzen des Servers aus und:
|
||||
- erweiterst ihn via Paket Management z.B. mit dem [Express Server Framework für Node.JS](https://expressjs.com/de)
|
||||
- und/oder fügst eine MySQL Datenbank Verbindung hinzu
|
||||
- oder nutzt das Git Repository Feature von Plesk
|
||||
|
||||
# License
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicence, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
||||
|
||||
# Contributor's Certificate of Origin
|
||||
|
||||
Contributor's Certificate of Origin By making a contribution to this project, I certify that:
|
||||
|
||||
1) The contribution was created in whole or in part by me and I have the right to submit it under the license indicated in the file; or
|
||||
|
||||
2) The contribution is based upon previous work that, to the best of my knowledge, is covered under an appropriate license and I have the right under that license to submit that work with modifications, whether created in whole or in part by me, under the same license (unless I am permitted to submit under a different license), as indicated in the file; or
|
||||
|
||||
3) The contribution was provided directly to me by some other person who certified (a), (b) or (c) and I have not modified it.
|
||||
|
||||
4) I understand and agree that this project and the contribution are public and that a record of the contribution (including all personal information I submit with it, including my sign-off) is maintained indefinitely and may be redistributed consistent with this project or the license(s) involved.
|
After Width: | Height: | Size: 95 KiB |
After Width: | Height: | Size: 135 KiB |
After Width: | Height: | Size: 190 KiB |
After Width: | Height: | Size: 227 KiB |
After Width: | Height: | Size: 169 KiB |
After Width: | Height: | Size: 227 KiB |
After Width: | Height: | Size: 174 KiB |
After Width: | Height: | Size: 189 KiB |
After Width: | Height: | Size: 163 KiB |
After Width: | Height: | Size: 142 KiB |
After Width: | Height: | Size: 150 KiB |
After Width: | Height: | Size: 137 KiB |
After Width: | Height: | Size: 146 KiB |
After Width: | Height: | Size: 21 KiB |
After Width: | Height: | Size: 156 KiB |
After Width: | Height: | Size: 55 KiB |
After Width: | Height: | Size: 151 KiB |
After Width: | Height: | Size: 92 KiB |
After Width: | Height: | Size: 191 KiB |
After Width: | Height: | Size: 144 KiB |
After Width: | Height: | Size: 196 KiB |
After Width: | Height: | Size: 178 KiB |
After Width: | Height: | Size: 198 KiB |
After Width: | Height: | Size: 165 KiB |
After Width: | Height: | Size: 194 KiB |
After Width: | Height: | Size: 92 KiB |
After Width: | Height: | Size: 25 KiB |