Verbinden Sie Ihr Help Center über Cloudflare mit einem benutzerdefinierten Unterordner

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

Voraussetzungen

• Ein Ferndesk Workspace mit Admin-Zugriff

• Eine eigene Domain (bereits auf Cloudflare verwiesen)

• Grundlegende Vertrautheit mit dem Cloudflare-Dashboard

Schritt 1: Einrichten des benutzerdefinierten Unterordners in Ferndesk

Konfigurieren Sie zunächst Ihr Ferndesk Help Center für die Verwendung eines benutzerdefinierten Unterordner-Pfads.

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

2. Klicken Sie auf Custom domain

   

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

   

4. Geben Sie Ihre Domain im Feld Domain ein (z. B. ihredomain.de).

5. Geben Sie den gewünschten Unterordner-Pfad im Feld Subdirectory ein (z. B. /help oder /docs).

6. Klicken Sie auf Configure sub-folder.

Schritt 2: Erstellen eines Cloudflare Workers

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 beschreibenden 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 Traffic von Ihrem benutzerdefinierten Unterordner zum Cloudflare Worker leitet.

1. Navigieren Sie in den Worker-Einstellungen zum Tab Settings.

   

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

   

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

   

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

5. Geben Sie im Feld Route das Muster für Ihren Unterordner-Pfad ein. Verwenden Sie ihredomain.de/help, um alle Anfragen an den Pfad /help und dessen Unterpfade zu erfassen.

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

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 modales Fenster öffnet sich. Wählen Sie die Option Route.

   

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

4. Geben Sie im Feld Route das Muster für Ihren Unterordner-Pfad ein. Verwenden Sie ihredomain.de/_ferndesk, um alle Anfragen an den Pfad /_ferndesk und dessen Unterpfade zu erfassen.

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

6. Klicken Sie auf Add route.

   

Schritt 4: Bearbeiten des Worker-Codes

Aktualisieren Sie nun den Worker-Code, um die Reverse-Proxy-Logik zu verarbeiten. 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 Code in worker.js 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 Ihnen bei der Konfiguration Ihres benutzerdefinierten Unterordners mitgeteilt wurde. Ersetzen Sie PROXY_PREFIX, falls Sie einen anderen Unterordner-Pfad 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 Unterordner-Pfad erreichbar ist.

1. Öffnen Sie einen neuen Browser-Tab und navigieren Sie zu https://ihredomain.de/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.

Fehlerbehebung