Ihre Dokumentation in einem Unterordner mit Cloudflare hosten

Folgen Sie dieser Anleitung, um Ihr Ferndesk Help Center in einem benutzerdefinierten Unterordner (wie yourdomain.com/help) unter Verwendung von Cloudflare Workers als Reverse Proxy zu hosten.

Voraussetzungen

• Ein Ferndesk-Workspace mit Administratorzugriff

• Eine eigene Domain (die bereits auf Cloudflare verweist)

• Grundkenntnisse im Cloudflare-Dashboard

Schritt 1: Einrichten des benutzerdefinierten Unterordners in Ferndesk

Konfigurieren Sie zunächst Ihr Ferndesk Help Center so, dass ein benutzerdefinierter Unterordnerpfad verwendet wird.

1. Melden Sie sich in Ihrem Ferndesk-Workspace an, klappen Sie Help Center in der linken Seitenleiste auf und klicken Sie dann auf Customize.

2. Klicken Sie auf Custom domain

   

3. Wählen Sie die Option Custom sub-folder

   

4. Geben Sie Ihre Domain in das Feld Domain ein (z. B. yourdomain.com).

5. Geben Sie den gewünschten Unterordnerpfad in das Feld Subdirectory ein (z. B. /help oder /docs).

6. Klicken Sie auf Configure sub-folder.

Schritt 2: Einen Cloudflare Worker erstellen

Erstellen Sie nun einen neuen Cloudflare Worker, der als Reverse Proxy fungiert.

1. Melden Sie sich in Ihrem Cloudflare-Dashboard an.

2. Navigieren Sie unter BUILD → Compute & AI in der linken Seitenleiste zu Workers & Pages.

   

3. Klicken Sie oben rechts auf Create application.

   

4. Klicken Sie unter Start with Hello World! auf Get started.

   

5. Geben Sie Ihrem Worker einen aussagekräftigen Namen wie ferndesk-reverse-proxy und klicken Sie dann auf Deploy.

   

Schritt 3: Konfigurieren der Worker-Routen

Richten Sie die Routing-Regel ein, die den Datenverkehr von Ihrem benutzerdefinierten Unterordner an den Cloudflare Worker leitet.

1. Navigieren Sie in den Worker-Einstellungen zur Registerkarte Settings.

   

2. Scrollen Sie zu Domains & Routes und klicken Sie auf Add.

   

3. Ein Modal-Fenster öffnet sich. Wählen Sie die Option Route.

   

4. Wählen Sie im Dropdown-Menü Zone Ihre Domain aus (z. B. yourdomain.com).

5. Geben Sie im Feld Route das Muster für Ihren Unterordnerpfad ein. Verwenden Sie yourdomain.com/help, um alle Anfragen an den Pfad /help und seine Unterpfade zu erfassen.

6. Lassen Sie Failure mode aus Sicherheitsgründen auf Fail closed (block) eingestellt.

7. Klicken Sie auf Add route.

   

Schritt 3b: Hinzufügen der _ferndesk-Route

1. Scrollen Sie zu Domains & Routes und klicken Sie auf Add.

   

2. Ein Modal-Fenster öffnet sich. Wählen Sie die Option Route.

   

3. Wählen Sie im Dropdown-Menü Zone Ihre Domain aus (z. B. yourdomain.com).

4. Geben Sie im Feld Route das Muster für Ihren Unterordnerpfad ein. Verwenden Sie yourdomain.com/_ferndesk, um alle Anfragen an den Pfad /_ferndesk und seine Unterpfade zu erfassen.

5. Lassen Sie Failure mode aus Sicherheitsgründen auf Fail closed (block) eingestellt.

6. Klicken Sie auf Add route.

   

Schritt 4: Bearbeiten des Worker-Codes

Aktualisieren Sie nun den Worker-Code, um die Reverse-Proxy-Logik zu implementieren. Der Worker fängt Anfragen an Ihren Unterordner ab und leitet sie an Ferndesk weiter.

1. Klicken Sie auf Edit code (oder rufen Sie den Code-Editor über das Worker-Dashboard auf).

   

2. Ersetzen Sie den gesamten worker.js-Code durch das untenstehende Reverse-Proxy-Skript.

   // ONLY edit these
   
   const HELP_HOST = 'your-slug.hc.ferndesk.com'; // your Ferndesk help center host copied from your dashboard
   const PROXY_PREFIX = '/help'; // the path you want your help center to live on
   
   addEventListener('fetch', (event) => {
   	event.respondWith(handleRequest(event.request));
   });
   
   async function handleRequest(request) {
   	const originalUrl = new URL(request.url);
   
   
   	if (originalUrl.pathname.endsWith('/') && originalUrl.pathname !== '/') {
   		originalUrl.pathname = originalUrl.pathname.slice(0, -1);
   		return Response.redirect(originalUrl.toString(), 301);
   	}
   
   
   	if (
   		originalUrl.pathname !== PROXY_PREFIX &&
   		!originalUrl.pathname.startsWith(`${PROXY_PREFIX}/`) &&
   		!originalUrl.pathname.startsWith('/_ferndesk/')
   	) {
   		return fetch(request);
   	}
   
   	// Build the upstream request with the prefix removed
   	const upstreamUrl = new URL(originalUrl.toString());
   	upstreamUrl.hostname = HELP_HOST;
   
   	if (upstreamUrl.pathname === PROXY_PREFIX) {
   		upstreamUrl.pathname = '/';
   	} else if (upstreamUrl.pathname.startsWith(`${PROXY_PREFIX}/`)) {
   		upstreamUrl.pathname = upstreamUrl.pathname.slice(PROXY_PREFIX.length) || '/';
   	}
   
   	const proxyRequest = new Request(upstreamUrl.toString(), request);
   
   	// CRITICAL: Needed to resolve requests correctly
   	proxyRequest.headers.set('X-Ferndesk-Base-Path', PROXY_PREFIX);
   	proxyRequest.headers.set('X-Forwarded-Host', originalUrl.host);
   	proxyRequest.headers.set('X-Ferndesk-Original-Host', originalUrl.host);
   
   
   	return fetch(proxyRequest);
   }
   Ersetzen Sie HELP_HOST durch die tatsächliche Ferndesk-Domain, die bei der Konfiguration Ihres benutzerdefinierten Unterordners angegeben wurde. Ersetzen Sie PROXY_PREFIX, wenn Sie einen anderen Unterordnerpfad verwenden (z. B. /docs statt /help).

3. Klicken Sie auf Deploy, um Ihre Änderungen zu veröffentlichen.

   

Schritt 5: Überprüfung der Einrichtung

Testen Sie, ob Ihr Help Center nun unter Ihrem benutzerdefinierten Unterordnerpfad erreichbar ist.

1. Öffnen Sie einen neuen Browser-Tab und navigieren Sie zu https://yourdomain.com/help.

2. Sie sollten Ihr Ferndesk Help Center mit Ihrem Branding sehen.

3. Testen Sie einige Seiten, indem Sie auf Links klicken, um sicherzustellen, dass die Navigation korrekt funktioniert.

Problemlösung