Subfolder proxy via Cloudflare Workers

Met een Cloudflare Worker kun je bezoekersverzoeken voor een subfolder rechtstreeks naar Clonable sturen. Dit werkt voor ieder type website en is niet afhankelijk van WordPress of toegang tot de NGINX- of Apache-configuratie.

Deze configuratie is een alternatief voor een subfolder proxy op je webserver of via de Clonable WordPress plugin. Cloudflare neemt het doorsturen over, zodat je eigen server hiervoor geen extra verzoek hoeft af te handelen.

Hoe werkt het?

Bezoeker → Cloudflare Worker → Clonable → originele website

Clonable haalt de originele inhoud op wanneer die nodig is. Je server hoeft niet eerst het bezoekersverzoek naar Clonable door te sturen en op het antwoord te wachten. Bij WordPress vervalt daarmee de extra PHP-worker voor het doorsturen. Caching en de inhoud van een pagina bepalen hoeveel verzoeken Clonable uiteindelijk aan je originele website doet; dit is geen garantie van precies één verbinding voor een volledige paginalading.

Wat heb je nodig?

• Een subfolder clone in Clonable, met de juiste publieke hostnaam en subfolder.
• Een actief domein in Cloudflare en toegang tot DNS, Workers en Worker routes.
• Een DNS-record voor de publieke hostnaam dat via Cloudflare wordt geproxied (oranje wolkje).
• Een origineel dat Clonable kan bereiken zonder het verzoek opnieuw naar de clone te sturen.

In dit voorbeeld is example.org het hoofddomein, www.example.org de publieke hostnaam en /fr/ de subfolder van de clone. Vervang deze waarden door je eigen gegevens.

1. Een CNAME-record toevoegen

Selecteer je domein in Cloudflare en ga naar DNS → Records. Voeg het volgende record toe:

Instelling	Waarde in dit voorbeeld
Type	CNAME
Name	clonable-origin
Target	lb.clonable.net
TTL	Auto

Hierdoor verwijst clonable-origin.example.org naar Clonable. Gebruik voor je eigen domein clonable-origin. gevolgd door je hoofddomein, dus zonder www..

Dit is een apart record voor de Worker. Laat de bestaande DNS-records voor je originele website naar je eigen server verwijzen.

2. Een Worker aanmaken

Ga in Cloudflare naar Workers & Pages, maak een Worker aan en geef deze een herkenbare naam, bijvoorbeeld clonable-subfolder-proxy. Open de code-editor, vervang de voorbeeldcode door onderstaande code en sla de Worker op en deploy deze.

export default {
  async fetch(request) {
    const url = new URL(request.url);

    if (url.hostname !== "www.example.org" || !url.pathname.startsWith("/fr/")) {
      return fetch(request);
    }

    return fetch(request, {
      redirect: "manual",
      cache: "no-store",
      cf: {
        resolveOverride: "clonable-origin.example.org",
      },
    });
  },
};

Pas de volgende waarden aan:

• www.example.org: de exacte publieke hostnaam van je clone, inclusief www. als je dat gebruikt.
• /fr/: de subfolder van je clone, inclusief de afsluitende slash.
• clonable-origin.example.org: de hostnaam van het CNAME-record uit stap 1.

De Worker behoudt de publieke URL, de Host-header, het volledige subfolderpad, de querystring, de HTTP-methode en de requestbody. resolveOverride verandert alleen waar de verbinding naartoe gaat. De publieke hostnaam en de override-hostnaam moeten binnen dezelfde Cloudflare-zone staan. Een CNAME binnen je eigen zone maakt het mogelijk om naar lb.clonable.net te verwijzen zonder de publieke hostnaam te veranderen. Zie de Cloudflare documentatie over resolveOverride.

Met redirect: "manual" worden redirects teruggestuurd naar de browser. Met cache: "no-store" gebruikt deze fetch geen Cloudflare-cache voor het antwoord. Dit schakelt caching in Clonable of op je originele website niet uit.

3. Een Worker route toevoegen

Open je Worker en ga naar de route-instellingen onder Domains of Settings → Domains & Routes. Voeg een Route toe, selecteer de zone example.org en koppel dit patroon aan je Worker:

