Handleiding: Ngrok Reverse Proxy Configuratie in ServBay

Ngrok is een krachtig en veilig tunnelingtool gebaseerd op reverse proxy-technologie. Het doorbreekt firewalls en NAT om lokaal draaiende services beschikbaar te maken via een publiek domein. In deze gids lees je stap voor stap hoe je Ngrok integreert en configureert binnen je ServBay lokale ontwikkelomgeving, zodat je eenvoudig je webservices, API’s of andere diensten via het internet toegankelijk maakt. Zo wordt het delen voor externe demos, teamwerk of webhook-testen een fluitje van een cent.

Technische Achtergrond

Ngrok werkt door een beveiligde, versleutelde tunnel op te zetten tussen jouw lokale machine en de Ngrok-server. Wanneer iemand van buitenaf het toegewezen publieke Ngrok-domein bezoekt, ontvangt de Ngrok-server het verzoek en stuurt het via deze veilige tunnel door naar het juiste service binnen jouw lokale ServBay-omgeving. Dit betekent dat je, zelfs zonder een publiek IP-adres of achter een firewall, toch extern toegang kunt bieden. Binnen de context van ServBay kun je je lokaal gehoste websites, backend API’s of andere HTTP/HTTPS-diensten realtime delen met de buitenwereld voor testen en demonstraties.

Voorbereiding

Voordat je Ngrok gaat configureren, zorg dat je de volgende stappen hebt doorlopen:

1. ServBay geïnstalleerd en actief: Zorg dat de ServBay-app succesvol is geïnstalleerd en dat de webdiensten die je wilt delen via Ngrok (zoals een website) correct geconfigureerd en draaiend zijn. Dit kun je controleren en beheren in het "Websites" paneel van ServBay.
2. Ngrok-client installeren: Volg deze stappen om de Ngrok CLI-tool te installeren:
   1. Ga naar de officiële Ngrok downloadpagina en download het installatiepakket voor jouw besturingssysteem.
   2. Pak het bestand uit. Verplaats of kopieer het uitgepakte ngrok uitvoerbare bestand naar een directory die in je systeem-PATH staat (bijvoorbeeld /usr/local/bin op macOS), zodat het commando overal in de terminal beschikbaar is.

      # Voorbeeld voor macOS ARM64
      sudo unzip ~/Downloads/ngrok-v3-stable-darwin-arm64.zip -d /usr/local/bin

   3. Controleer of de installatie gelukt is door het volgende commando uit te voeren. Je zou nu de versie-informatie moeten zien:

      ngrok version
      # Voorbeeld output: ngrok version 3.5.0

3. Ngrok-account (optioneel, aanbevolen): Met een Ngrok-account (gratis of betaald) kun je tunnels makkelijker beheren en vaste domeinen gebruiken. Ga naar de Ngrok website om te registreren en verkrijg je authenticatie-token (ngrok config add-authtoken <YOUR_AUTH_TOKEN>). Hierdoor worden tijdslimieten opgeheven en komen extra functies beschikbaar.
4. Lokale website geconfigureerd: Zorg dat er minimaal één lokale website in ServBay is geconfigureerd die je via Ngrok wilt publiceren, bijvoorbeeld met domeinen als servbay.local of yourproject.servbay.demo.

Praktische Tunnelconfiguratie

Uitleg Kernparameters

Het standaardcommando om een service te delen ziet er als volgt uit:

ngrok http --domain=<NGROK_DOMAIN> <LOCAL_ENDPOINT> \
  --request-header-add='host: <VIRTUAL_HOST>'

