Wie richte ich kostenloses TYPO3 Cloudflare ein?

Wie richte ich kostenloses TYPO3 Cloudflare ein?

This article machine-based automatically translated from English to the German language. As this article is not human translated, there may be chances of context, spelling and grammar mistakes. We recommend to read original article in English version.

Bei der Ladezeit einer TYPO3-Website zählt jede Sekunde. Wenn eine TYPO3-Website mehr als ein paar Sekunden zum Laden braucht, werden die Besucher sie fast sofort wieder verlassen. Mit den beiden Legenden TYPO3 + Cloudflare wird Ihre TYPO3-Website superschnell sein, mal sehen wie!

Liebe TYPO3-Leserinnen und Leser, wie es mein Ritual ist, bevor ich etwas schreibe, möchte ich diesen Blog folgenden Personen widmen Xavier Perseguers für die Entwicklung und Pflege seiner großartigen TYPO3 Cloudflare Client TYPO3-Erweiterung. Und natürlich an alle Leute, die zu dieser TYPO3-Erweiterung beigetragen haben. Diese TYPO3-Erweiterung hat mich dazu inspiriert, diesen Blog zu schreiben. #T3Kudos an alle!

Was ist Cloudflare CDN?

"Ein Content-Delivery-Network (CDN) ist eine geografisch verteilte Gruppe von Servern, die zusammenarbeiten, um eine schnelle Bereitstellung von Internetinhalten zu ermöglichen.

 

Eine der Funktionen von Cloudflare CDN ist die Erhöhung der Ladegeschwindigkeit von Internet-Seiten. Es funktioniert, indem es mehr als eine Kopie der Datensätze Ihrer Website auf Proxy-Servern weltweit vorhält. 

Dieser Ansatz bedeutet, dass, sobald Menschen auf Ihre Inhalte zugreifen müssen, die Anfrage an Server in der Nähe ihres Standorts weitergeleitet wird, um eine sofortige Verarbeitung zu ermöglichen.

Cloudflare CDN bietet zusätzlich Sicherheit gegen potenzielle DDoS-Angriffe und gewährleistet so den Datenschutz für Ihr Unternehmen und Ihre Kunden.

Warum TYPO3 Cloudflare CDN?

"CDNs bieten eine einfache Möglichkeit, die Geschwindigkeit einer Website zu erhöhen und gleichzeitig die Latenzzeit zu verringern. Daher sind sie für die schnelle, effiziente und sichere Bereitstellung von Inhalten für Nutzer auf der ganzen Welt unerlässlich."
- Akamai

Hier sind einige der wichtigsten Vorteile der Nutzung von Cloudflare für Ihre TYPO3-Website:

Schnelle Reaktionszeit

Cloudflare nutzt das Aspekt-Computing, das für die effiziente Übertragung von Daten von einem Server zum anderen verantwortlich ist. Diese Funktion verkürzt die Bereitschaftszeit Ihrer Webseitenbesucher und verbessert das allgemeine Kundenerlebnis.

Schutz der Website

Benutzer können die Sicherheitseinstellungen für Websites über das Cloudflare-Dashboard anpassen, um potenzielle Online-Bedrohungen zu blockieren. Einige Sicherheitsfunktionen bestehen aus einer Web Utility Firewall (WAF) und DDoS-Schutz.

SSL-Zertifikat

Secure Socket Layer (SSL-Zertifikat) ist ein Softwareprogramm, das die Daten einer Website schützt, indem es sicherstellt, dass nur autorisierte Computersysteme oder Browser auf sie zugreifen können.

Wie funktioniert TYPO3 Cloudflare?

Meet Cloudflare + TYPO3 (#1 Faster OpenSource CMS)

TYPO3 ist die Nummer eins unter den Open-Source-CMS, die in einem der Page-Performance-Berichte die höchste Bewertung erhält. Seien Sie stolz auf meinen Freund ;)

Test-Laufwerk TYPO3 Cloudflare

Das Team von T3Terminal liebt die TYPO3 Cloudflare-Integration; Hier ist der Grund! Die Geschwindigkeit unseres T3Terminal-Marktplatz-Portals und -Blogs wird rasend schnell.

Schritt-für-Schritt-Anleitung zu TYPO3 Cloudflare

Ich werde die Installation und Konfiguration von Cloudflare und der TYPO3-Cloudflare-Erweiterung im Detail beschreiben.

1. Erstellen eines Cloudflare-Kontos

