So stellen Sie statische Websites kostenlos mit Surge.sh bereit

0
227

Surge.sh ist ein kostenloser statischer Website-Host, mit dem Sie von Ihrem Befehlszeile. Es macht es schnell und einfach, neue Sites und Apps online zu stellen, entweder manuell oder als Teil Ihres CI-Build-Prozesses. So beginnen Sie mit der Nutzung des Dienstes.

Erster Lauf

Wir gehen davon aus, dass Sie bereits einen Verzeichnis der Dateien, die Sie im Web bereitstellen möchten. Falls noch nicht geschehen, erstellen Sie einen neuen Ordner, fügen Sie eine index.html und einige einfache Einstiegsinhalte hinzu.

Surge's Binary ist eine JavaScript-Anwendung, die über npm verteilt wird. Stellen Sie sicher, dass Node.js auf Ihrem System installiert ist, bevor Sie fortfahren. Beginnen Sie, indem Sie npm verwenden, um Surge zu installieren:

npm install –global Surge

Die globale Installation von Surge bedeutet, dass Sie den Surge-Befehl überall verwenden können, auch wenn in Ihrem Arbeitsverzeichnis keine package.json-Datei vorhanden ist. Wenn Sie das Flag –global weglassen, wird das Paket stattdessen als Projektabhängigkeit hinzugefügt, sodass Sie die für einzelne Sites verwendete Surge-Version sperren können.

Wechseln Sie jetzt in das Repository Ihrer Website. Führen Sie den Surge-Befehl aus, um den Bereitstellungsprozess zu starten. Eine Reihe interaktiver Aufforderungen wird angezeigt, beginnend mit Ihrer E-Mail-Adresse, um ein Surge-Konto einzurichten.

Werbung

Bestätigen Sie als Nächstes den Dateisystempfad zu Ihrem Projekt. Dies ist standardmäßig Ihr Arbeitsverzeichnis, sodass Sie normalerweise die Eingabetaste drücken können, um fortzufahren.

Die folgende Eingabeaufforderung fragt nach einem Domänennamen. Eine zufällige .surge.sh-Subdomain wird automatisch ausgewählt. Sie können eine andere Subdomain oder eine Ihrer eigenen Domains auswählen, indem Sie sie hier eingeben. Wenn Sie Ihre eigene Domain verwenden, erfahren Sie in den folgenden Abschnitten, wie Sie die Einrichtung abschließen.

Nachdem Sie einen Domänennamen angegeben haben, drücken Sie die Eingabetaste, um mit der Bereitstellung zu beginnen. Der Fortschritt wird auf Ihrem Terminal angezeigt, während die Surge-CLI Ihre Dateien hochlädt und im Web zur Verfügung stellt. Besuchen Sie Ihre Domain in Ihrem Browser, um Ihre Inhalte live zu sehen!

Site-Updates werden angewendet, indem Sie den Surge-Befehl erneut ausführen. Der Inhalt Ihres Projektverzeichnisses wird mit Ihrer Live-Website synchronisiert.

Alles in Ihrem Ordner wird standardmäßig hochgeladen. Sie können bestimmte Pfade ausschließen, indem Sie eine .surgeignore-Datei erstellen. Dies hat die gleiche Syntax wie .gitignore. Dateien und Ordner, die üblicherweise von anderen Entwicklertools wie Git und npm erstellt werden, werden automatisch weggelassen.

Verwenden Ihres eigenen Domainnamens

< p>Surge bietet benutzerdefinierten Domain-Support über CNAME-Einträge. Dies ist ohne zusätzliche Kosten gegenüber dem Standardservice. Fügen Sie im Steuerungsfeld Ihres Domainanbieters einen CNAME-Eintrag hinzu. Zeigen Sie die Hostnamen @ und www auf na-west1.surge.sh. Geben Sie Ihren Domainnamen an, wenn Sie Surge ausführen, um Ihre Website bereitzustellen.

Werbung

Sie werden jedes Mal zur Eingabe Ihrer Domain aufgefordert, wenn Sie den Surge-Befehl ausführen. Sie können dies vermeiden, indem Sie den Surge-Befehlen das Flag –domain hinzufügen. Alternativ erstellen Sie eine CNAME-Datei in Ihrem Projektverzeichnis. Schreiben Sie Ihren Domainnamen in diese Datei.

Surge –domain example.com echo “example.com” > CNAME

HTTPS-Weiterleitungen verwalten

Surge bietet automatische HTTPS-Unterstützung, die jedoch standardmäßig keine HTTP-zu-HTTPS-Umleitungen verarbeitet. Stellen Sie explizit die https-Variante Ihrer Domain bereit, um alle Besucher zu zwingen, eine gesicherte Verbindung zu verwenden. Die Aktivierung von Weiterleitungen wird für alle öffentlich zugänglichen Websites empfohlen.

