cryeffect.net
Linux

local-ssl-proxy – HTTPS für lokale Entwicklung leicht gemacht

Linux

Übersicht: local-ssl-proxy

Was ist local-ssl-proxy?

local-ssl-proxy ist ein einfaches Kommandozeilen-Tool von Cameron Hunter, das einen HTTPS-Proxy für lokale HTTP-Server erstellt. Es ermöglicht Entwicklern, ihre lokalen Anwendungen über HTTPS zu testen, ohne komplexe SSL-Konfigurationen vornehmen zu müssen.

Warum ist das ein Gamechanger in der Entwicklung?

  • Realistische Testumgebung: Moderne Webanwendungen setzen HTTPS voraus – local-ssl-proxy bringt diese Realität in deine Entwicklungsumgebung.
  • Service Worker Testing: Viele Browser-APIs (wie Service Workers) funktionieren nur über HTTPS.
  • Cookie-Sicherheit: Secure Cookies und SameSite-Einstellungen können nur über HTTPS getestet werden.
  • Mixed Content Vermeidung: Verhindert Mixed Content Warnings bei der Entwicklung.
  • API-Integration: Externe APIs verlangen oft HTTPS für Webhooks und Callbacks.
  • Einfachheit: Keine komplizierten Zertifikatskonfigurationen nötig.

Installation

1
npm install -g local-ssl-proxy

Wie verwendet man local-ssl-proxy?

Grundlegende Verwendung

  1. Lokalen Server starten:

    1
    2
    # Beispiel: Express-Server auf Port 3000
    node server.js

  2. SSL-Proxy starten:

    1
    local-ssl-proxy --source 3001 --target 3000

    Jetzt ist deine Anwendung über https://localhost:3001 erreichbar, während der ursprüngliche Server auf http://localhost:3000 läuft.

Erweiterte Beispiele

Mit spezifischem Hostname:

1
local-ssl-proxy --source 3001 --target 3000 --hostname myapp.local

Erreichbar über: https://myapp.local:3001

Mit eigenem Zertifikat:

1
local-ssl-proxy --source 3001 --target 3000 --cert ./my-cert.pem --key ./my-key.pem

Externes Target:

1
local-ssl-proxy --source 3001 --target 8080 --hostname api.example.com

Mehrere Services gleichzeitig:

1
2
3
4
5
6
7
8
# Terminal 1: Frontend
local-ssl-proxy --source 3001 --target 3000

# Terminal 2: API
local-ssl-proxy --source 4001 --target 4000

# Terminal 3: WebSocket Server
local-ssl-proxy --source 5001 --target 5000

Praktische Anwendungsfälle

React/Vue.js Entwicklung

1
2
3
4
5
# React App auf Port 3000
npm start

# SSL-Proxy in anderem Terminal
local-ssl-proxy --source 3001 --target 3000

Zugriff über: https://localhost:3001

API-Entwicklung mit Express

1
2
3
4
5
# Express API
node api.js  # läuft auf Port 4000

# SSL-Proxy
local-ssl-proxy --source 4001 --target 4000

Webhook-Testing

1
2
3
4
5
# Lokaler Server für Webhook-Empfang
node webhook-server.js  # Port 8000

# SSL-Proxy für externe Services
local-ssl-proxy --source 8001 --target 8000 --hostname webhook.myapp.local

Häufige Optionen

  • --source, -s: HTTPS-Port (wo der Proxy läuft)
  • --target, -t: HTTP-Port (wo dein Server läuft)
  • --hostname, -h: Hostname für das Zertifikat
  • --cert, -c: Pfad zum SSL-Zertifikat
  • --key, -k: Pfad zum privaten Schlüssel
  • --config: Konfigurationsdatei verwenden

Konfigurationsdatei

Erstelle eine ssl-proxy.json für komplexere Setups:

1
2
3
4
5
6
7
{
  "source": 3001,
  "target": 3000,
  "hostname": "myapp.local",
  "cert": "./certificates/cert.pem",
  "key": "./certificates/key.pem"
}

Starten mit:

1
local-ssl-proxy --config ssl-proxy.json

Integration in package.json

1
2
3
4
5
6
7
{
  "scripts": {
    "start": "node server.js",
    "start:ssl": "local-ssl-proxy --source 3001 --target 3000",
    "dev": "concurrently \"npm start\" \"npm run start:ssl\""
  }
}

Tipps

  • Browser-Warnung: Beim ersten Aufruf zeigt der Browser eine Sicherheitswarnung – das ist normal bei selbstsignierten Zertifikaten.
  • localhost vs. 127.0.0.1: Verwende localhost für bessere Kompatibilität.
  • Port-Konflikte: Wähle einen freien Port für den Source-Parameter.
  • Hosts-Datei: Für Custom Hostnames füge Einträge in /etc/hosts hinzu.
  • Entwicklungs-Zertifikate: Für Produktions-ähnliche Tests verwende echte Zertifikate.

Troubleshooting

Port bereits in Verwendung:

1
2
3
4
5
# Port prüfen
lsof -i :3001

# Prozess beenden
kill -9 <PID>

Zertifikat-Fehler:

1
2
# Browser-Cache leeren
# Oder Incognito-Modus verwenden

Alternativen

  • mkcert: Für vertrauenswürdige lokale Zertifikate
  • ngrok: Für öffentlich erreichbare HTTPS-Tunnels
  • Caddy: Als vollwertiger Reverse Proxy

Fazit

local-ssl-proxy ist ein unverzichtbares Tool für moderne Webentwicklung. Es beseitigt die Hürden bei der lokalen HTTPS-Entwicklung und ermöglicht realistische Tests deiner Anwendungen. Mit wenigen Befehlen verwandelst du jeden HTTP-Server in eine HTTPS-Anwendung – ein echter Gamechanger für jeden Entwickler.