Melden wir uns für ein kostenloses Cloudflare-Konto von https://dash.cloudflare.com/sign-up 

2. Hinzufügen des Domainnamens zu Cloudflare

Gehen Sie zu Ihrem Cloudflare Dashboard. Wählen Sie die Schaltfläche Add Site.

Fügen Sie die URL Ihrer TYPO3-Website hinzu. Cloudflare erlaubt es seinen Nutzern, so viele Websites hinzuzufügen, wie sie wollen, sogar in der kostenlosen Version.

 

Wählen Sie nun Ihren Tarif aus. Für Ihre persönliche und kleine Website empfehle ich Ihnen, die kostenlose Version zu wählen. Sie enthält alle erforderlichen Grundfunktionen, um Ihre Website vor Online-Bedrohungen zu schützen und ihre Ladegeschwindigkeit zu verbessern.

3. Überprüfen der DNS-Einträge Ihres Domänennamens

Sobald Ihre TYPO3-Website zu Cloudflare hinzugefügt wurde, werden Sie aufgefordert, die DNS-Details des Domainnamens einzugeben. In diesem Schritt können Sie Cloudflare für bestimmte Subdomains aktivieren oder deaktivieren.

Zum Aktivieren schalten Sie einfach das Wolkensymbol auf orange um.

4. Verweisen Sie Ihren Domainnamen auf Cloudflare Nameserver

Nachdem Sie Cloudflare für Ihre Domain und Subdomains aktiviert haben, sehen Sie auf der nächsten Seite die Nameserver von Cloudflare. Es ist wichtig, dass Sie die alten Nameserver durch Cloudflare ersetzen.

Um auf die Cloudflare-Nameserver zuzugreifen, klicken Sie im Dashboard auf die Registerkarte DNS.

Unter dem Abschnitt DNS-Verwaltung sehen Sie die Cloudflare-Nameserver, die Ihrer Website zugewiesen sind. Kopieren Sie diese Werte.

3. Öffnen Sie einen neuen Browser-Tab und gehen Sie zu Ihrem Hosting-Kontrollpanel. In diesem Beispiel finden Sie die Details der Nameserver unter der Registerkarte Domains.

Es kann bis zu 72 Stunden dauern, bis die DNS weltweit verbreitet sind. Sobald die Aktualisierung der Nameserver abgeschlossen ist, erhalten Sie eine E-Mail-Bestätigung von Cloudflare.

5. Konfigurieren Sie die HTTPS-Einstellungen

Gehen Sie auf die Registerkarte SSL in Ihrem Cloudflare-Dashboard. Wählen Sie Full SSL, wenn Sie ein bestehendes SSL-Zertifikat haben, oder Flexible SSL, wenn Sie keins haben.

Gehen Sie zum Abschnitt Edge Certificates und aktivieren Sie Always Use HTTPS. Es kann eine Weile dauern, bis die Änderungen sichtbar sind, überprüfen Sie sie also nach ein paar Stunden. Sobald Sie eine Bestätigungsmeldung und ein Vorhängeschloss-Symbol neben der URL der Website sehen, wissen Sie, dass das Zertifikat aktiv ist. 

Gehen Sie auf die Registerkarte SSL in Ihrem Cloudflare-Dashboard. Wählen Sie Full SSL, wenn Sie ein bestehendes SSL-Zertifikat haben, oder Flexible SSL, wenn Sie keins haben.

Gehen Sie zum Abschnitt Edge Certificates und aktivieren Sie Always Use HTTPS. Es kann eine Weile dauern, bis die Änderungen sichtbar sind, überprüfen Sie sie also nach ein paar Stunden. Sobald Sie eine Bestätigungsmeldung und ein Vorhängeschloss-Symbol neben der URL der Website sehen, wissen Sie, dass das Zertifikat aktiv ist. 

6. API von Cloudflare abrufen

Wählen Sie hier unten die Option API-Schlüssel abrufen aus.

Es öffnet sich ein neues Fenster. Gehen Sie auf die Registerkarte API-Token und wählen Sie dann Ansicht aus der Option Globaler API-Schlüssel.

7. Installieren und konfigurieren Sie die Cloudflare TYPO3 Extension

  1. TYPO3 Cloudflare-Erweiterung installieren

Gehen Sie zu Ihrem TYPO3-Backend > Admin-Tools > Extensions Manager; Wählen Sie Ihren Weg zur Installation der TYPO3 Cloudflare-Extension aus TER oder Composer-basiert https://extensions.typo3.org/extension/cloudflare 

