Presentation about TYPO3's Configuration behind a CDN / Reverse Proxy

1. Run your TYPO3 with a CDN in 5 Minutes
... if you know how

2. @bennimack
Aug 4, 2022
Agenda
• Who is this guy?
• What is a CDN? Do I need one?
• How much does a CDN cost?
• What can a CDN cache from TYPO3?
• How do I configure TYPO3 to use a CDN?
• Dealing with Edge-Cases

3. @bennimack
Aug 4, 2022
Who is this guy?
• Benni Mack
• CTO at b13.com
• Made in Germany
• Works with TYPO3 since 2003
• Core Development but also agency customer work @ b13.com
• Focus on larger enterprises reaching out worldwide

4. Photo by NASA on Unsplash
What is a CDN? And do I need one?

5. @bennimack
Aug 4, 2022
Browser Reverse Proxy Web Server

6. @bennimack
Aug 4, 2022
Graphic by cloudflare.com

7. @bennimack
Aug 4, 2022
Browser Reverse Proxy Web Server

8. @bennimack
Aug 4, 2022
Browser Reverse Proxy Web Server

9. @bennimack
Aug 4, 2022
What is a CDN?
• Hundreds of servers in various regions that act as a cache
("reverse proxy")
to deliver content faster depending on the users' location
• Loads content from an origin server
• Keeps the content on the regional server

10. Photo by NASA on Unsplash
Do I need a CDN?

11. @bennimack
Aug 4, 2022
My website is slow
I run an intranet for
a german government
TYPO3's Backend is slow
My friend says everyone
has one these days
Nobody can touch my
... data
I want to reach
my visitors globally
I have a large
infrastructure to handle
my traffic
I have a lot of money
but not a lot of IT people

12. @bennimack
Aug 4, 2022
What does a CDN cost?
• Usually a lot of extras to it
• SSL certificates
• DDOS / Firewall / Security measurements
• DNS Management
0 € to 5.000€
/ month
/ domain

13. @bennimack
Aug 4, 2022
Do I get a CDN off of Amazon?
Amazon AWS CloudFront
Cloudflare
Microsoft Azure CDN
Google Cloud
Fastly
Akamai
Myra Cloud

14. What can a CDN cache from TYPO3?
Photo by NASA on Unsplash

15. @bennimack
Aug 4, 2022
What can a CDN cache from your website?
• Static Assets
• Images, JavaScript + StyleSheets
• Make up 80% of your website traffic
• Check your .htaccess file for details
• What about HTML Rendering?
• Only if you allow caching?
• TYPO3 Backend?
• Dynamic Content?

16. @bennimack
Aug 4, 2022
Under the hood
HTTP Response Headers
✗ curl -I https://b13.com
....
Cache-Control: max-age=231
Content-Language: de
Content-Length: 7855
Date: Mon, 01 Aug 2022 14:15:36 GMT
Expires: Mon, 01 Aug 2022 14:19:27 GMT
Pragma: public

17. How do I configure TYPO3 to use a CDN?

18. @bennimack
Aug 4, 2022
TypoScript magic
config.sendCacheHeaders = 1

19. @bennimack
Aug 4, 2022
Tune Cache Lifetime
• config.cache_timeout = 60
• config.cache_clearAtMidnight = 1

20. @bennimack
Aug 4, 2022
Some more functionality
Do not cache when
- no_cache=1 is set
- A backend user is logged in (cookie)
- A frontend user is logged in (cookie)
- Workspace Preview happens
- A "non-Cacheable" (USER_INT) element is found
- A 400+ HTTP Response code is sent
- A POST Request is sent (Form submission)
config.sendCacheHeaders = 1

21. @bennimack
Aug 4, 2022
Graphic by cloudflare.com

22. @bennimack
Aug 4, 2022
Make some TYPO3-internals work
$GLOBALS['TYPO3_CONF_VARS']['SYS']['reverseProxyIP'] = '12.23.34.45';
Needs to be set to the IP of the Edge Server

23. @bennimack
Aug 4, 2022
Additional Configuration - CloudFlare
// use Cloudflare when active
if ($_SERVER['HTTP_CF_CONNECTING_IP'] ?? false) {
$GLOBALS['TYPO3_CONF_VARS']['SYS']['reverseProxySSL'] = '*';
$GLOBALS['TYPO3_CONF_VARS']['SYS']['reverseProxyIP'] = '*';
$GLOBALS['TYPO3_CONF_VARS']['SYS']['reverseProxyHeaderMultiValue'] = 'first';
}

24. @bennimack
Aug 4, 2022
Additional Configuration - AWS CloudFront
$cloudFrontToken = getenv('CLOUDFRONT_TOKEN');
if (array_key_exists('HTTP_CLOUDFRONT_TOKEN', $_SERVER) && strtolower($_SERVER['HTTP_CLOUDFRONT_TOKEN']) ==
$cloudFrontToken) {
if (array_key_exists('HTTP_VIA', $_SERVER) && stripos($_SERVER['HTTP_VIA'], 'cloudfront') !== false) {
if (array_key_exists('HTTP_CLOUDFRONT_FORWARDED_PROTO', $_SERVER) &&
strtolower($_SERVER['HTTP_CLOUDFRONT_FORWARDED_PROTO']) == 'https') {
$GLOBALS['TYPO3_CONF_VARS']['SYS']['reverseProxyIP'] = $_SERVER['REMOTE_ADDR'];
$GLOBALS['TYPO3_CONF_VARS']['SYS']['reverseProxySSL'] = '*';
$GLOBALS['TYPO3_CONF_VARS']['SYS']['trustedHostsPattern'] = '^.*example.com$';
}
}
}

25. @bennimack
Aug 4, 2022
How to find out the details
• cURL -I https://url-behind-a-cdn.com/
• benni.php

26. @bennimack
Aug 4, 2022
Advanced Tools
Flush CDN Caches when content is changed
->
EXT:proxycachemanager
Various adapters
->
EXT:akamai, EXT:cloudflare_cdn, EXT:azure_purge
Cache Parts of a Page
->
Edge Workers
Optimize with Cache Tags
->
TCEMAIN.clearCacheCmd = 12,cacheTag:news

27. Edge-Cases

28. @bennimack
Aug 4, 2022
Check if your site is ready
• What about GDPR?
• Do you have USER_INT plugins?
• How to deal with login forms or forms in general?
• Disable no_cache=1 forever via
$GLOBALS['TYPO3_CONF_VARS']['FE']['disableNoCacheParameter'] = 1;
• Be creative when building solutions
• Do you have variants for different regions?

29. @bennimack
Aug 4, 2022
Summary
Understand TYPO3:
* config.sendCacheHeaders = 1
* $GLOBALS['TYPO3_CONF_VARS']['SYS']['reverseProxyIP'];
* cache_tags
Configure CDN, htaccess
Learn to read HTTP Headers

30. Thanks for listening
Questions? @bennimack