Parameter	Beschrijving
http	Zet een tunnel op voor HTTP-verkeer. Ngrok verwerkt inkomende HTTP/HTTPS-verzoeken.
--domain <NGROK_DOMAIN>	Bepaalt het vaste Ngrok-domein (voer hier je eigen domein in, zoals toegekend in Ngrok Dashboard). Niet vereist voor gratis accounts; standaard wordt een willekeurige subdomein toegewezen.
<LOCAL_ENDPOINT>	Het adres van je lokale ServBay-service. Voor een virtual host in ServBay is dat meestal eenvoudigweg het lokale domein (zoals https://servbay.local), maar je kunt ook http://localhost:poortenummer gebruiken.
--request-header-add='host: <VIRTUAL_HOST>'	Belangrijk: Overschrijft de Host-header van het verzoek. ServBay gebruikt deze header om verschillende sites intern te routeren. Vul hier het lokale (virtuele) domein in zoals geconfigureerd, bijvoorbeeld servbay.local.

Voorbeeldconfiguratie

Stel je hebt in ServBay een lokale website met domein servbay.local die je via Ngrok beschikbaar wilt maken. Gebruik je het gratis Ngrok-abonnement, dan kun je direct lokaal mappen:

# Lokaal ServBay-domein servbay.local mappen naar een willekeurig door Ngrok toegewezen domein
ngrok http https://servbay.local --request-header-add='host: servbay.local'

Heb je in het Ngrok Dashboard een vaste domein ingesteld, zoals your-servbay-demo.ngrok-free.app (of een eigen domein bij een betaald account), gebruik dan de --domain parameter:

# Lokaal ServBay-domein servbay.local mappen naar een specifiek Ngrok-domein
ngrok http --domain=your-servbay-demo.ngrok-free.app https://servbay.local --request-header-add='host: servbay.local'

Na uitvoering van bovenstaande commando verschijnt in de terminal de tunnelstatus inclusief het toegewezen publieke adres (bijvoorbeeld https://xxxx.ngrok-free.app of je vaste domein). Ook zie je het lokale dashboard van Ngrok voor real-time verkeer (doorgaans op http://127.0.0.1:4040).

Servicecontrole

Na het succesvol starten van een Ngrok-tunnel, volg je deze stappen om te testen of de dienst publiekelijk bereikbaar is:

1. Publiek adres ophalen: Zoek in de terminal de regel met Forwarding en noteer het URL dat met https:// begint.
2. Browser toegang: Open dit publieke Ngrok-URL op een willekeurig apparaat met internettoegang (bijvoorbeeld https://cunning-lacewing-fresh.ngrok-free.app of je vaste domein).
3. Verifiëren:
   • Controleer of de inhoud van je lokale website in de browser wordt weergegeven.
   • Let op of er een geldig HTTPS-certificaat staat in de adresbalk; Ngrok regelt dit automatisch.
   • Kijk in de Ngrok-client terminal of open het lokale Ngrok web-dashboard (http://127.0.0.1:4040) voor request logs en verkeersstatistieken, om zeker te weten dat je ServBay-site correct bereikbaar is.

Voorbeeld: succesvolle toegang tot een via Ngrok gepubliceerde tunnel vanuit de webbrowser

Geavanceerde Tips & Aandachtspunten

1. Domeinbeheer:

   • Met het gratis Ngrok-plan krijg je meestal een willekeurige .ngrok-free.app subdomein en zit er een tijdslimiet op tunnels.
   • Door een account aan te maken en domeinen te configureren in het Ngrok Dashboard, voorkom je steeds wisselende urls.
   • Met een betaald abonnement kun je eigen domeinen koppelen, meer bandbreedte en functionaliteit benutten.

2. Meerdere services tunnelen: Moet je meerdere lokale ServBay-services of poorten toegankelijk maken? Start dan per service een eigen Ngrok-proces of definieer meerdere tunnels in het Ngrok-configuratiebestand (meestal ~/.config/ngrok/ngrok.yml). Bijvoorbeeld:

   # servbay.local beschikbaar maken via HTTPS en correcte Host-header
   ngrok http --domain=servbay-website.ngrok-free.app https://servbay.local --request-header-add='host: servbay.local'
   
   # In een andere terminal of via config een Node.js-app op poort 3000 mappen
   ngrok http --domain=nodejs-api.ngrok-free.app http://localhost:3000

   Let op: Voor ServBay virtual hosts is het aan te raden te tunnelen naar https://[lokaal domein] en de juiste Host-header toe te voegen i.p.v. direct de poort 80/443, omdat ServBay daar al het verkeer voor alle hosts ontvangt.

3. Diagnoseopdrachten:

   • ngrok config check: Controleert of de Ngrok-configuratie (typisch in ~/.config/ngrok/ngrok.yml) correct is.
   • ngrok logs: Toont real-time logberichten in de terminal, nuttig bij het oplossen van verbindings- of routingproblemen.

4. Beveiliging: Publiek delen van lokale services brengt risico’s met zich mee. Deel alleen veilige diensten en schakel de Ngrok-tunnel uit als je hem niet gebruikt. Met een betaald Ngrok-plan kun je gebruikmaken van IP-whitelists, toegangscontrole en andere veiligheidsopties.

Probleemoplossing

Probleem	Mogelijke oplossing
Verbindingsfout of pagina laadt niet	Controleer of je website in ServBay draait en of je via het lokale domein (zoals https://servbay.local) bereikbaar bent. Controleer of de webserver (bijvoorbeeld Caddy of Nginx) actief is en of je firewall Ngrok-verkeer doorlaat.
HTTPS-certificaatfout in de browser	Ngrok voorziet elk publieke domein van een geldig HTTPS-certificaat. Zie je toch een foutmelding, controleer dan of je het juiste Ngrok-URL (https:// adres) gebruikt. Treedt het probleem lokaal op, bekijk dan je SSL-instellingen in ServBay.
Instabiele verbinding of traagheid	Controleer je internetverbinding op stabiliteit. Fluctuaties in netwerk kunnen de verbinding verbreken. Gebruik waar mogelijk een bekabelde verbinding. Voor hoge betrouwbaarheid: upgrade naar een betaald Ngrok-plan.
Je ziet de standaard ServBay-pagina i.p.v. je site	Ga na of <LOCAL_ENDPOINT> en het domein in --request-header-add='host: <VIRTUAL_HOST>' precies overeenkomen met je lokale ServBay-site. Dit is essentieel zodat ServBay het verzoek goed kan routeren.

Veelgestelde Vragen (FAQ)

• V: Kan ik ook een database van ServBay tunnelen via Ngrok?

  A: Ngrok ondersteunt naast HTTP(s) ook TCP-tunnels voor bijvoorbeeld databases, maar dit valt buiten de scope van deze handleiding. Het wordt afgeraden om je lokale database publiek te delen vanwege veiligheidsrisico's. Overweeg SSH-tunnels of veiligere alternatieven voor externe database-toegang.

• V: Verandert mijn publieke domein telkens als ik Ngrok start?

  A: Ja, bij gratis Ngrok-accounts krijg je telkens een willekeurige .ngrok-free.app subdomein. Voor een vast domein kun je een Ngrok-account aanmaken en dit instellen via het dashboard, of overstappen op een betaald account.

• V: Heeft Ngrok impact op de prestaties van mijn lokale ServBay-installatie?

  A: Elke aanvraag wordt via de Ngrok-server geleid, wat wat extra latency veroorzaakt. Voor ontwikkel-, test- en demo-doeleinden is deze vertraging meestal minimaal en acceptabel. Hoe snel je site reageert hangt verder af van je eigen hardware en dat van je applicatie.

Samenvatting

Door Ngrok te integreren kunnen ServBay-gebruikers probleemloos hun lokale webprojecten veilig en efficiënt delen via het internet. Dit werkt zonder gecompliceerde netwerkconfiguraties en is ideaal voor externe samenwerking, klantdemo’s, mobiele testen of integraties met externe services. Ngrok biedt real-time monitoring en krachtige beveiligingsmaatregelen (sommige features zijn betaald). Voor bedrijfskritische toepassingen of situaties waar een vast domein vereist is, adviseren we een betaald Ngrok-abonnement voor optimale stabiliteit en geavanceerde functionaliteit.