2. TYPO3 Cloudflare konfigurieren

Gehen Sie zu Admin Tools > Settings > Configure Extensions > Set Email and API Keys of Cloudflare.

Für die erweiterte Konfiguration der TYPO3 Cloudflare Extension, lesen Sie bitte unter

Profi-Tipps

Jetzt wird Ihre gesamte TYPO3-Website von Cloudflare zwischengespeichert; stellen Sie sicher, dass Sie Cloudflare Cache für das TYPO3-Backend deaktivieren. Gehen Sie zu Cloudflare > Regeln > Erstellen Sie neue Regeln wie unten.

 

// Cache-Level und Leistung einstellen
URL pattern: www.example.com/typo3/*
Cache Level: Bypass
Performance: off

Common TYPO3 Cloudflare Problems

Eine sehr häufige Fehlermeldung, die Benutzer erhalten, wenn sie versuchen, Cloudflare auf ihrer TYPO3-Website zu installieren, ist "ERR_TOO_MANY_REDIRECTS" in Chrome oder "Die Seite wird nicht richtig weitergeleitet" (Firefox).

Das liegt daran, dass Sie SSL bereits auf Ihrem Webserver eingerichtet haben und dann Flexible SSL bei Cloudflare aktiviert haben. Wenn Sie bereits ein SSL-Zertifikat bei Ihrem Webhost haben, müssen Sie den SSL-Modus auf "Full" umstellen.

In TYPO3 konfigurieren Sie bitte die folgenden Einstellungen, um Ihr TYPO3 mit SSL/HTTPS zu betreiben.

 

// Unter TYPO3 v8
config.baseURL = www.example.com
[globalString = ENV:HTTP_X_FORWARDED_PROTO=https, ENV:HTTPS=on]
config.baseURL = www.example.com
[global]
// Über TYPO3 v9
Zur Website gehen > Site Management > Legen Sie Ihren Domänennamen mit HTTPS fest.

Wie löscht man den TYPO3 Cloudflare Cache?

Option 1 - Cloudflare-Cache in der TYPO3-Erweiterung löschen

Gehen Sie zu Seite > Wählen Sie Ihre erstellte/bearbeitete Seite aus > Klicken Sie auf das Symbol "Cache löschen".

Option 2 - Cloudflare-Cache in der Systemsteuerung löschen

Eine andere Möglichkeit besteht darin, den Cache von Cloudflare über das Bedienfeld zu löschen. Klicken Sie dazu auf die Registerkarte "Caching" und dann auf "Purge Everything".

Sobald alles reibungslos funktioniert, ist es besser, nur den Cache einzelner Dateien zu löschen. Cloudflare bietet eine einfache Möglichkeit, dies zu tun.

Tipps und Tricks von TYPO3 Cloudflare

Hier sind die wichtigsten Konfigurationen von TYPO3 Cloudflare, die Ihre TYPO3-Site schneller und sicherer machen.

TYPO3-Bilder mit Größenänderung + Polieren

Sie können die Größe ändern, die Qualität anpassen und Bilder bei Bedarf in das WebP-Format konvertieren. Wir zwischenspeichern jedes abgeleitete Bild am Rand, sodass Sie nur das Originalbild speichern. So können Sie Bilder schnell und einfach an das Layout Ihrer Website und die Bildschirmgrößen Ihrer Besucher anpassen, ohne eine serverseitige Bildverarbeitungspipeline zu unterhalten.

Auto Minify - TYPO3-Quellcode verkleinern

Auto Minify entfernt unnötige Zeichen aus Ihrem Quellcode (wie Leerzeichen, Kommentare usw.), ohne dessen Funktionalität zu verändern. Durch Minifizierung kann die Größe der Quelldatei komprimiert werden, wodurch die Datenmenge, die an die Besucher übertragen werden muss, verringert und somit die Ladezeiten der Seite verbessert werden.

Firewall - Sichern Sie Ihre TYPO3-Site

Beachten Sie alle von Cloudflare bereitgestellten Sicherheitseinstellungen; gehen Sie zu Cloudflare > Firewall > Einstellungen.

Rocket Loader - Steuern Sie Ihr schweres JavaScript

Rocket Loader verbessert die Ladezeiten für Seiten, die Javascript enthalten. Die Besucher haben ein besseres Erlebnis, da die Inhalte schneller geladen werden, und die Geschwindigkeit ist auch ein Faktor bei einigen Suchrankings. Rocket Loader verbessert die Ladezeiten, indem es Ihre Javascripts, einschließlich der Skripte von Drittanbietern, asynchron lädt, so dass sie das Rendern des Inhalts Ihrer Seiten nicht blockieren.

Mirage - Verbesserung der Ladezeit

Mirage passt das Laden von Bildern je nach Netzwerkverbindung und Gerätetyp an. Geräte mit kleinen Bildschirmen erhalten kleinere Bilder, und langsamere Verbindungen erhalten Bilder mit geringerer Auflösung. Dies beschleunigt das Rendern der Seite, so dass die Benutzer mit Ihrer Website interagieren können, ohne darauf warten zu müssen, dass die Bilder zuerst heruntergeladen werden.

Brotli - Erweiterte Komprimierungsmethode

Cloudflare wendet die Brotli-Kompression an, um die Ladezeiten für Ihre Besucher zu verkürzen. Cloudflare wählt die Brotli-Komprimierung als bevorzugte Content-Encoding-Methode, wenn mehrere Komprimierungsmethoden vom Client unterstützt werden. Wenn der Client nicht angibt, dass die Brotli-Kompression unterstützt wird, wird die gzip-Kompression angewendet.

Seitenregeln - Umgehen Sie Ihre TYPO3-Seiten

Cloudflare bietet eine coole Funktion namens "Page Rules"; Sie können seitenweise Regeln konfigurieren, z. B. müssen einige Ihrer Seiten den Cache umgehen, Sie können es tun.

Einpacken!

Vielen Dank, dass Sie meinen TYPO3 Blog gelesen haben. Ich hoffe, dass er Ihnen gefallen hat und Sie ihn hilfreich fanden.

Ein Content Delivery Network ist ein wichtiger Dienst, der Ihnen dabei hilft, die Geschwindigkeit Ihrer Webseite zu erhöhen. Von den verschiedenen Möglichkeiten, die es gibt, empfehle ich Ihnen Cloudflare für Ihr TYPO3 CMS. Es bietet einen zuverlässigen CDN-Service mit hervorragender Sicherheit und standardmäßiger Verbesserung der Gesamtleistung.

Haben Sie irgendwelche Probleme oder Fragen zu TYPO3 Cloudflare? Ich beantworte Ihre Fragen gerne in der Kommentarbox.

Ich wünsche Ihnen eine glückliche TYPO3 Speedy Site!

Post Comment

Your email address will not be published. Required fields are marked *

×

Name ist erforderlich!

Geben Sie einen gültigen Namen ein

Gültige E-Mail ist erforderlich!

Gib eine gültige E-Mail Adresse ein

Kommentar ist erforderlich!

Google Captcha ist erforderlich!

Bemerkungen :

  • Sofia Peters October 6, 2021 Beim 12:54 pm
    One of the main reasons I use cloudflare is that it is highly convenient, easy to use and powerful. I have been using it for the last 6+ years and one thing to notice about your blog is that you have covered every topic a beginner, intermediate or an expert would require.
  • Noah Neumann October 4, 2021 Beim 11:53 am
    Nice tutorial on the installation and configuration of Cloudflare. I was having a similar problem while using CloudFlare as my CDN but your blog helped me solve it.
    Thank you.
  • Ben Schulz September 30, 2021 Beim 12:51 pm
    Cloudflare seems great but right now, I am using CloudFront CDN which is backed by Amazon and it works very well, But I would like to try Cloudflare after reading this blog. Thanks for also showing the installation and configuration steps, it will help me a lot.
[Translate to German:]

25+ Neue Erweiterungen in TYPO3 v11.3

TYPO3 v11.3 kommt mit einer Menge Verbesserungen an UI/UX, TYPO3 Backend, TYPO3 Templates und Benutzerfunktionen. Mit wichtigen…

TYPO3-Mythen aufgeklärt

TYPO3-Mythen erklärt (Warum sie nicht wahr sind)

Obwohl TYPO3 CMS das beliebteste und sicherste Open Source CMS ist, gibt es eine Menge Fehlinformationen, Missverständnisse und…

Trending: Was ist TYPO3 Headless CMS?

Trending: Was ist TYPO3 Headless CMS?

Das Wort "TYPO3 Headless CMS" begann zu schwirren! Die Zukunft von CMS bewegt sich schnell weg vom traditionellen hin zum Headless…

Stay up to date with our recent TYPO3 Blogs, news, & updates