Surge –domain https://example.com

Sie müssen ein SSL-Zertifikat angeben, wenn Sie Ihre eigene Domain verwenden. Diese Funktion ist nur im Rahmen des kostenpflichtigen Surge Plus-Plans verfügbar.

Surge gibt Ihnen auch die Kontrolle über die Weiterleitung von nackten Domains zu www. Das Standardverhalten sieht eine Umleitung von www.example.com auf example.com vor. Sie können dies rückgängig machen, indem Sie den www-Anteil explizit in Ihre Bereitstellungsdomäne aufnehmen.

Surge –domain https://www.example.com

Konfigurieren Ihrer Site

Surge bietet mehrere integrierte Komfortfunktionen, die es ihm helfen, sich von anderen ähnlichen Plattformen abzuheben. Sie können eine 404-Seite, Passwortschutz und CORS-Unterstützung hinzufügen, alles mithilfe spezieller Dateien in Ihrem Projekt.

Die 404-Seite wird aktiviert, indem eine 404.html-Datei erstellt wird. Das ist alles, was es gibt – Surge stellt die Datei bereit, wenn es keine direkte Übereinstimmung mit der angeforderten URI gibt.

Werbung

Der Passwortschutz wird durch eine AUTH-Datei aktiviert. Dies akzeptiert eine einfache Liste mit Nutzernamen und Passwörtern.

Cloudsavvy:howtogeek

Sie werden bei jedem Zugriff auf Ihre Website aufgefordert, einen Nutzernamen und ein Passwort mithilfe der HTTP-Basisauthentifizierung einzugeben. Diese Funktion ist nur im kostenpflichtigen Surge Plus-Plan verfügbar.

Eine weitere Funktion von Surge Plus sind manuelle Routing-Regeln. Sie können eine ROUTER-Datei erstellen, um benutzerdefinierte Weiterleitungen zu definieren, entweder innerhalb Ihrer Site oder extern.

301 /moved-page /new-link

Surge unterstützt die Statuscodes 301 (dauerhaft verschoben) und 307 (temporär verschoben) für die erste Spalte. Die letzte Spalte kann ein relativer Link innerhalb Ihrer Website oder ein absoluter Link zu einer anderen Domain (https://www.google.com) sein.

Eine letzte Konfigurationsdatei ist CORS. Auf diese Weise können Sie den ursprungsübergreifenden Zugriff auf Ihre Site zulassen. Fügen Sie der Datei ein * hinzu, um ursprungsübergreifende Anfragen von einem beliebigen Ursprung zu akzeptieren. Sie können stattdessen einzelne Domains schreiben, um die zulässigen Ursprünge einzuschränken.

Automatisieren von Surge-Bereitstellungen

Surge wird vollständig durch Textdateien und Terminalbefehle gesteuert. Es ist einfach in CI-Pipelines zu integrieren, um Websites bei jedem Commit automatisch bereitzustellen.

Werbung

Die Automatisierung von Surge erfordert die Verwendung von API-Token. Auf diese Weise können Sie die interaktiven Anmeldeaufforderungen vermeiden. Melden Sie sich zunächst auf Ihrem Entwicklungscomputer bei Surge an. Führen Sie Surge-Token aus, um Ihr API-Token zu erhalten.

Legen Sie in Ihrer CI-Pipeline die Umgebungsvariablen SURGE_LOGIN und SURGE_TOKEN fest. Ersteres sollte Ihre E-Mail-Adresse sein, während letzteres Ihr API-Token benötigt. Jetzt können Sie mit den Flags –project und –domain nicht interaktiv bereitstellen:

Surge –project $PWD –domain example.com

Zusammenfassung

Surge macht es einfach, statische Websites live ins Web zu bringen. Die Nutzung des Basisdienstes ist kostenlos. Das Upgrade auf den Plus-Plan bietet Ihnen Authentifizierung, Weiterleitungen und besser konfigurierbares HTTPS.

Im Gegensatz zu anderen Konkurrenten ist Surge vollständig Terminal-gesteuert. Dies macht es ideal für schnelle entwicklerorientierte Websites, die über Git-Repositorys und CI-Pipelines verwaltet werden. Die Serverkonfiguration entfällt, sodass Sie sich auf die Erstellung des Inhalts Ihrer Website konzentrieren können.

Für komplexere Anwendungsfälle können Sie mit Surge sogar mehrere Mitwirkende hinzufügen. Führen Sie Surge –add user@example.com aus, um Freunden, Gästen und Kollegen Zugriff auf Ihre Site zu gewähren. Sie können die Bereitstellung durchführen, indem sie Surge ausführen und denselben Domainnamen angeben, den Sie bisher verwendet haben.