www.example.org/fr/*

Vervang de hostnaam en subfolder door dezelfde waarden als in je code. Gebruik een route voor de subfolder; een Worker Custom Domain is bedoeld voor een volledige hostnaam.

De route verwerkt /fr/ en alle onderliggende paden, inclusief queryparameters. /fr zonder afsluitende slash valt buiten dit patroon. Stel daarvoor een redirect van /fr naar /fr/ in, bijvoorbeeld met een Cloudflare Redirect Rule, en behoud de querystring.

Voeg voor iedere extra subfolder een passende route toe en pas de controle in de Worker aan. Gebruik geen algemene route voor je hele website als alleen de subfolder naar Clonable moet gaan. Meer informatie vind je in de Cloudflare documentatie over Worker routes.

4. Clonable en je bestaande proxy controleren

Selecteer in Clonable voor de clone Cloudflare onder Clone Settings → Proxy settings en klik op Save Proxy. Volg voor de SSL/TLS-instellingen de Cloudflare setup. Gebruik je Full (strict), installeer dan eerst het origin certificate zoals daar beschreven.

Clonable moet de originele inhoud kunnen blijven ophalen. De originele URL's horen buiten de route voor de clone te vallen. Als je bestaande inrichting originele inhoud binnen dezelfde subfolder ophaalt, moet je de routering daarop aanpassen voordat je deze eenvoudige Worker gebruikt. Bestaande subfolder exclusions moet je ook overnemen in de routering of Worker; de voorbeeldcode stuurt ieder verzoek binnen /fr/ naar Clonable.

Gebruik je WordPress? Schakel Enable subfolder service in de Clonable plugin uit zodra de Worker-route actief is en de afhandeling overneemt. Je kunt de plugin blijven gebruiken voor language tags en de language switcher. Zie de stappen voor het uitschakelen van de subfolder service.

Gebruik je al een NGINX- of Apache-proxy? Stem de overstap af zodat er één werkende afhandeling voor de subfolder is. Je hoeft voor deze Worker geen nieuwe proxyregels op de webserver toe te voegen.

Kosten en limieten

Het Cloudflare Workers Free-plan heeft een limiet van 100.000 verzoeken per dag, gedeeld door de Workers binnen je account. De limiet wordt dagelijks om 00:00 UTC gereset. Dit zijn Worker-verzoeken, geen bezoekers: een pagina kan meerdere verzoeken veroorzaken. Boven de limiet kan de route de Worker overslaan of een fout tonen, afhankelijk van de ingestelde fail mode. Zorg daarom dat de limiet en het gekozen gedrag passen bij je verkeer. Zie de actuele Cloudflare Workers-limieten.

Controleren of alles werkt

1. Open de clone via de publieke URL, bijvoorbeeld https://www.example.org/fr/. Een workers.dev-adres voldoet niet aan de hostnamecontrole in de voorbeeldcode.
2. Test /fr, /fr/, een vertaalde subpagina en een URL met queryparameters.
3. Controleer of de originele website buiten /fr/ normaal blijft werken.
4. Test redirects, statische bestanden, cookies, formulieren en eventuele winkelwagen- en checkoutpagina's. Controleer ook uitgesloten paden.
5. Controleer in de Worker-logs of de route wordt uitgevoerd en of er fouten zijn. Controleer op je eigen server dat deze de originele inhoud aan Clonable levert en niet meer het bezoekersverzoek voor de clone hoeft door te sturen.

Werkt de clone niet? Controleer of de publieke hostnaam via Cloudflare wordt geproxied, of route en code dezelfde hostnaam en subfolder gebruiken, of het CNAME-record in dezelfde zone bestaat en of Clonable de originele website kan bereiken. Controleer bij TLS-fouten ook de instellingen uit de Cloudflare setup.

Wil je terug naar je vorige configuratie? Herstel eerst de bestaande subfolder proxy of pluginservice en verwijder daarna de Worker-route. Neem bij problemen contact op met Clonable en stuur het domein, de subfolder en eventuele Worker-foutmeldingen mee.